CODEWITHSUNDEEP
jqgrid
rey
rey

Reputation: 51

JQGrid within a dialog

How will you display a JQGrid within a dialog?

Upvotes: 5

Views: 7619

Answers (3)

aamir sajjad
aamir sajjad

Reputation: 3039

in html page place table tag which will be used to construct grid inside dialog div like

<div id="dialog-div">
 <table id="JqGrid">
</table>
 <div id="pager" style="text-align: center;  </div>
</div>

then in js first set dialog settings like

$("#dialog-div").dialog({
            width: 'auto',
            resizable: false,
            height: '395',
            autoOpen: false,
            open: function (event, ui) {
           ConstructJqGrid();
            },

        });
function ConstructJqGrid(){


jQuery("#JqGrid").jqGrid({
...
   colModel: [ 
      ... 
      {name:'price', ..., editable:true, edittype:'custom', editoptions:{custom_element: myelem, custom_value:myvalue} },
      ...
   ]
...
})
}

Upvotes: 5

Monkios
Monkios

Reputation: 153

This is how I did it, with AJAX to get the page containing my jqGrid :

$.ajax({
   [...],
   success: function( data ){
      var popup = document.createElement( "div" );

      // Appending
      $( popup ).append( data );
      $( "body" ).append( popup );

      // Dialoging
      $( popup ).dialog({
         [...]
      });
   }
});

PS : I don't know the rules about necroposting but since the answer was never given, I chose to answer it.

Upvotes: 2

vladikoff
vladikoff

Reputation: 1514

If you are using the jquery-ui dialog use this page,the first example will show you how to create a dialog with #dialog. Then this page will have a have a basic JQGrid example which you will embed into your #dialog. If you are using a different type of a dialog, the process should be similar.

Upvotes: 0

Related Questions