shit layui & bugs

use is 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

  1. 为什么select/checkbox/radio没显示?

    https://www.layui.com/doc/base/faq.html#form

  2. 动态添加的表单元素如何更新?

    https://www.layui.com/doc/modules/form.html#render


shit layui & bugs的更多相关文章

  1. Common Bugs in C Programming

    There are some Common Bugs in C Programming. Most of the contents are directly from or modified from ...

  2. POJ2096 Collecting Bugs

    Time Limit: 10000MS   Memory Limit: 64000K Total Submissions: 5090   Accepted: 2529 Case Time Limit: ...

  3. layui常用方法

    很好用的一个ui组件,弹出,分页等 http://layer.layui.com/ 1 带叉叉的弹窗 layer.open({ type: , title: false, //不显示标题 conten ...

  4. 开源网站.NETMVC+ Layui+SqlSugar+RestSharp

    SugarSite一个前端支持移动端的企业网站,目前只支持了简单功能,后续还会加上论坛等. 源码GIT地址: https://github.com/sunkaixuan/SugarSite 技术介绍 ...

  5. 【poj2096】Collecting Bugs

    题目描述 Ivan is fond of collecting. Unlike other people who collect post stamps, coins or other materia ...

  6. 与你相遇好幸运,Mongodb客户端&BUGS

    > Robomongo https://robomongo.org > 日常使用频率最高的客户端 存在BUG: 在 db.getCollection('xzq').find({" ...

  7. 分页组件 - layui.laypage

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  8. 日期时间组件 - layui.laydate

    全部参数 一.核心方法:laydate(options); options是一个对象,它包含了以下key: '默认值' { elem: '#id', //需显示日期的元素选择器 event: 'cli ...

  9. 关于layui

    之前用layer用了很长时间,感觉很好用,最近看到了layui的发布很想尝试尝试. 加入了挺多的功能,比如编辑器,上传,form表单等等.

随机推荐

  1. 初识react中的状态量

    react组件中的两类状态数据:props,state,官网API给出的使用规范,多读几遍,受益匪浅: 结论: 1. 对应任何可变的数据,理应只有一个单一“ 数据源 ” 2. 如果多个组件均需要这些数 ...

  2. iOS之核心动画

    .将动画的所有方法封装到一个类里面 MyCAHelper.h #import <Foundation/Foundation.h> #import <QuartzCore/Quartz ...

  3. jmeter中登录和提交收银出现的错误

    登录出现的错误 登录界面如图所示: 为了防止登录跳转的问题response code 302的问题,要设置 2.提交收银界面 当系统设置必须传送jison格式时,要在HTTP Header Manag ...

  4. C#调用CMD程序

    最近写了两个小程序都要调用Windows自带的命令行程序,一个是调用Openfiles.exe查询正在编辑的共享文档,一个是调用DiskPart.exe查询硬盘状态.两种命令行程序调用有点不同,记录一 ...

  5. hihoCoder #1151 : 骨牌覆盖问题·二 (矩阵快速幂,DP)

    题意:给一个3*n的矩阵,要求用1*2的骨牌来填满,有多少种方案? 思路: 官网题解用的仍然是矩阵快速幂的方式.复杂度O(logn*83). 这样做需要构造一个23*23的矩阵,这个矩阵自乘n-1次, ...

  6. Java Web应用中获取用户请求相关信息,如:IP地址、操作系统、浏览器等信息

    引入jar包 <dependency> <groupId>eu.bitwalker</groupId> <artifactId>UserAgentUti ...

  7. 工程化---cnpm不是内部命令的解决

    (1)问题描述 安装完,执行cnpm -v发现报出不是内部命令. 安装成功如下图: (2)解决方案: 之前配置过默认安装都会在D:\\nodejs\node_global中,所有我们cd 到 这个路径 ...

  8. python爬虫---实现项目(四) 用BeautifulSoup分析新浪新闻数据

    这次只演示了,如何在真实项目内用到BeautifulSoup库来解析网页,而新浪的新闻是ajax加载过来的数据,在这里我们只演示解析部分数据(具体反扒机制没做分析). 代码地址:https://git ...

  9. Java8新特性Lambda表达式

    List<RoleDO> allRoles = roleService.list(); //获取角色中备注不是app的集合List<RoleDO> webRoles = all ...

  10. 转: opencv4.0.0 +opencv_contrib在vs2015中编译

    https://blog.csdn.net/baidu_40691432/article/details/84957737