JQGrid dentro de un cuadro de diálogo

Question

¿Cómo visualizará un JQGrid dentro de un cuadro de diálogo?

Answer 1

Si está usando el diálogo jquery-ui use this page, el primer ejemplo le mostrará cómo crear un diálogo con #dialog. Luego, this page tendrá un ejemplo básico de JQGrid que usted incluirá en su #dialog. Si está utilizando un tipo diferente de diálogo, el proceso debería ser similar.

Answer 2

Esta es la forma en que lo hice, con AJAX para obtener la página que contiene mi jqGrid:

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

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

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

PD: No sé las reglas sobre necroposting pero ya que la respuesta nunca se le dio, yo escogimos contestarlo.

Answer 3

en la página html lugar etiqueta de tabla que se utilizará para la construcción de rejilla en el interior div diálogo como

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

luego en ajustes del diálogo conjunto js primeros como

$("#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} }, 
     ... 
    ] 
... 
}) 
}