title: JqGrid Inline Adding Record Save
body: <p>I've gone through many of the questions regarding adding records inline in JqGrid but I haven't been able to figure it out. I have inline editing working and adding a record using a modal popup.  I'm using ASP.NET MVC5 with EF.</p>
  
  <p>I have the add button already working with a modal popup and the record saves to the database, but what I need is for an empty line to be added to the end of the grid (which I have working) and for the record to save to the database when the enter key is pressed after the fields have been entered. Thank you in advance for your help!</p>
  
  <p>I'm using jqgrid version 4.4.4.</p>
  
  <p>Here is the create method I'm currently using in the controller:</p>
  
  <pre><code>    [HttpPost]
      public string Create([Bind(Exclude = "TRANS_ID")] TRANSACTIONS_DETAIL tcrdetails)
      {
          string msg;
          try{
              ModelState.Remove("TRANS_ID");
              if(ModelState.IsValid)
              {
                  db.TRANSACTIONS_DETAIL.Add(tcrdetails);
                  db.SaveChanges();
                  msg = "Saved Successfully";
              }
              else
              {
                  msg = "Validation data not successfull";
              }
          }
          catch(Exception ex)
          {
              msg = "Error occured: " + ex.Message;
          }
          return msg;
      }
  </code></pre>
  
  <p>I have inline editing working as you can see in this next code block:</p>
  
  <pre><code>    $("#grid").jqGrid({
      url: "/Transactions/GetTransactions/",
      /*url: "/Transactions/GetTransactions/@ViewBag.hohupi",*/
  
      addParams: {
          position: "afterSelected",
          addRowParams: {
              // the parameters of editRow used to edit new row
              keys: true,
              oneditfunc: function (rowid) {
                  alert("new row with rowid=" + rowid + " are added.");
              }
          }
      },
  
      //url for inline edit
      editurl: "/Transactions/Modify",
      //event for inline edit
      onSelectRow: function(currentSelectedRow){
          if(currentSelectedRow &amp;&amp; currentSelectedRow != $.lastSelectedRow){
              //save changes in row 
              $('#grid').jqGrid('saveRow', $.lastSelectedRow, false);
              $.lastSelectedRow = currentSelectedRow; 
          }
          //$('#grid').jqGrid("inlineNav", "#pager", { addParams: { position: "last" } });
          $('#grid').jqGrid('inlineNav', '#pager', { addParams: { position: "last" } });
          //trigger inline edit for row
          $('#grid').jqGrid('editRow', $.lastSelectedRow, true);
         // $('#grid').jqGrid('addRow', $.lastSelectedRow, true);
      },
  </code></pre>
  
  <p>The following code has been one of my many attempts to get the inline adding working. I got the blank row to add, but I can't get it to save when pressing enter after all the fields have been entered:</p>
  
  <pre><code>    .navButtonAdd('#pager',{caption:"ADD", buttonicon :'ui-icon-circle-plus',onClickButton:function(id){
  var newID=1;
  $("#grid").find("tbody tr").each(function(){if(newID&lt;=parseInt(this.id)){newID=parseInt(this.id)+1;}});
  var datarow = {
  
      HOH_UPI: "", ICI: "", BILL_QTR: "",
      BNFT_YR: "", BNFT_MTH: "", AMOUNT: "", TRANS_TYPE: "",
      CHECK_NMB: "", CHK_DT_RCVD: "", ENTRY_DT: "", NAME_ON_CHECK: "",
      INDV_BATCH_NMB: "", USER_INIT: "", RTN_CHK_DT: "", LATE_DT: "",           FINAL_DT: "", COMMENTS: "", Modified_date: ""
  
  };
  var su=jQuery("#grid").addRowData(newID,datarow,"last");
  if (su)       {jQuery("#grid").editRow(newID,true);jQuery("#grid").saveRow(newID,false);}}, title:"Add_new_row", position:"last" });
  </code></pre>