jQuery Grid Plugin - jqGrid - Topic: Problem with JQGrid in Modal Dialog after reload page http://www.trirand.com/blog/?page_id=393/help/problem-with-jqgrid-in-modal-dialog-after-reload-page Simple:Press Version 5.7.5.3 cawa on Problem with JQGrid in Modal Dialog after reload page http://www.trirand.com/blog/?page_id=393/help/problem-with-jqgrid-in-modal-dialog-after-reload-page#p23943 Help http://www.trirand.com/blog/?page_id=393/help/problem-with-jqgrid-in-modal-dialog-after-reload-page#p23943 I had a problem opening a Modal Dialog after page reload. I solved using "class identifier" instead of "id".

but now I'm stuck on another problem.

In the Modal Dialog I have a JQGrid:

In example.jsp I press the button "RELOAD". Then, in "mainContent", appears the button "FIND", that open a modal dialog with a JQGrid perfectly working.

But if I press again "RELOAD" button and then "FIND" the MODAL DIALOG appears, but the JQGRID in it doesn't show any result!

'cause it seemed to be a "creating elements with same id" problem, I try to call the JQGrid with class identifier, but nothing.

Here an example: http://web.ire-omba.it:8080/pr.....sempio.jsp

example.jsp:

<script type="text/javascript">
  $(document).ready(function() {
    $('#Button1').button().click(function() {
    $("#mainContent").html('').load("example_1.jsp");
    });
  });
</script>
<input id="Button1" type="button" value="RELOAD" />
<div id="mainContent"></div>

example_1.jsp:

<script type="text/javascript">
  $(document).ready(function() {
    $(".b").button().click(function() {
      $(".d").jqGrid('setGridParam',{datatype:"json"}).trigger("reloadGrid");
      $(".c").dialog("open");
    });

    $("#a_grid").jqGrid({
      url:'search_customer.jsp',
      datatype: 'local',
      mtype: 'GET',
      colNames:['Sede','Codice','Ragione Sociale'],
      colModel :[
        {name:'sede', index:'sede', width:20, search:true, stype:'select', edittype:'select', editoptions:{value:{'IT':'IT','CN':'CN'}}, searchoptions:{value:":All;IT:IT;CN:CN"}, editable:true, editrules:{required:true}},
        {name:'codice_cliente', index:'codice_cliente', width:100, fixed:true, search:true, stype:'text', editable:true, editoptions:{size:6, maxlength:6}, editrules:{required:true}},
        {name:'cliente', index:'cliente', search:true, stype:'text', editable:true, editoptions:{size:30, maxlength:50},  editrules:{required:true}}
      ],
      pager: jQuery('#a_pager'),
      rowNum:15,
      sortname: 'cliente',
      sortorder: 'asc',
      gridwiew: true,
      viewrecords: true,
      loadonce:false,
      …
      …
    });

    jQuery("#a_grid").jqGrid('navGrid','#a_pager', {edit:false, add:true, del:false, search:false, refresh:true},
      {}, // edit options
      {}, // add options
      {}, //del options
      {multipleSearch:true} //search options
    );

    jQuery("#a_grid").jqGrid('filterToolbar',{stringResult:true, searchOnEnter:false});

    $("#a_form").dialog({
      autoOpen: false,
      height: 480,
      width: 625,
      modal: true,
      close: function() {
        $("#a_grid").dialog("close");
      }
    });
  });
</script>

<input type="button" value="FIND" class="b" />

<div id="a_form" title="Cerca Cliente" class="c">
  <table id="a_grid" align="center" class="d"></table>
  <div id="a_pager" align="center"></div>
</div>

Thank you.

]]> Tue, 12 Jul 2011 15:22:29 +0300