添加元素从外部形式提交形式标记

此菜单超出我的结束窗体标记。

如何将选择选项添加到表单上提交？

到目前为止，我有：

<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

添加元素从外部形式提交形式标记

回答

相关问题