HTML输入datalist不允许重新选择选项。
HTML输入datalist不允许重新选择选项。
我有一个选项列表,数据列表是从电子表格中填充的。
当我点击空白字段时,它会显示所有选项。
选择一个选项后,我不能再次点击它以查看所有选项。
我必须删除该选项,然后才能再次看到所有选项。
!= include('EditEmpJS') ?>
完整的代码文件:
const ws =
SpreadsheetApp.getActiveSpreadsheet().getSheetByName("EMPLOYEES");
const setup = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("SETUP");
const summary = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("SUMMARY");
const ui = SpreadsheetApp.getUi();
function onOpen(e) {
ui.createMenu(" 员工")
.addItem(" 添加员工", "addEmp")
.addItem(" 编辑员工", "editEmp")
.addItem(" 删除员工", "delEmp")
.addToUi();
ui.createMenu(" 部门")
.addItem(" 添加部门", "addDept")
.addItem(" 编辑部门", "editDept")
.addItem(" 删除部门", "delDept")
.addToUi();
ui.createMenu(" 日程")
.addItem(" 添加周", "addSched")
.addItem(" 更新汇总选项卡", "updateTabs")
.addToUi();
updateTabs();
}
function updateTabs() {
var tabList = SpreadsheetApp.getActiveSpreadsheet().getSheets().map((s) => s.getName())
.filter((s) => s != "SETUP" && s != "EMPLOYEES" && s != "TEMPLATE" && s != "SUMMARY")
Logger.log(tabList)
var rule = SpreadsheetApp.newDataValidation().requireValueInList(tabList)
var dropDown = summary.getRange("A1").setDataValidation(rule).activate();
}
function include(page) {
return HtmlService.createHtmlOutputFromFile(page).getContent();
}
//添加、编辑和删除员工的HTML
function addEmp() {
var page = HtmlService.createTemplateFromFile("AddEmp").evaluate();
page.setTitle(" 添加员工")
ui.showSidebar(page)
}
function editEmp() {
var page = HtmlService.createTemplateFromFile("EditEmp").evaluate();
page.setTitle(" 编辑员工");
ui.showSidebar(page)
}
function delEmp() {
var page = HtmlService.createTemplateFromFile("DelEmp").evaluate();
page.setTitle(" 删除员工");
ui.showSidebar(page)
}
//检查是否存在ID号和工作代码
//如果ID号已存在,则返回到checkId
//如果工作不存在,则返回到checkJob
function addEmpRecord(record) {
let array_target = ws.getRange("C2");
let array_formula = array_target.getFormula();
array_target.clear();
if (!checkId(record[2]) && !checkJob(record[3])) {
ws.getRange(ws.getLastRow() + 1, 1, 1, 10).setValues([[
record[0], record[1], , record[2].toString(), record[3].toUpperCase(), record[4], record[5].toUpperCase(), record[6], record[7].toUpperCase(), record[8]
]])
var html = HtmlService.createHtmlOutput("
记录已接受
关闭侧边栏以继续或添加另一个员工。")
.setWidth(300)
.setHeight(125);
ui.showModalDialog(html, "成功!")
}
else if (checkId(record[2].toString())) {
var html = HtmlService.createHtmlOutput("
用户ID号已存在
请选择不同的ID号。")
.setWidth(200)
.setHeight(75);
ui.showModalDialog(html, "警告!")
}
else if (checkJob(record[3])) {
var html = HtmlService.createHtmlOutput("
工作代码不存在
请选择有效的工作代码。
*区分大小写")
.setWidth(200)
.setHeight(75);
ui.showModalDialog(html, "警告!")
}
else {
var html = HtmlService.createHtmlOutput("
未知错误
请联系支持人员。")
.setWidth(200)
.setHeight(75);
ui.showModalDialog(html, "警告!")
}
array_target.setValue(array_formula)
}
//检查ID号是否已存在
function checkId(num) {
var result = false;
var current_ids = ws.getRange(2, 4, ws.getLastRow(), 1).getValues();
for (id = 0; id < current_ids.length; id++) {
if (current_ids[id].toString() == num.toString()) {
result = true
}
}
return result
}
//检查工作代码是否存在
function checkJob(job) {
var result = false;
var current_jobs = setup.getRange(2, 3, setup.getLastRow(), 1).getValues();
for (job = 0; job < current_jobs.length; job++) {
if (current_jobs[job] == job) {
result = true
}
}
return result
}
function getCurrentEmployees() {
return ws.getRange("C2:C").getValues();
}
function getEmployeeRecord(employee) {
var list = ws.getRange("C2:C").getValues();
for(e=0;e if(list[e] == employee) { return ws.getRange(e+1,1,1,10).getValues(); } } } 编辑: 我在文档网站上得到了相同的结果。 如果它的行为符合预期,那么除了datalist之外,如何获得动态的选择输入?