Databases
StackOverflow2013
Postsdbo
POCorrectly calling setGridWidth on a jqGrid inside a jQueryUI Dialog
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POCorrectly calling setGridWidth on a jqGrid inside a jQueryUI Dialog
    primarykey
    data
    text
    <p>I have a jQueryUI dialog (<code>#locDialog</code>) which has a jqGrid (<code>$grid</code>) inside it. When the Dialog opens (initially, but it gets called whenever it opens), I want the <code>$grid</code> to resize to the size of the <code>$locDialog</code>. When I do this initially, I get scrollbars inside the grid (not inside the dialog).</p> <p>If I debug the code, I see the width of the <code>$grid</code> is 677. So, I call <code>setGridWidth()</code> again and check the width and now I have 659, which is 18px less, which is the size of the scroll area for the jqGrid (Dun-dun-dun..)</p> <p>When I rezie the dialog, I resize the grid as well, and everything is happy - no scrollbars, except where necessary.</p> <p>My dialog init code:</p> <pre><code>$locDialog = $('#location-dialog').dialog({ autoOpen: false, modal: true, position: ['center', 100], width: 700, height:500, resizable: true, buttons: { "Show Selected": function() {alert($('#grid').jqGrid('getGridParam','selarrrow'));}, "OK": function() {$(this).dialog('close');}, "Cancel": function() {$(this).dialog('close');} }, open: function(event, ui) { $grid.setGridHeight($(this).height()-54); // No idea why 54 is the magic number here $grid.setGridWidth($(this).width(), true); }, close: function(event, ui) { }, resizeStop: function(event, ui) { $grid.setGridWidth($locDialog.width(), true); $grid.setGridHeight($locDialog.height()-54); } }); </code></pre> <p>I am curious if anyone has seen this before. Really, it isn't the end of the world if I initially have unnecessary scrollbars at first, but it is just odd that when I call setGridWidth initially, it doesn't take into account the scroll area of 18px.</p> <p>As far as the magical number 54, that is the number I had to subtract from the height of the dialog value to get the grid to render without unnecessary scrollbars.</p> <hr> <p>I think it may be a timing issue, though this doesn't make a lot of sense. Perhaps I should call an event once the grid is completely loaded. This may ensure it calculates its width correctly.</p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USChrisF
    1. USDan
    plurals
    1. PL
      singulars
      1. LTLinked
    1. PL
      singulars
      1. LTLinked
    2. PL
      singulars
      1. LTLinked
    3. PL
      singulars
      1. LTLinked
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POCorrectly calling setGridWidth on a jqGrid inside a jQueryUI Dialog
      1. This table or related slice is empty.
      1. VTUpMod
    2. VO
      singulars
      1. POCorrectly calling setGridWidth on a jqGrid inside a jQueryUI Dialog
      1. This table or related slice is empty.
      1. VTUpMod
    3. VO
      singulars
      1. POCorrectly calling setGridWidth on a jqGrid inside a jQueryUI Dialog
      1. USkajo
      1. VTFavorite
    1. This table or related slice is empty.
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload