javascript - 使用表单发布发送另一个选择值作为参数

Question

我有一个带有选择元素的表单，其中包含从外部来源填充的类别列表。当我提交表单时，我希望能够为所选选项 (category_id) 的值发布参数，这按预期工作。但是，我还想传递第二个参数 (category_name)，它当前是选择选项的文本。

为了清楚起见，下面是选择元素的一个非常简单的表示:

<select name="category_id" id="category_id">
<option value='1'>All</option>
    <option value='2'>Category 1</option>
    <option value='3'>Category 2</option>
</select> 

我想知道这样做的最佳方法是什么。我需要使用 Javascript 还是有某种方法可以通过 HTML 来实现？对于我使用 Rails 构建应用程序的值(value)，如果有一种聪明的方法可以使用该框架来完成此操作，那么了解它也将非常有用。

在此先感谢您的帮助。

戴夫

Answer 1

您可以更改值，使其包含两个值，然后在服务器上拆分它们:

<select name="category_id" id="category_id">
    <option value='1|All'>All</option>
    <option value='2|Category 1'>Category 1</option>
    <option value='3|Category 2'>Category 2</option>
</select> 

或者使用一些 javascript 并更新隐藏字段:

HTML

<select name="category_id" id="category_id">
    <option value='1'>All</option>
    <option value='2'>Category 1</option>
    <option value='3'>Category 2</option>
</select> 
<input type="hidden" id="category_name" name="category_name" />

JS

function updateNameValue() {
    $('#category_name').val($('#category_id option:selected').text());
}

$('#category_id').change(updateNameValue);

updateNameValue(); // Call function here to make sure initial value is set

http://jsfiddle.net/6runZ/