ホームページ  >  記事  >  ウェブフロントエンド  >  jQuery EasyUIでのデータインスタンスの追加の詳細な説明

jQuery EasyUIでのデータインスタンスの追加の詳細な説明

小云云
小云云オリジナル
2017-12-27 10:35:171952ブラウズ

この記事では主に jQuery で開発された EasyUI でのデータ追加の例についての関連情報を紹介します。この部分を理解して習得するのに役立つことを願っています。 。

データを追加する jQuery 開発 EasyUI の例

1. ツールバーを作成します:


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

2. ユーザーを追加するためのフォームを含むダイアログを追加します


<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.開くダイアログボックス:
function openAddUserDialog(){
  $(“#addDialog").dialog(&#39;open&#39;);
}

4サーバーによって返されます。 Excelテーブルにデータを追加する方法


jQuery EasyUIの共有例 開発スキルまとめ

以上がjQuery EasyUIでのデータインスタンスの追加の詳細な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。