Question

再次编辑......我只是个假人并想出来了！

编辑：所以，看起来如果我突出显示目标选择框中的所有内容并单击“添加所选”，它会提交...如何在下面的代码中更正此行为，这样就不会必须单击“添加所选”按钮才能使其生效？

我有一个包含三个选择框的表单。第一个是类别，从中选择一个类别将使用特定于所选类别的值填充变量多选框。选择变量然后单击“添加所选”将填充目标选择框中的那些变量。问题是，print_r显示目标选择框中的值在提交时未传递，我不明白为什么......下面是代码，非常感谢帮助

这是html标记：

<select multiple="" id="categories" name="categories[]">
   <option class="category" value="Income">Income</option>
   <option class="category" value="Gender">Gender</option>
   <option class="category" value="Age">Age</option>
</select>

//请注意，我只显示可能选择类别的变量

<select multiple="multiple" id="variables" name="variables[]">
  <option value="2">Less Than $15,000</option>
  <option value="3">$15,000 - $19,999</option>
  <option value="4">$20,000 - $29,999</option>
  <option value="5">$30,000 - $39,999</option>
  <option value="6">$40,000 - $49,999</option>
  <option value="11">$90,000 - $99,999</option>
  <option value="12">$100,000 - $124,999</option>
  <option value="13">$125,000 - $149,999</option>
  <option value="14">Greater than $149,999</option>
</select>

<select name="target[]" id="target" multiple="multiple" height="60">
</select>

这是jquery代码：

$(function(){
 var  opts    = {}, 
      $cats   = $("#categories"), 
      $target = $("#target"),
      $vars   = $("#variables");

 $vars.find("option").each(function(){
     var $opt  = $(this),
         cat   = this.className,
         value = this.value,
         label = $opt.text();

     if(!opts[cat]) { opts[cat] = []; }

     opts[cat].push({label: label, value: value});

     $opt.remove();
 });

 function update_variables(){
     var cat = $cats.val(), new_opts = [];
     $vars.empty();

     $.each(opts[cat], function(){
       if( $target.find('[value=' + this.value + ']').length === 0 ){
         new_opts.push(option(this.value, this.label));
       }
     });

     $vars.html(new_opts.join(''));
 }

 function option(value, label){
   return "<option value='" + value + "'>" + label + "</option>";
 }

 $("#add").click(function(e){
   e.preventDefault();
   $vars.find(':selected').appendTo($target).attr('selected',false);
   update_variables();
 });

 $("#remove").click(function(e){
   e.preventDefault();
   $target.find(':selected').remove();
   update_variables();
 });

 $cats.change(function(){
   update_variables();
 }).change();
})

Answer 1

我看不到你的所有代码，所以如果我指出一些明显的东西，请原谅我。

提交表单时，“目标”选择框中的所有项目都需要“选中”。否则，浏览器将不会在请求中提交它们。

您可以在表单的提交方法中执行此选择。像这样：

$('#formid').submit(function() {
    $("#target").find('option').attr('selected',true);
});

希望这有帮助

jquery动态选择不提交值

1 个答案: