shit layui & bugs
shit layui & bugs
useis not useful at all!
http://www.layui.com/demo/form.html
layui.use(["form", "layer"], function() {
let form = layui.form,
layer = layui.layer;
});
layui.use([], function() {
let form = layui.form,
layer = layui.layer;
});
layui.use("form", function() {
let form = layui.form,
layer = layui.layer;
});
layui.use("", function() {
let form = layui.form,
layer = layui.layer;
});
async & delay bug
const editProject = () => {
let reset = document.querySelector(`button[type="reset"]`);
layui.use("form", function() {
let form = layui.form,
layer = layui.layer;
// init select
console.log(`render select 1`);
form.render("select");
fetchJSON(`${FetchIP}/http/sign/roles`).then(json => {
let select = document.querySelector(`[lay-filter="project-type"]`);
let html = ``;
if (json.success) {
const obj = json.data;
let keys = Object.keys(obj);
let newObj = {};
keys.forEach(
(key, i) => {
if (key !== "Admin") {
let value = obj[key].name;
newObj[key] = value;
html += `<option value="${key}">${value}</option>`;
// html += `<option value="Complex">综合</option>`;
} else {
// no need Admin
}
}
);
// console.log(`new options =`, JSON.stringify(newObj, null, 4));
select.innerHTML = "";
select.insertAdjacentHTML(`beforeend`, html);
console.log(`render select 2`);
form.render("select");
} else {
html += `
<option value="Developer">开发</option>
<option value="Operator">配管</option>
<option value="Complex">综合</option>
`;
select.innerHTML = "";
select.insertAdjacentHTML(`beforeend`, html);
console.log(`render select 4`);
form.render("select");
}
}).catch(err => console.log(`error`, err));
form.on('submit(formDemo)', function(data) {
let {
user_name,
role,
password,
email,
} = data.field;
let query_obj = {
user_name,
role,
password
};
// filter
if (email) {
query_obj.email = email;
}
let url = `${fetchIP}/http/sign/updateuser?${encodeURIComponent(JSON.stringify(query_obj))}`;
getDatas(url).then(json => {
// loading
let loadingIndex = layer.load(1, {
time: 1*1000,
});
let resetButton = document.querySelector(`button[type="reset"]`);
setTimeout(() => {
layer.close(loadingIndex);
if (json.success) {
layer.close(modalIndex);
swal({
title: "修改服务成功!",
text: `${json.message !== null ? json.message : "3 秒后自动关闭!"}`,
icon: "success",
// button: "关闭",
buttons: false,
timer: 3000,
});
resetButton.click();
loadList();
} else {
swal({
title: "修改服务失败!",
text: `${json.message !== null ? json.message : "3 秒后自动关闭!"}`,
icon: "error",
// button: "关闭",
buttons: false,
timer: 3000,
});
}
}, 1000);
// reset
reset.click();
}).catch(err => console.log(`error`, err));
return false;
});
let {
user_name,
role,
// password,
email,
// role_desc,
} = jsonObj;
console.log(`user infos =`, JSON.stringify(jsonObj, null, 4));
let input_name = document.querySelector(`input[name="user_name"]`),
input_role = document.querySelector(`select[name="role"]`),
input_email = document.querySelector(`input[name="email"]`);
input_name.value = `${user_name}`;
input_name.setAttribute(`disabled`, `disabled`);
// input_name.setAttribute(`readonly`, `readonly`);
if (email) {
input_email.value = `${email}`;
}
// async & delay bug
setTimeout(() => {
input_role.value = `${role}`;
// update select
console.log(`render select 3`);
form.render("select");
}, 100);
});
};
table reload & table search
搜索
https://www.layui.com/demo/table/reload.html
https://www.layui.com/doc/modules/table.html#reload
reload: function () {
let searchValue = document.querySelector(`#demoReload`).value,
newDatas = [];
// TableDatas
// console.log(`search value =`, searchValue);
newDatas = TableDatas.filter(
(obj, i) => {
if (searchValue === obj["pro_name"]) {
return obj;
}
}
);
// console.log(`new datas =`, JSON.stringify(newDatas, null, 4));
// clear
sharpedDatas = [];
newDatas.forEach(
(obj, i) => {
let {
upgrade_id,
pro_name,
pro_type,
// send_time,
// upgrade_time,
server_name,
dep_path,
current_version,
upgradeable,
module_children,
} = obj,
operaions = "",
temp_obj = {};
// array
window.upgrade_id.push(upgrade_id);
current_version = current_version ? current_version : `--`;
let project_name = pro_name;
pro_name = `
<span title="${pro_name}" data-name="${pro_name}">${pro_name}</span>
`;
server_name = `
<span title="${server_name}">${server_name}</span>
`;
dep_path = `
<span title="${dep_path}">${dep_path}</span>
`;
operaions = `
<a href="./config-tree.html#${upgrade_id}" lay-event="config" data-uid="config" class="layui-btn layui-btn-normal layui-btn-sm" title="配置文件">
<svg class="icon" style="width: 1.5em; height: 1.5em;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1029 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="12292"><path d="M605.872994 924.471193 198.803835 924.471193c-62.327534 0-113.078405-50.750871-113.078405-113.077382L85.72543 313.865407c0-62.322417 50.750871-113.074312 113.078405-113.074312l407.068136 0c54.54836 0 100.221586 38.845727 110.779036 90.325192 14.616906-4.107551 29.374004-7.375991 44.301995-9.185196-14.839986-71.997778-78.710666-126.369106-155.081031-126.369106L365.855502 155.561985c10.509355-51.571562 56.183604-90.463338 110.778013-90.463338l219.657792 0c62.321394 0 113.073288 50.750871 113.073288 113.078405l0 102.164844c15.239076 0.681522 30.342052 2.62785 45.229111 5.650697l0-107.815541c0-87.302345-71.02359-158.307516-158.301376-158.307516L476.629421 19.869536c-79.504752 0-144.877645 59.21259-156.00917 135.688355L198.803835 155.557892c-87.282902 0-158.307516 71.006194-158.307516 158.307516l0 497.52738c0 87.282902 71.024613 158.306492 158.307516 158.306492l407.068136 0c68.595284 0 126.546138-44.171012 148.497079-105.256252-14.97404-2.164293-29.639041-5.567809-44.032866-9.981329C693.374884 895.495254 652.957359 924.471193 605.872994 924.471193L605.872994 924.471193zM605.872994 924.471193M176.184675 319.516104l301.065893 0 0 33.926694L176.184675 353.442798 176.184675 319.516104 176.184675 319.516104zM176.184675 319.516104M176.184675 470.272643l231.80853 0 0 33.921577L176.184675 504.19422 176.184675 470.272643 176.184675 470.272643zM176.184675 470.272643M176.184675 621.068068l231.80853 0 0 33.923624L176.184675 654.991692 176.184675 621.068068 176.184675 621.068068zM176.184675 621.068068M176.184675 771.81949l301.065893 0 0 33.921577L176.184675 805.741068 176.184675 771.81949 176.184675 771.81949zM176.184675 771.81949M963.999464 561.393967l41.478693-15.280008c5.697769-2.077312 8.655124-8.483208 6.53688-14.222933l-34.542724-93.421716c-2.073218-5.697769-8.480138-8.677637-14.223956-6.559393l-41.339524 15.261589c-5.743818 2.118244-12.678764 1.167592-15.461133-2.052752-2.78237-3.291976-8.526187-15.836687-6.008854-21.288862l18.46556-40.040948c2.558265-5.522784 0.128937-12.170181-5.3918-14.687514l-90.459245-41.720194c-5.562692-2.517333-12.145621-0.088004-14.662955 5.434779l-18.461467 40.040948c-2.563382 5.545296-8.132214 9.852392-12.368702 9.541307-4.195555-0.287549-17.226337-4.970198-19.346627-10.69048l-15.238053-41.473577c-2.166339-5.697769-8.526187-8.637728-14.270005-6.560416l-93.462648 34.474163c-5.739724 2.12336-8.655124 8.502651-6.53688 14.246469l15.285125 41.432645c2.118244 5.697769 1.191128 12.675694-2.077312 15.416108-3.227508 2.804882-15.684214 8.566096-21.246907 6.031367l-40.018436-18.46556c-5.474688-2.582825-12.104689-0.088004-14.662955 5.433756l-41.74373 90.459245c-2.558265 5.498224-0.088004 12.123109 5.3918 14.686491l40.017412 18.46556c5.563716 2.558265 9.847276 8.126075 9.537214 12.275581-0.217964 4.242627-4.988618 17.274432-10.686387 19.392676l-41.432645 15.239076c-5.697769 2.118244-8.66024 8.480138-6.53688 14.222933l34.450626 93.508697c2.077312 5.693676 8.526187 8.655124 14.180977 6.578836l41.428551-15.284101c5.742794-2.119267 12.720719-1.191128 15.461133 2.034333 2.828418 3.180436 8.568143 15.725146 6.007831 21.289885l-18.464537 39.929408c-2.559289 5.522784-0.088004 12.193717 5.3918 14.71105l90.500177 41.738613c5.567809 2.563382 12.145621 0.088004 14.710027-5.433756l18.46556-39.972387c2.517333-5.567809 8.080026-9.80532 12.276604-9.587356 4.241604 0.26913 17.22736 4.992711 19.345604 10.737552l15.285125 41.339524c2.030239 5.743818 8.480138 8.702196 14.177907 6.624884l93.50972-34.450626c5.650697-2.119267 8.655124-8.526187 6.535857-14.265912l-15.238053-41.436738c-2.12336-5.693676-1.191128-12.675694 2.030239-15.409968 3.267417-2.828418 15.767102-8.572236 21.334911-6.008854l40.018436 18.461467c5.474688 2.52245 12.104689 0.088004 14.662955-5.433756l41.696658-90.459245c2.563382-5.520737 0.088004-12.1886-5.474688-14.71105l-39.930431-18.460444c-5.567809-2.563382-9.276271-15.902178-9.276271-20.055778C953.624163 568.728002 958.25974 563.512211 963.999464 561.393967L963.999464 561.393967zM804.591895 673.364131c-57.374732 21.112853-121.023354-8.257058-142.228305-65.591881-21.112853-57.3338 8.215102-121.023354 65.594951-142.205792 57.375755-21.177322 121.024377 8.191566 142.18328 65.526389C891.254673 588.514651 861.926718 652.209322 804.591895 673.364131L804.591895 673.364131zM804.591895 673.364131" p-id="12293"></path></svg>
查看配置
</a>
<a href="./logs-tree.html#${upgrade_id}" lay-event="logs" data-uid="logs" class="layui-btn layui-btn-normal layui-btn-sm" title="查看日志">
<svg class="icon" style="width: 1.5em; height: 1.5em;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="537"><path d="M831.618032 393.581714h-19.902984V297.528889c0-0.601397-0.097524-1.202794-0.170667-1.812318a15.969524 15.969524 0 0 0-3.860318-10.524444L647.858794 102.627556c-0.048762-0.048762-0.097524-0.065016-0.130032-0.113778a16.075175 16.075175 0 0 0-4.299175-3.348318 16.879746 16.879746 0 0 0-3.210158-1.349079c-0.300698-0.08127-0.568889-0.203175-0.869588-0.284444a16.278349 16.278349 0 0 0-3.730285-0.463239H242.826159c-17.936254 0-32.507937 14.587937-32.507937 32.507937v263.996952H190.415238a46.461968 46.461968 0 0 0-46.461968 46.461969v241.615238a46.470095 46.470095 0 0 0 46.461968 46.461968h19.902984v165.400381c0 17.92 14.571683 32.507937 32.507937 32.507936h536.380952c17.92 0 32.507937-14.587937 32.507937-32.507936V728.120889h19.902984a46.470095 46.470095 0 0 0 46.461968-46.461968v-241.615238a46.453841 46.453841 0 0 0-46.461968-46.461969zM242.826159 129.576635h376.539428v166.31873a16.253968 16.253968 0 0 0 16.253969 16.253968h143.587555v81.432381h-536.380952V129.576635z m334.214095 426.235936c0 72.224508-43.796317 116.028952-108.186413 116.028953-65.365333 0-103.610921-49.347048-103.61092-112.111746 0-66.031746 42.162794-115.378794 107.203047-115.378794 67.66527 0 104.594286 50.663619 104.594286 111.461587zM220.745143 668.24127V447.951238h50.005333v178.460445h87.600762v41.82146H220.745143z m558.461968 216.462222h-536.380952V728.120889h536.380952v156.582603z m14.57981-226.588444c-15.368127 5.225651-44.454603 12.409905-73.54108 12.409904-40.196063 0-69.290667-10.126222-89.559365-29.728508-20.260571-18.952127-31.378286-47.729778-31.045079-80.083301 0.325079-73.224127 53.59746-115.061841 125.838222-115.061841 28.436317 0 50.330413 5.575111 61.123048 10.792635l-10.459429 39.870984c-12.092952-5.225651-27.127873-9.476063-51.313778-9.476064-41.504508 0-72.890921 23.535746-72.89092 71.257397 0 45.429841 28.436317 72.224508 69.290666 72.224508 11.442794 0 20.593778-1.284063 24.510984-3.250794v-46.096254h-33.987047v-38.887619h82.033778v116.028953z" fill="#fff" p-id="538"></path><path d="M417.865143 558.746413c0 43.146159 20.268698 73.541079 53.59746 73.541079 33.670095 0 52.955429-32.028444 52.955429-74.841397 0-39.537778-18.960254-73.557333-53.280508-73.557333-33.661968 0-53.272381 32.044698-53.272381 74.857651z" fill="#1e9fff" p-id="539"></path></svg>
日志
</a>
<a class="layui-btn layui-btn-normal layui-btn-sm" lay-event="upgrade-special-version" title="升级到指定版本">
<svg class="icon" style="width: 1.5em; height: 1.5em;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="9378"><path d="M511.771291 959.407889c-60.370972 0-118.943996-11.833513-174.10941-35.168987-53.267181-22.521946-101.097536-54.768371-142.160767-95.842859-41.069371-41.058115-73.316819-88.890516-95.842859-142.156674-23.331381-55.159274-35.164894-113.738437-35.164894-174.104293 0-60.369949 11.830443-118.952182 35.164894-174.108387 22.526039-53.265134 54.773488-101.096513 95.842859-142.166907 41.063231-41.069371 88.894609-73.309656 142.160767-95.837742 55.154157-23.329335 113.733321-35.159778 174.10941-35.159778 60.358693 0 118.937856 11.830443 174.098153 35.159778 53.266158 22.528086 101.096513 54.773488 142.165884 95.837742 41.065278 41.070394 73.311703 88.905866 95.843882 142.166907 23.325241 55.151088 35.158754 113.733321 35.158754 174.108387 0 60.364833-11.824303 118.943996-35.158754 174.104293-22.533202 53.266158-54.778604 101.098559-95.843882 142.156674-41.069371 41.074487-88.899726 73.320912-142.165884 95.842859C630.709147 947.573353 572.131007 959.407889 511.771291 959.407889L511.771291 959.407889zM511.771291 115.89966c-218.489176 0-396.240533 177.751357-396.240533 396.234393 0 218.47792 177.751357 396.234393 396.240533 396.234393 218.482013 0 396.228253-177.756473 396.228253-396.234393C907.999544 293.651017 730.253304 115.89966 511.771291 115.89966L511.771291 115.89966zM511.771291 115.89966M692.508655 477.239312c-10.531867 10.561543-27.585265 10.561543-38.062897 0l-115.716488-115.6336 0 366.089839c0 14.845103-12.084223 26.942629-26.952862 26.942629-14.846126 0-26.948769-12.097526-26.948769-26.942629L484.827639 361.600595 369.12957 477.239312c-10.497075 10.561543-27.554566 10.561543-38.062897 0-5.26798-5.26798-7.918343-12.137435-7.918343-19.031449 0-6.903224 2.650363-13.797237 7.918343-19.031449l161.677263-161.67624c10.497075-10.498098 27.560706-10.498098 38.057781 0l161.702845 161.67624C703.00573 449.674513 703.00573 466.733027 692.508655 477.239312L692.508655 477.239312 692.508655 477.239312zM692.508655 477.239312" p-id="9379"></path></svg>
升级
</a>
<a class="layui-btn layui-btn-danger layui-btn-sm" lay-event="restore" title="还原">
<svg class="icon" style="width: 1.5em; height: 1.5em;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1205"><path d="M314.1754 387.823179l160.906076 160.906076-40.226519 40.226519-160.906076-160.906076 40.226519-40.226519ZM274.025586 428.418253l160.906076-160.906076 40.226519 40.226519-160.906076 160.906076-40.226519-40.226519ZM341.333333 398.222222 625.810631 398.222222C720.049084 398.222222 796.444444 474.824085 796.444444 568.888889 796.444444 663.145483 719.965827 739.555556 625.810631 739.555556L365.791667 739.555556 365.791667 682.666667 625.810631 682.666667C688.577553 682.666667 739.555556 631.696031 739.555556 568.888889 739.555556 506.164384 688.551703 455.111111 625.810631 455.111111L341.333333 455.111111 341.333333 398.222222ZM369.777778 711.111111m-28.444444 0a0.5 0.5 0 1 0 56.888889 0 0.5 0.5 0 1 0-56.888889 0Z" p-id="1206"></path></svg>
还原
</a>
`;
// loading...
let status = `
<span data-status="UID-${upgrade_id}" class="badge-status-loading">
<i class="fa fa-spinner fa-spin fa-1x" aria-hidden="true"></i>
</span>
`;
Object.assign(temp_obj, {
upgrade_id,
status,
pro_name,
project_name,// source name
pro_type,
// send_time,
// upgrade_time,
server_name,
dep_path,
current_version,
upgradeable,
operaions,
});
sharpedDatas.push(temp_obj);
// no children
options.data = sharpedDatas;
// new_options
// console.log(`re-render table =`, JSON.stringify(options.data, null, 4));
table.render(options);
}
);
// tableIns.reload({
// page: {
// curr: 1 //重新从第 1 页开始
// },
// });
// var demoReload = $('#demoReload');
// //执行重载
// // table.reload('testReload', {
// tableIns.reload({
// page: {
// curr: 1 //重新从第 1 页开始
// },
// where: {
// key: {
// pro_name: demoReload.val()
// }
// }
// });
}
};
https://www.layui.com/demo/table/reload.html
https://www.layui.com/doc/modules/table.html#reload
https://www.layui.com/doc/modules/table.html#options
re-render
options.data = sharpedDatas;
// new_options
// console.log(`re-render table =`, JSON.stringify(options.data, null, 4));
table.render(options);
shit layui & re-render
https://www.layui.com/demo/form.html
为什么select/checkbox/radio没显示？
https://www.layui.com/doc/base/faq.html#form动态添加的表单元素如何更新？
https://www.layui.com/doc/modules/form.html#render
shit layui & bugs的更多相关文章
- Common Bugs in C Programming
There are some Common Bugs in C Programming. Most of the contents are directly from or modified from ...
- POJ2096 Collecting Bugs
Time Limit: 10000MS Memory Limit: 64000K Total Submissions: 5090 Accepted: 2529 Case Time Limit: ...
- layui常用方法
很好用的一个ui组件,弹出,分页等 http://layer.layui.com/ 1 带叉叉的弹窗 layer.open({ type: , title: false, //不显示标题 conten ...
- 开源网站.NETMVC+ Layui+SqlSugar+RestSharp
SugarSite一个前端支持移动端的企业网站,目前只支持了简单功能,后续还会加上论坛等. 源码GIT地址: https://github.com/sunkaixuan/SugarSite 技术介绍 ...
- 【poj2096】Collecting Bugs
题目描述 Ivan is fond of collecting. Unlike other people who collect post stamps, coins or other materia ...
- 与你相遇好幸运，Mongodb客户端&BUGS
> Robomongo https://robomongo.org > 日常使用频率最高的客户端 存在BUG: 在 db.getCollection('xzq').find({" ...
- 分页组件 - layui.laypage
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- 日期时间组件 - layui.laydate
全部参数 一.核心方法:laydate(options); options是一个对象,它包含了以下key: '默认值' { elem: '#id', //需显示日期的元素选择器 event: 'cli ...
- 关于layui
之前用layer用了很长时间,感觉很好用,最近看到了layui的发布很想尝试尝试. 加入了挺多的功能,比如编辑器,上传,form表单等等.
随机推荐
- T4310 祖玛游戏
题目描述 祖玛是一款曾经风靡全球的游戏,其玩法是:在一条轨道上初始排列着若干 个彩色珠子,其中任意三个相邻的珠子不会完全同色.此后,你可以发射珠子到 轨道上并加入原有序列中.一旦有三个或更多同色的珠子 ...
- jQuery选择器之样式
.attr()与.removeAttr() 每个元素都有一个或者多个特性,这些特性的用途就是给出相应元素或者其内容的附加信息.如:在img元素中,src就是元素的特性,用来标记图片的地址. 操作特性的 ...
- 初识requestAnimationFrame
转载地址:https://blog.csdn.net/vhwfr2u02q/article/details/79492303 核心概念: 1.CPU节能:在页面不刷新时不执行回调(页面在隐藏.最小化等 ...
- 内存泄露--contentView缓存使用与ListView优化
引起Android内存泄露有很多种原因,下面罗列了一些问题,以后会一一解决 1.构造Adapter时没有使用缓存convertView(衍生出ListView优化问题) 2.查询数据库游标没有关闭 3 ...
- App Store上的开源应用汇总
以下是互联网上主要的开源iOS应用的列表,在学习的时候,多看看完成的功能代码可以给我们带来很多经验,但是除了Apple官方提供的Sample Code之外,我们很难找到优质的开源项目代码,所以我搜集了 ...
- Django ORM 查询操作
queryset中支持链式操作 book=Book.objects.all().order_by('-nid').first() 只要返回的是queryset对象就可以调用其他的方法,直到返回的是对象 ...
- WPF知识点全攻略10- 路由事件
路由事件是WPF不得不提,不得不会系列又一 先来看一下他的定义: 功能定义:路由事件是一种可以针对元素树中的多个侦听器(而不是仅针对引发该事件的对象)调用处理程序的事件. 实现定义:路由事件是一个 C ...
- 使用vue做移动端瀑布流分页
讲到瀑布流分页有一个方法一定是要用到的 pullToRefresh() 这个也没什么好解释的,想了解的可以去百度一下 下面上代码 <div id="main" class=& ...
- ubuntu 18.* 重启网卡
systemctl UNIT LOAD ACTIVE SUB DESCRIPTION proc-sys-fs-binfmt_misc.automount loaded active waiting A ...
- jQuery绑定动态元素的点击事件无效
之前就一直受这个问题的困扰,在写ajax加载数据的时候发现,后面追加进来的demo节点元素,失去了之前的点击事件.为什么点击事件失效,我们该怎么去解决呢?那么,我们通过下面的示例简单说明. 示例如下: ...