title: jqGrid reload from custom editFunc not working
body: <p>I have a code for jqGrid with custom "editFunc" that opens my own jQuery-UI Panel to edit the data. </p>
  
  <p>It saves the data without problems, but I can't get jqGrid to be updated with new data automatically using "$("#blog-posts").trigger("reloadGrid");" It doesn't work from "editFunc". The code is below. Not sure how to fix it. 
  What I'm doing wrong here?</p>
  
  <p>Another way I thought about is to do not do a full jqGrid reload, but update only the edited data. How to update a successfully edited jqGrid row with sucessfuly changed record data "manually" from editFunc, without reloading all records?</p>
  
  <p>Here is my jqGrid config:</p>
  
  <pre><code>&lt;table id="blog-posts"&gt;
  &lt;/table&gt;
  &lt;div id="blog-posts-nav"&gt;
  &lt;/div&gt;
  &lt;div id="edit-blog-post"&gt;
  &lt;/div&gt;
  &lt;script type="text/javascript"&gt;
  
      function wireUpForm(dialog, updateTargetId, updateUrl) {
          $('form', dialog).submit(function () {
              $.ajax({
                  url: this.action,
                  type: this.method,
                  data: $(this).serialize(),
                  success: function (result) {
                      // Check whether the post was successful
                      if (result.success) {
                          // Close the dialog
                          $(dialog).dialog('close');
                          // reload doesn't work if called from here
                          $("#blog-posts").trigger("reloadGrid");
                      } else {
                          // Reload the dialog to show model errors
                          $(dialog).html(result);
                          // Setup the ajax submit logic
                          wireUpForm(dialog, updateTargetId, updateUrl);
                      }
                  }
              });
              return false;
          });
      }
  
      $('#blog-posts').jqGrid({
          url: 'http://localhost:24533/Admin/BlogPosts',
          datatype: "json",
          colModel: [
          { name: 'id', index: 'id', label: 'Post ID', width: 55 },
          { name: 'enabled', index: 'enabled', label: 'Enabled', width: 60, editable: true, edittype: "checkbox", editoptions: { value: "Yes:No"} },
          { name: 'slug', index: 'slug', label: 'Slug', width: 300, editable: true, editoptions: { style: "width:300px;"} },
          { name: 'header', index: 'header', label: 'Header', width: 300, editable: true },
          { name: 'HtmlTitle', index: 'HtmlTitle', label: 'HTML Title', width: 300, editable: true },
          {name: 'created', index: 'created', label: 'Created', width: 100, editable: true },
          { name: 'lastUpdate', index: 'lastUpdate', label: 'Last Update', width: 100 }
      ],
          rowNum: 10,
          rowList: [10, 20, 30],
          pager: '#blog-posts-nav',
          sortname: 'id',
          viewrecords: true,
          sortorder: "desc",
          caption: "Blog Posts",
          height: 210,
      });
      $('#blog-posts').jqGrid('navGrid', '#blog-posts-nav',
          {
             editfunc: function (rowid) {
                  var element = $(this);
                  // Retrieve values from the HTML5 data attributes of the link
                  var dialogId = '#edit-blog-post';
                  var dialogTitle = 'Dialog Title';
                  var updateTargetId = '#container-to-update';
                  var updateUrl = 'http://localhost:24533/Admin/BlogPostEdit/';
                  // Load the form into the dialog div
                  $(dialogId).load('http://localhost:24533/Admin/BlogPostEdit?id=' + rowid, function () {
                      $(this).dialog({
                          modal: false,
                          resizable: true,
                          minWidth: 650,
                          minHeight: 300,
                          height: $(window).height() * 0.95,
                          title: dialogTitle,
                          buttons: {
                              "Save": function () {
                                  // Manually submit the form
                                  var form = $('form', this);
                                  //alert('1');
                                  $(form).submit();
                                  $("#blog-posts").trigger("reloadGrid");
                                  //alert('2');
                              },
                              "Cancel": function () {
                                  //alert($("#blog-posts"));
                                  //$("#blog-posts").trigger("reloadGrid");
                                  //alert($("#blog-posts").getCell(2,2));
                                  //alert($("#blog-posts").getGridParam('caption'));
                                  $("#blog-posts").trigger("reloadGrid");
                                  //alert(element.serialize());
                                  //element.trigger("reloadGrid");
                                  //alert(element.attr('id'));
                                  //$(this).dialog('close');
                              }
                          }
                      });
  
                      wireUpForm(this, updateTargetId, updateUrl);
                  });
  
                  return false;
              },
  
          { height: 280, reloadAfterSubmit: true }, // edit options
          {width: 600, reloadAfterSubmit: true, top: 100, left: 300, addCaption: 'Add Blog Post' }, // add options
          {reloadAfterSubmit: true }, // del options
          {} // search options
      );
  
  
      $('.wysiwyg').livequery(function () {
          $(this).wysiwyg();
      });
  
  &lt;/script&gt;
  </code></pre>
  
  <p><strong>UPDATE:</strong> The problematic line of code is</p>
  
  <pre><code> $(dialogId).load('http://localhost:24533/Admin/BlogPostEdit?id=' + rowid, function () {
  </code></pre>
  
  <p>After you do <code>jQuery.load()</code> the jqGrid's programmatic reload binding call <code>trigger("reloadGrid")</code> doesn't work anymore. The only way to reload the data that works after you do <code>jQuery.load()</code> is the reload button in the toolbar. I still don't know how to fix it.</p>
  
  <p><strong>UPDATE2 (solution):</strong> The problem was in HTML returned from jQuery.ajax() it was a full HTML page with HTML head and body tags. After server side started to return only the form jqGrid reload started to work.</p>