添加元素從外部形式提交形式標記

此菜單超出我的結束窗體標記。

如何將選擇選項添加到表單上提交？

到目前爲止，我有：

<script> 
$(document).ready(function(){ 
$('#sort_by').change(function(){ 
$("#search_form").submit(); 
    }); 
}); 
</script>

所以上面將提交表單上的變化，但不會添加所選選項的值。如何將提交的選項添加到表單上？

選擇菜單：

<select name="sort_by" id="sort_by"> 
<option value="Low to High">Low to High</option> 
<option value="High to Low">High to Low</option> 
</select>

來源

2015-07-21 user3312792

爲什麼不刪除完全形式，只需通過ajax提交？ – Chris

可能的重複：http://stackoverflow.com/questions/12930502/submitting-a-form-with-an-input-outside-it-and-after-modiying-a-value – Turnip

@SexyTurnip類似的問題，但答案是在香草的JavaScript。 OP已經請求了jQuery，並且他們還沒有要求提交表單來改變select。 – Popnoodles

第一個解決方案是增加一個隱藏的輸入字段的表單裏面是這樣的：

<input type="hidden" name="sort_by" id="myInput"> 

$('#sort_by').change(function(){ 
    $('#myInput').val($(this).val()); 
    $("#search_form").submit(); 
});

記得從選擇

刪除name屬性如果您重新使用ajax函數，您還可以構建FormData對象並將所有數據附加到它（文檔https://developer.mozilla.org/en-US/docs/Web/API/FormData/Using_FormData_Objects）

來源

2015-07-21 12:23:11 Vanojx1

OP沒有要求在選擇的變更上提交表格，他們要求該表格在提交表格時被添加到表格中。 – Popnoodles

@Popnoodles如果你看起來已經在提交的下拉菜單中提交，他沒有改變， – RiggsFolly

他提交了選擇價值變化的形式..... – Vanojx1

您希望該字段成爲提交表單的一部分，因此在提交表單時將選擇附加到表單上。

添加克隆和隱藏以避免視覺變化。

$('#search_form').on('submit', function(){ 
    $('#sort_by').clone().hide().appendTo(this); 
});

既然你張貼整個頁面（不阿賈克斯），都不會有問題，你克隆選擇具有相同ID，不事先刪除重複的克隆。

編輯

雖然在問題的文本說，你要選擇加入上提交表單，給予代碼說你要提交變化形式：

$('#sort_by').on('change', function(){ 
    $('#search_form').append($(this).clone().hide()).trigger('submit'); 
});

來源

2015-07-21 12:26:05 Popnoodles

的形式，這會更好地'隱藏'附加字段'$（'＃sort_by'）。appendTo（this）.hide（）' –

可能值得隱藏。 – Popnoodles

這個效果很好，唯一的問題是當我從選擇菜單中選擇一個選項時，選擇框在追加到表單時消失，然後當我看到結果時返回 – user3312792

添加元素從外部形式提交形式標記

回答

相關問題