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表单等等.
随机推荐
- 网页设计必备工具 firefox Web Developer插件 CSS工具组教程
该插件在火狐浏览器中安装.Web Developer 插件强大的功能超乎你的想象,用于CSS网页布局开发调试只是它强大功能的一部分,对于网络程序的开发也提供了非常强大的辅助设计功能,我们不将它完全的展 ...
- static心得
TextClass text; 吉晨 static注意 只要显式调用一个类的某一个static变量,那么就会连带static块,所有static变量一起调用,哪怕不去new一个对象,这时候已经对这 ...
- linux下使用OpenCV的一些问题
完整正确的代码如下: import cv2 import numpy as np image = cv2.imread('Pictures/a.png') cv2.imshow('original_i ...
- Dijkstra算法——单源最短路算法
一.介绍 迪杰斯特拉(Dijkstra)算法是典型最短路径算法,用于计算一个节点到其他各个节点的最短路径. 它的主要特点是以起始点为中心向外层层扩展(广度优先搜索思想),直到扩展到终点为止. 适用于有 ...
- 兼容IE6\7\8浏览器的html5标签的几个方案
html5大行其道的时代已经到来.如果你还在等待浏览器兼容,说明你已经与web脱节几条街了.当然,这得益于移动客户端的蓬勃发展.如果还在纠结于,是否应该掌握html5和css3技术时,请狠狠的抽自己几 ...
- [BZOJ4899]:记忆的轮廓(概率DP)
题目传送门 题目描述: 通往贤者之塔的路上,有许多的危机. 我们可以把这个地形看做是一颗树,根节点编号为1,目标节点编号为n,其中1-n的简单路径上,编号依次递增, 在[1,n]中,一共有n个节点.我 ...
- Bootstrap历练实例:块级按钮
<!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content=& ...
- shell脚本,awk合并一列的问题。
文件 file2内容如下:0 qwert1 asdfghjk2 asdjkl2 zxcvbn3 dfghjkll4 222224 tyuiop4 bnm 让第一列相等的合并成一行,不要第一列,也就是变 ...
- java面试宝典第二弹
arraylist和linklist的区别,hashmap和hashset的区别,常用的集合有哪些 一.基础内容 容器就是一种装其他各种对象的器皿.java.util包 容器:Set, List, M ...
- 牛客网NOIP赛前集训营-普及组(第二场)和 牛客网NOIP赛前集训营-提高组(第二场)解题报告
目录 牛客网NOIP赛前集训营-普及组(第二场) A 你好诶加币 B 最后一次 C 选择颜色 D 合法括号序列 牛客网NOIP赛前集训营-提高组(第二场) A 方差 B 分糖果 C 集合划分 牛客网N ...