使用easyUI的DataGrid对表单进行增删
首先我还是建议大家在写代码的时候对easyUI的文档进行一个了解,我自己就是在写代码的时候没有看文档,然后各种东西都是百度搜搜搜,写的很没有效率,而且对代码的了解也不够。
easyui文档链接: http://www.jeasyui.net/vue/655.html.
先上一个效果图
点击新增后就会有弹出框:
话不多说直接上代码
- 首先我们要先创建一个表单
<div>
<span class="font7 font11">抵扣项目及金额:</span>
<table id="loanTrialtab"></table>
</div>
//这里这个input是我用来存loanTrialtab数据的地方,我采用的方式是把这个表单的数据用一个String来存到数据库,页面就给他弄成Json传
<input type="hidden" id="accountsPayable" name="accountsPayable" />
- 弹出框代码
<div id="addloanAccount_dialog" style="width:660px;height:300px;*height:300px;" class="easyui-window" closed="true" maximizable="false" minimizable="false">
<ul class="main_key_ul ul400">
<li>
<span>请选择抵账项目:</span>
<div class="div_style">
//下拉框需要验证加是否必填,required这个参数对下拉框好像没有限制到,所以要另外验证 editable设置是否可以对下拉框输入
<select name="planProject" id="planProject" required="true" class="input_style easyui-combobox" editable="false" required="true" style="width: 200px;" panelwidth="200px" panelheight="auto">
//panelwidth这个参数是设置下拉框的默认宽度,因为不设置可能会存在下拉框加载不出来的情况(我觉得就是我用的浏览器太老了)
<option value="担保费">担保费</option>
<option value="其他手续费">其他手续费</option>
<option value="逾期手续费">逾期手续费</option>
<option value="委贷手续费">委贷手续费</option>
</select>
</div>
<i>*</i>
</li>
<li>
<span>抵扣金额(万元):</span>
<div class="div_style">
<input class="input_style easyui-validatebox amountUnify " style="width:200px;" name="planAmount"
type="text" maxlength=&#