2010-03-28 88 views
1

再次編輯...我只是一個假人,並想通了!jquery動態選擇不提交值

編輯:因此,它看起來像如果我在目標選擇框突出一切並點擊「添加所選」,將其提交...我如何糾正這種行爲在下面的代碼,這樣你不必須點擊「添加選擇」按鈕才能使其工作?

我有一個包含三個選擇框的表單。第一個是類別,並從中選擇一個類別將填充具有特定於所選類別的值的變量多選框。選擇變量,然後單擊「添加選定」將填充目標選擇框將這些變量。問題是,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(); 
}) 

回答

0

我看不到你所有的代碼,所以如果我指出一些明顯的東西,請原諒我。

當您提交表單時,'target'選擇框中的所有項目都需要'selected'。否則,瀏覽器將不會在請求中提交它們。

您可以在表單的提交方法中執行此選擇。 事情是這樣的:

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

希望這有助於

+0

它做...我沒有風搞清楚這一點。 :-) – n00b0101 2010-03-29 00:29:28