頁面上出現核取方塊,核取方塊內容從後台獲取,在選擇後將資料傳輸到後台
querydeployins:function () {
$.getjson("/config_manage/configmodify/querydeployins?versionid=" + versionid, function (r) { //獲取ip與id
vm.hosts = r.deployins; //賦值給物件
console.log(vm.hosts);
var hoststr = "";
for (var index in vm.hosts){
var html = ""; //拼接核取方塊將各個值給入
console.log(vm.hosts[index].host);
hoststr = hoststr + vm.hosts[index].instance_id + ";"
form.on('checkbox(checkf)', function (data) {
console.log(data.elem.checked); //是否被選中,true或者false
console.log(data.value); //核取方塊value值,也可以通過data.elem.value得到
if (data.elem.checked == false){
hoststr = hoststr.replace(data.value + ";","");
else {
hoststr = hoststr + (data.value+";");
vm.deploylist.hosts = hoststr;
console.log(vm.deploylist.hosts);
form.render();
整體思路:
1、從後台獲取id:ip map物件list
2、提前拼接好核取方塊實現的html**
3、遍歷list,將核取方塊一一實現,最後from.render
4、定義物件,一開始將全部value預設寫入,字串拼接
5、監聽核取方塊,當被取消或是選中,擷取或是新增
實現頁面分頁
web專案經常遇到頁面分頁,在這裡總結一下。先進行 資料分析 需要傳給後台當前頁面數,每頁顯示幾條資料,資料總數形成的頁面總數 邏輯需求 將資料總數查出來形成頁面總數 首先是進行總數的計算,作用就是在前端頁面形成 1 n select count from 表 service中進行邏輯處理,根據資料...
實現頁面布局
當我們開發乙個 的時候,有幾種我們常見的頁面布局的方法,比如多欄布局頁面 彈性布局頁面。利用布局的方法使我們的頁面更完整更美觀。下面是我用 實現的多欄布局頁面 如下圖 首先建立頭部乙個div為box類,中間建立乙個大的div包裹著三個小的div,分別給它們設定類,尾部就跟頭部一樣然後設定乙個類box...
頁面導航實現
web頁面的導航選單一般用列表項實現,根據導航的位置劃分 縱向導航和橫向導航。我們先從最簡單的縱向導航開始 首頁 a li 13 li a href id n hot link target blank 百家 a li 14 li a href target blank div class icon...