## DataTable.js快速上手 `/coderfun-boot-web/src/main/webapp/static/easyui/easyui-extend/dataTable.js` 使用例子 ``` var dataTable = new DataTable({ $datagrid_table :$("#datagrid-table"), $data_form_dialog : $("#data-form-dlg"), $data_form : $("#data-form"), data_form_name : "测试项目", addOpt : { url : adminActionPath+"/project/add" }, editOpt : { url : adminActionPath+"/project/edit" }, removeOpt : { url : adminActionPath+"/project/delete" }, saveOpt : {}, searchOpt : { $searchForm : $("#search-form"), } }); ``` > paramsFn会覆盖默认,增删该查都有callback。 ``` dataTable.edit(function(row){   }); dataTable.save(function(result){   }); ``` ## DataTable.js配置参数 ### options | | **required** | **说明** | | --- | --- | --- | | datagrid\_table | true | | | data\_form\_dialog | true | | | data\_form | false | 如果不写,必须配置saveOpt.paramsFn | | data\_form\_name | false | 如果不写,必须配置addOpt,editOpt的title | | addOpt | false | 如果不支持添加,不要配置url | | editOpt | false | | | saveOpt | {} | | | removeOpt | false | | | searchOpt | false | | ### addOpt | | **required** | **默认** | 说明 | | --- | --- | --- | --- | | url | false | | 如果不用支持添加,不要配置url | | urlFn | false | | 动态url | | title | false | "添加-data\_form\_name" | dialog title | | alertValidation function() | false | return true | 弹出表单之前的校验 | | afterOpenDlgfunction($data\_form) | false | $data\_form.form('reset')不会覆盖 | | | notReset | false | 重置表格 | 重置表格 | > afterOpenDlgfunction回调函数,跟add(callback)不同的是: > 所有执行add的都会调用, > add(callback)在具体执行时候callback ### editOpt | | **required** | **默认** | 说明 | | --- | --- | --- | --- | | title | false | "修改-data\_form\_name" | dialog title | | urlFn | false | | 动态url | | loadHandlerfunction(row) | false | $data\_form.form("load", row)不会覆盖 | 将一条记录加载到表单 | | afterOpenDlgfunction($data\_form) | false | $data\_form.form("myLoad", row);不会覆盖 | | > afterOpenDlgfunction回调函数,跟edit(callback)不同的是: > 所有执行edit的都会调用, > edit(callback)在具体执行时候callback ### saveOpt | | **required** | **默认** | 说明 | | --- | --- | --- | --- | | validation | **false** | $data\_form.form('validate')不会覆盖 | 表单校验函数 | | paramsFnfunction($data\_form) | **false** | $data\_form.serialize()会覆盖 | 返回请求参数,也就是ajax的data | | ajaxSetting | **false** | | 默认设置会继承ajaxSetting | | onSuccessfunction(result) | **false** | 无 | | | notClose | **false** | false,dialog关闭 | | | notReload | **false** | false,数据重新加载 | | | reloadParamsFn | **false** | 无 | function,返回一个json | removeOpt | | **required** | **默认** | 说明 | | --- | --- | --- | --- | | validation | **false** | | 删除校验 | | idField | **false** | datagrid 配置的idField,如果datagrid 没配置,可在此配置 | | | onSuccessfunction(result) | **false** | 无 | | | notReload | **false** | false,数据重新加载 | | ### searchOpt | | **required** | **默认** | 说明 | | --- | --- | --- | --- | | searchFormfunction($searchForm) | **false** | 如果不写,必须配置searchOpt.paramsFn | | | paramsFn | **false** | | |