Detailed explanation of adding data instances in jQuery EasyUI-JS Tutorial-php.cn

Detailed explanation of adding data instances in jQuery EasyUI

小云云

Release： 2017-12-27 10:35:17

Original

2008 people have browsed it

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:&#39;增加&#39;,
  iconCls:&#39;icon-add&#39;,
  handler:function(){
    openAddUserDialog();
  }
}]

Copy after login

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>

Copy after login

3. Open the dialog box:

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

Copy after login

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;
  }

}

Copy after login

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!