Perl和jQuery从多选下拉列表中选择元素 [英] Perl and jQuery to select elements from multiselect dropdown
问题描述
我有一个多选下拉列表，其中哈希值为all_colors中有8种颜色：
my％all_colors =（
1 => ;'红色'，
2 =>'黄色'，
3 =>'橙色'，
4 =>' Blue'，
5 =>'Black'，
6 =>'Brown'，
7 =>'Green' ，
8 =>'白'，
）;
我把它放在下拉列表中像这样：
我的$ color_selector ='< select name =all_colors>';
foreach my $ color（sort {$ all_colors {$ a} cmp $ all_colors {$ b}}键％all_colors）{
$ color_selector。= qq~< option value =$ color > $ all_colors {$ color}< / option>〜;
}
$ color_selector。='< / select>';
I have a multiselect dropdown which has 8 colors in a hash %all_colors:
my %all_colors = (
1 => 'Red',
2 => 'Yellow',
3 => 'Orange',
4 => 'Blue',
5 => 'Black',
6 => 'Brown',
7 => 'Green',
8 => 'White',
);
I have put it in a dropdown like this:
my $color_selector = '<select name="all_colors">';
foreach my $color (sort {$all_colors{$a} cmp $all_colors {$b}} keys %all_colors ) {
$color_selector .= qq~<option value="$color">$all_colors{$color}</option>~;
}
$color_selector .= '</select>';
现在我想添加2个新复选框。
Now I want to add 2 new checkboxes.
< input type =checkboxname =maincolorsvalue =1class =inputCheckbox />主要颜色
< input type =checkboxname =resetofcolorsvalue =1class =inputCheckbox/>剩下的颜色
<input type="checkbox" name="maincolors" value="1" class="inputCheckbox" /> Main Colors
<input type="checkbox" name="resetofcolors" value="1" class="inputCheckbox" /> Rest of the Colors
在Perl中，我添加了一个常量来选择checkbox1并在perl中使用常量调用复选框。当选中Main Colors复选框时，我不知道如何使用它来在下拉列表中选择这4个值。单击其余颜色复选框时应检查其余颜色。
使用常量MAIN_COLORS => {
1 => '红色'，
2 => '橙色'，
3 => '绿色'，
4 => '白'，
};
我的$ main_colors = MAIN_COLORS;
我编写了一个使用纯HTML的代码，但实际上我想调用Perl散列的颜色
< select id =multipeColorSelectmultiple size = 8>
< option value =Redclass =maincolor> Red< / option>
< option value =Orangeclass = maincolor>橙色< /选项>
<选项值=绿色class =maincolor>绿色< /选项>
<选项值=白色类=主要颜色>白色< /选项>
<选项值=黄色>黄色< /选项>
<选项value =Blue> Blue< / option>
< option value =Black> Black< / option>
< option value =Brown >布朗< /选项>
< / select>
但我不希望这使用纯HTML，而是我想要：
1）如果我选择checkbox1主要颜色，它应该从下拉列表中自动选择红色，橙色，绿色，白色，即它应该从散列中调用值
2）如果我选择checkbox2其他颜色，它应该自动从下拉列表中选择剩余的颜色，即。，它应该从哈希值调用值
请帮助。
此外，有一些条件在jQuery中没有按预期工作。我也需要jQuery的帮助。
1）如果从下拉列表中随机选择任何1种颜色而不是选中复选框，那么我想要禁用不是的复选框与该组有关。
例如：如果直接从下拉列表中选择红色，则应禁用其余颜色复选框。如果我取消选择红色并直接选择布朗，则应重新启用其余颜色
复选框，并禁用主要颜色复选框。
2）选择其他元素时，不需要禁用一组四个元素。两者都可以同时选择，以便通过选中两个复选框来选择所有选项。
允许用户选择和取消选择已在下面的jQuery代码中工作的四人组成员。
3）如果白色和黄色都是从下拉列表同时选中，然后两个复选框都应该启用。
$（'input [name =colorcheckbox]'）。click（function（） {
var colorsToSelect = $（this）.val（）;
if（$（this ）.prop（'checked'）== true）{
if（colorsToSelect =='maincolors'）{
$（'＃multipeColorSelect option'）。slice（ 0,4）.prop（'selected'，true）;
}否则if（colorsToSelect =='restofcolors'）{
$（'＃multipeColorSelect option'） .slice（4,8）.prop（'selected'，true）;
}
} else {
if（colorsToSelect == 'maincolors'）{
$（'＃multipeColorSelect option'）。slice（0,4）.prop（'selected'，false）;
}否则if（colorsToSelect =='restofcolors'）{
$（'＃multipeColorSelect option'）。slice（4,8）.prop（'selected'，false ）;
}
}
}）;
请帮助。
And in Perl, I added one more constant to select checkbox1 and use constant in perl to call the checkbox. I dont know how to use this to select these 4 values in dropdown when "Main Colors" checkbox is checked. And Rest of colors should be checked when clicked on "Rest of the Colors" checkbox.
use constant MAIN_COLORS => {
1 => 'Red',
2 => 'Orange',
3 => 'Green',
4 => 'White',
};
my $main_colors = MAIN_COLORS;
I have written a code which uses plain HTML but I actually want to call the colors from Perl hash
<select id="multipeColorSelect" multiple size="8">
<option value="Red" class="maincolor">Red</option>
<option value="Orange" class="maincolor">Orange</option>
<option value="Green" class="maincolor">Green</option>
<option value="White" class="maincolor">White</option>
<option value="Yellow">Yellow</option>
<option value="Blue">Blue</option>
<option value="Black">Black</option>
<option value="Brown">Brown</option>
</select>
But I dont want this to use plain HTML, instead I want :
1) If I select checkbox1 "Main Colors", it should automatically select Red, Orange, Green, White from the dropdown ie., it should call values from hash
2) If I select checkbox2 "Rest of the Colors", it should automatically select the rest of the colors from the dropdown ie., it should call values from hash
Please help.
Also, There are some conditions which is not working in jQuery as expected. I need help for jQuery also.
1) If any 1 color is randomly selected from the dropdown instead of checking checkbox, then I want to disable the checkbox which is not related to that group.
Ex: If Red is selected from dropdown directly, "Rest of the Colors" checkbox should be disabled. If I deselect Red and select Brown directly, then "Rest of the colors"
checkbox should be reenabled and "Main Colors" checkbox should be disabled.
2) One set of four elements need not be disabled when others are selected. Both can be selected simutlaneously so that all are selected by checking both checkboxes.
Users are allowed to select and deselect members of the group of four which is already working in jQuery code below.
3) If "White" and "Yellow" both are selected at the same time from dropdown, then both checkboxes should be enabled.
$('input[name="colorcheckbox"]').click(function () {
var colorsToSelect = $(this).val();
if($(this).prop('checked') == true) {
if(colorsToSelect == 'maincolors') {
$('#multipeColorSelect option').slice(0,4).prop('selected', true);
} else if (colorsToSelect == 'restofcolors') {
$('#multipeColorSelect option').slice(4,8).prop('selected', true);
}
} else {
if(colorsToSelect == 'maincolors') {
$('#multipeColorSelect option').slice(0,4).prop('selected', false);
} else if (colorsToSelect == 'restofcolors') {
$('#multipeColorSelect option').slice(4,8).prop('selected', false);
}
}
});
Please help.
推荐答案
color_selector ='< select name =all_colors>';
foreach my
color_selector = '<select name="all_colors">';
foreach my
color（sort {
color (sort {
all_colors {
all_colors{
这篇关于Perl和jQuery从多选下拉列表中选择元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
