How to reload gridx/Grid after form submit

674 views Asked by At

How can I just call JsonRest again to target my URL and request updated Json from server right after form submit sent? Please advise me. Thanks

  var userStore = new JsonRest({target: "addUser/users", idProperty: "user_name"}),
     userColumns = [
      {id:'uuid', field: 'uuid', name: 'User UUID', width: 'auto'},
      {id:'user_name', field: 'user_name', name: 'UName', width: '7%'},
      {id:'first_name', field: 'first_name', name: 'FName', width: '0px'},
      {id:'last_name', field: 'last_name', name: 'LName', width: '0px'},
      {id:'start_date', field: 'start_date', name: 'Start', width: '0px'},
      {id:'end_date', field: 'end_date', name: 'End', width: '10%'},    
      {id:'subj_info', field: 'subj_info', name: 'Subject Info', width: 'auto'},
      {id:'issuer_info', field: 'issuer_info', name: 'Issuer Info',width: 'auto'},
      {id:'cert_fingerprint', field: 'cert_fingerprint', name: 'Cert Fingerprint', 
       width: 'auto'},
      {id:'action', field: 'action', name: '', width: '6%', widgetsInCell: true, 
      decorator: function(){
      return "<button data-dojo-type='dijit/form/Button' data-dojo-props= 
      iconClass:'dijitIconEdit' " + "data-dojo-attach-point='btn'>Update</button>";},
    // Widget Content
    myFormDialog2.show(); // Once widget is clicked display Dialog box with form data
    });}  };});}}],
              userGrid = new Grid({
              id: 'userGrid',
              cacheClass: Cache,
              store: userStore,
              structure: userColumns,
              modules: [Resizer, Sort, Pagination, Filter, Bar, "gridx/modules/CellWidget",
        "gridx/modules/Edit", "gridx/modules/select/Row", "gridx/modules/select/Cell",
              ]}, 'usersNode'); userGrid.startup();  });

********************** Dialog & Form ***************************************

<div data-dojo-type="dijit/Dialog" data-dojo-id="myFormDialog" title="Add User"
style="display: none">

    <form data-dojo-type="dijit/form/Form" id="myForm" encType="multipart/form-data" 
    action="addUser" method="post" target="uploadTrg">
        <p>First Name:
    <input data-dojo-type="dijit/form/TextBox" type="text" name="fname"size="30" /></p>
        <p>Last Name:
    <input data-dojo-type="dijit/form/TextBox" type="text" name="lname" size="30" /</p>
       <p>Upload Cert: 
        <input type="file" name="fileName" /></p>

        <div class="dijitDialogPaneActionBar">

     <button data-dojo-type="dijit/form/Button" type="submit" onclick="return 
   myFunction();">Add</button>
        <button data-dojo-type="dijit/form/Button" type="button" onclick="return 
   myFormDialog.hide();">Cancel</button>            
        </div></form></div>

  ******************************
  <script> function myFunction(){      
   alert("Form submitted!");
   myFormDialog.hide();      
   };
   </script>
  ******************************
1

There are 1 answers

0
cнŝdk On

You can just do like this:

function refresh_Grid(){
var store = new JsonRest({
target: "addUser/users"
});
myGrid=dijit.byId('userGrid');
myGrid.setStore(store);
}

And just call this function after submitting your form.

In my case, I am using dataGrid with ItemFileWriteStore and it works for me.