Detailed explanation of adding data instances in jQuery EasyUI

This article mainly introduces relevant information about the examples of adding data in EasyUI developed by jQuery. I hope this article can help everyone understand and master this part of the content. Friends who need it can refer to it. I hope it can help everyone.

JQuery Development EasyUI Example of Adding Data

1. Create toolbar:

toolbar:[{
  text:'增加',
  iconCls:'icon-add',
  handler:function(){
    openAddUserDialog();
  }
}]

2. Add a dialog, which contains a form for adding users

<p id="addDialog" data-options="closed:true,modal:true,title:&#39;addUser&#39;, buttons:[{
  text:&#39;保存&#39;,
  iconCls:&#39;icon-add&#39;,
  handler:function(){
    //addUser();
    $(&#39;#addForm&#39;).form(&#39;submit&#39;,{url:&#39;${rootPath}/user_add.action&#39;,success:function(data){
      var result = JQuery.parseJSON(data);
      if(result.success){
        //$("#datagrid").datagrid(&#39;reload&#39;);
        $("#addDialog").dialog(&#39;close&#39;);
        //把插入的数据添加到最后一行
        //$("#datagrid").datagrid(&#39;appenRow&#39;,result.obj);
        $("#datagrid").datagrid(&#39;insertRow&#39;,{
          index:0;
          row:result.obj//obj里面存了user对象
        });
      }
      $.message.show({
        title:&#39;提示&#39;,
        msg:obj.msg
      });
    }});
  }

}]" class="easyui-dialog">
  <table>
    <tr>
    <th></th>
    <tr/>
  </table>
</p>

3. Open the dialog box:

function openAddUserDialog(){
  $(“#addDialog").dialog('open');
}

4. json returned by the server

//返回的json
public class Json implements java.io.Serializable {

  /**
   * 
   */
  private static final long serialVersionUID = 1L;

  private boolean success = false;

  private String msg = "";

  private Object obj = null;

  public boolean isSuccess() {
    return success;
  }

  public void setSuccess(boolean success) {
    this.success = success;
  }

  public String getMsg() {
    return msg;
  }

  public void setMsg(String msg) {
    this.msg = msg;
  }

  public Object getObj() {
    return obj;
  }

  public void setObj(Object obj) {
    this.obj = obj;
  }

}

Related recommendations:

php lazy function automatically adds data

C#How to update and add data to Excel table using Ado.Net

Example sharing jQuery EasyUI development skills summary

The above is the detailed content of Detailed explanation of adding data instances in jQuery EasyUI. For more information, please follow other related articles on the PHP Chinese website!