[英]Check appropriate checkboxes when certain option is selected from dropdown select?
I'm sorry to ask this question, I hate asking on here and I don't wanna be seen as a vampire but I'm so stuck with this and I don't think I'm on the right lines at all, if this doesn't make sense at all comment and I'll try explain. 我很遗憾地问这个问题,我讨厌在这里询问,我不想被视为吸血鬼,但我对此非常困惑,我认为我根本不在正确的位置,如果这对所有评论都没有意义,我会尝试解释。 I'm desperate!
我很绝望!
Basically what I'm working on requires you to select a company, and when you do that it generates some checkboxes. 基本上我正在做的工作要求你选择一家公司,当你这样做时,它会生成一些复选框。 When you select a profile from the dropdown, it needs to tick the appropriate checkboxes.
从下拉列表中选择配置文件时,需要勾选相应的复选框。 The checkboxes it should tick are whatever that profile has in it's PRIVILEGE_PROFILES.PRIVILEGE CODES (these are the checkboxes).
它应勾选的复选框是该配置文件中的所有内容的PRIVILEGE_PROFILES.PRIVILEGE CODES(这些是复选框)。
I've got my code in a fiddle here http://jsfiddle.net/shaunyweasel/dj8jr19e/5/ . 我在这里得到了我的代码http://jsfiddle.net/shaunyweasel/dj8jr19e/5/ 。 The arrays are at the top of the fiddle.
阵列位于小提琴的顶部。 I was trying to do it so that if the text value of the label was equivalent to to the SEC_PRIVILEGES.Name then tick those checkboxes, however that doesn't really work so I'm not sure if there's a better way to go about it.
我试图这样做,以便如果标签的文本值等于SEC_PRIVILEGES.Name然后勾选那些复选框,但这不是真的有效,所以我不确定是否有更好的方法来解决它。 The below method is what I've been working on to try get it to tick the checkboxes but I'm pretty sure it's wrong.
下面的方法是我一直在尝试让它勾选复选框,但我很确定它是错的。
$(document).on('change', '#select_profile', function () {
var select = $("#select_profile option:selected").text(),
selectedProfile, privileges, div, label, access;
var checked = document.getElementsByTagName('input');
for (var i = 0; i < checked.length; i++) {
if (checked[i].type == 'checkbox') {
checked[i].checked = false;
}
}
if (select !== 'None') {
for (var i = 0; i < PRIVILEGE_PROFILES.length; i++) {
if (PRIVILEGE_PROFILES[i].PROFILE_ID === select) {
selectedProfile = PRIVILEGE_PROFILES[i];
privileges = selectedProfile.PRIVILEGE_CODE;
}
}
for (var i = 0; i < SEC_Privileges.length; i++) {
if (privileges[i] === SEC_Privileges[i].Unique_Code) {
console.log(privileges);
var labels = document.getElementsByTagName('label');
var checked = document.getElementsByTagName('input');
for (var c = 0; c < checked.length; c++) {
if (SEC_Privileges[i].Name == labels) {
checked[c].checked = true;
}
}
}
}
}
});
If this doesn't make sense, here's a step by step of how it works and where i'm at and stuck: 如果这没有意义,这里有一步一步说明它的运作方式以及我所处的位置:
User selects a company from the company_selection dropdown 用户从company_selection下拉列表中选择一个公司
When company is selected it generates checkboxes for that company depending on it's COMPANY_PRIVILEGES.UNIQUE_CODE (the array) 选择公司后,它会为该公司生成复选框,具体取决于它的COMPANY_PRIVILEGES.UNIQUE_CODE(数组)
The user then has to select something from the profile_selection, and depending what profile they select it will check the appropriate checkboxes, depending on what PRIVILEGE_PROFILES.PRIVILEGE_CODES it has. 然后,用户必须从profile_selection中选择一些内容,并根据它们选择的配置文件,它将检查相应的复选框,具体取决于它具有的PRIVILEGE_PROFILES.PRIVILEGE_CODES。 (so if you selected Crew then it would just tick the View Tyrell box as that's the only profile it has)
(所以如果你选择了Crew,那么它只会勾选View Tyrell框,因为它是它唯一的配置文件)
Here is the working example: DEMO 以下是工作示例: DEMO
I have changed following things: 我改变了以下事情:
1) When you are creating the checkboxes then i have added class name to those checkboxes similar to UNIQUE_CODE
1)当您创建复选框时,我已将类名添加到类似于
UNIQUE_CODE
复选框中
$(document).on('change', '#select_company', function () {
// declare variables before the function
var select = $("#select_company option:selected").text(),
selectedProfile, privileges, div, label, access;
// remove access checkboxes from previously selected profile
$('.apps input[type=checkbox]').remove();
$('.apps label').remove();
// if the selected option is 'None', do nothing, else...
if (select !== 'None') {
// match the selected profile in the dropdown with the JS PROFILES object
for (var i = 0; i < COMPANY_PRIVILEGES.length; i++) {
if (COMPANY_PRIVILEGES[i].COMPANY_CODE === select) {
selectedProfile = COMPANY_PRIVILEGES[i];
privileges = selectedProfile.UNIQUE_CODE;
}
}
// match the associated privileges from the profile within the entire privilege list
for (var j = 0; j < privileges.length; j++) {
for (var i = 0; i < SEC_Privileges.length; i++) {
if (privileges[j] === SEC_Privileges[i].Unique_Code) {
// get the div with the id === SEC_Privileges[i].Group_code
div = document.getElementById(SEC_Privileges[i].Group_Code);
access = document.createElement('input');
access.type = 'checkbox';
access.className = SEC_Privileges[i].Unique_Code;
label = document.createElement('label');
// create a textnode with the unique code from the privileges
label.appendChild(document.createTextNode(SEC_Privileges[i].Name));
div.appendChild(label);
div.appendChild(access);
}
}
}
}
});
2) Written simple function to check the checkbox based on the classname: 2)编写简单的函数来检查基于类名的复选框:
$(document).on('change', '#select_profile', function () {
var selectedValue = $("#select_profile option:selected").text(),
selectedProfile, privileges, div, label, access;
console.log(selectedValue);
for (var i = 0; i < PRIVILEGE_PROFILES.length; i++) {
if (PRIVILEGE_PROFILES[i].PROFILE_ID === selectedValue) {
privileges = PRIVILEGE_PROFILES[i].PRIVILEGE_CODE;
}
}
for(var j = 0; j < privileges.length; j++) {
$('.'+privileges[j]).attr("checked", "true");
}
});
Is there a reason why you do not use jQuery selectors in your code? 你有没有在你的代码中使用jQuery选择器的原因?
Anyway, I've made an update to solve your problem (not using jQuery) http://jsfiddle.net/dj8jr19e/7/ 无论如何,我已经做了一个更新来解决你的问题(不使用jQuery) http://jsfiddle.net/dj8jr19e/7/
The main issue is that you did not set any IDs to your checkboxes. 主要问题是您没有为复选框设置任何ID。 I've set an
ID
corresponding to the Unique_Code
of your privileges. 我已经设置了与您的特权的
Unique_Code
相对应的ID
。
access.id = SEC_Privileges[i].Unique_Code;
Then when you iterate through the associated privileges from the selected profile, I've simply used getElementById
because the privileges
contains Unique_Code used as Ids of the checkboxes. 然后,当您从所选配置文件中迭代关联的权限时,我只使用了
getElementById
因为privileges
包含Unique_Code用作复选框的ID。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.