ComboGrid(資料表格下拉框)[分頁+搜尋+多選]
阿新 • • 發佈:2018-12-12
注意:後臺控制層接收該控制元件的引數名必須是
//likeName:根據需求可有可無需要模糊條件查詢時新增
(String likeName,Integer page, Integer rows)
//=================jsp==============start=====
//控制元件標籤宣告
哈嘍:<input id="cc"/>
<div class="AA" id="tbPros" style="float:left;padding-left:15px"> <div style="padding-top:4px;"> <!--搜尋combogrid下拉標籤定義 根據需求如不需下拉則在js中不用將其轉為combogrid控制元件--> xx:<input id="updatehospitalCodeadd" style="width: 300px;"/> <!--標籤方式定義linkbutton按鈕--> <a href="javascript:void(0)" id="addProsadd" data-options="iconCls:'glyphicon-ok icon-green'" style="width: 100px;height: 24px;" onclick="search()">按鈕名稱</a> </div> </div>
//=================jsp==============end======
//js動態封裝(因為後臺新增和修改可能會用到同一個ComboGrid控制元件)
//呼叫示例:addDoctorDetil("#原生input標籤id","#搜尋下拉或按鈕Div的id"); function addDoctorDetil(combogridId,toolbarId) { $(combogridId).combogrid({ multiple: true,//false:單選 true:多選 idField: 'id',//ID欄位名稱。 textField: 'dName',//要顯示在文字框中的文字欄位 url: base + "/operating/getByDoctor",//url method: 'post',//請求方式 queryParams : {//在請求遠端資料的時候傳送額外的引數 likeName : '' }, columns: [[ {field:'ck',checkbox:true,width:40},//複選框 {field:'id',title:'對應的欄位說明'}, {field:'dName',title:'對應的欄位說明'}, {field:'price',title:'對應的欄位說明'} ]], editable : false,//不可編輯 fitColumns: true,//真正的自動展開/收縮列的大小,以適應網格的寬度,防止水平滾動 panelWidth:'390px', panelHeight:'412px', pagination:true,//如果為true,則在DataGrid控制元件底部顯示分頁工具欄 pageSize:10,//在設定分頁屬性的時候初始化頁面大小。 toolbar:toolbarId,//頂部工具欄的DataGrid面板 }); }
//=================js==============start=====//將宣告的標籤通過js程式碼動態轉為ComboGrid下拉控制元件
//=================js==============end=====