動態更改多個隱藏的表單域

我對jQuery有點新鮮。我很確定這是可能的，但我不引用如何編碼。動態更改多個隱藏的表單域

我想要做的是使用代表範圍的選擇下拉（例如，如果有人正在尋找臥室，下拉選擇將看起來像「0-2」，「3-5」，「6 +「）。然後當有人選擇一個選擇時，兩個隱藏的字段會被動態填充。一個字段的範圍最小，另一個字段的範圍最大。

下面是如何我試圖構建這樣一個例子：

<select id="bedrooms" class="dropdown"> 
     <option>Bedrooms</option> 
     <option></option> 
     <option value="1">0-2</option> 
     <option value="2">3-5</option> 
     <option value="3">6+</option> 
    </select> 

    <input type="hidden" name="bedrooms-from" value=''> 
    <input type="hidden" name="bedrooms-to" value=''>

我想每個選項的值可以改變，我不知道什麼是最好的方式來處理，這將是。

來源

2011-06-07 Kurt

你想要什麼德「最大範圍」成爲6+ – 2011-06-07 21:30:45

$("select").on("change", function() { 
    $("form").append(/* <input type='hidden'> tag here */); 
});

來源

2011-06-07 21:04:00

這可能會導致多個值傳輸到服務器 - 想象這個控制器會多次改變。這可能會或可能不會被期望。它也不顯示提取值。（[0,2]從「0-2」，[6 ,?]從「6+」） – 2011-06-07 21:06:09

好的調用...它需要一個存儲[select.id] => hasBeenSet的數組，然後執行一個。值（）如果是的話 – 2011-06-07 21:15:10

我還沒有真正運行這一點，但我覺得它應該工作：

$("#bedrooms").change(function() 
{ 
    // Get a local reference to the JQuery-wrapped select and hidden field elements: 
    var sel = $(this); 
    var minValInput = $("input[name='bedrooms-from']"); 
    var maxValInput = $("input[name='bedrooms-to']"); 

    // Blank the values of the two hidden fields if appropriate: 
    if (sel.val() == "") { 
     minValInput.val(""); 
     maxValInput.val(""); 
     return; 
    } 

    // Get the selected option: 
    var opt = sel.children("[value='" + sel.val() + "']:first"); 

    // Get the text of the selected option and split it on anything other than 0-9: 
    var values = opt.attr("text").split(/[^0-9]+/); 

    // Set the values to bedroom-from and bedroom-to: 
    minValInput.val(values[0]); 
    maxValInput.val((values[1] != "") ? values[1] : 99999999); 
});

來源

2011-06-07 21:44:26

這與我的想法是一致的。好的建議。我認爲OP可以考慮在選項中使用比「1,2,3」更好的值，儘管這可能有助於分裂？個人喜好當然，我只是喜歡用價值而不是文字來表達這些東西。 – WesleyJohnson 2011-06-07 21:47:48

謝謝:)是的，我認爲選項值中的範圍也會更簡單。 – 2011-06-08 05:14:51

動態更改多個隱藏的表單域

回答

相關問題