将多个单选按钮与单个文本框相关联答案

【问题标题】：Associate multiple radio buttons with a single textbox将多个单选按钮与单个文本框相关联
【发布时间】：2015-04-20 04:04:14
【问题描述】：

我不擅长前端，而 HTML 是我最想在这里使用的（如果我可以避免在这里使用 js/jquery）。我有一个带有多个单选按钮的文本框 - 比如 item1、item2、...item5。每个 item1, 2... 对应一个字段。当用户在文本框中输入“abc”并选择“item3”时，它应该返回在 item3 字段中具有“abc”的所有项目。我可以为每个 item1、2.. 使用单独的文本框来做到这一点，但我只需要一个与所有单选字段相关联的文本框。

这是相关的 html/模板代码。

    <form action={% url 'search-fields-radiofields' %} method="get">

        <div align="left">

            <input type="text" name="name" size="54" />
            <br><br>

            <input type="radio" id="radio1"name="name">
            <label for="radio1">item1</label>

            <input type="radio" id="radio1"name="name">
            <label for="radio2">item2</label>

            <input type="radio" id="radio1"name="name">
            <label for="radio3">item3</label>

            <input type="radio" id="radio1"name="name">
            <label for="radio4">item4</label>

            <input type="radio" id="radio1"name="name">
            <label for="radio5">item5</label>
            <br><br>
            <input id="search_fields" type="submit" value="Search"  size="100"/>        
</div>
</form>

比如说，搜索词是“测试”。我选择item5。返回带有Get

数据的MultiValueDictKeyError

Variable    Value
u'name'[u'test', u'on']

。 name 是数据库中的字段之一，item5 应该对应于它。同样，如果我将文本框名称更改为“item1”，则Get 数据为

Variable    Value
u'item1' [u'test', u'on']

我有一个专用的view 来处理所有无线电输入，它适用于与每个项目对应的单独文本框。但我需要将所有 5 个单选按钮与上面的 1 个文本框相关联。

【问题讨论】：

标签： html django textbox radio-button

【解决方案1】：

根本不需要将按钮与文本框“关联”。

您缺少的是每个单选按钮本身都需要value。一旦你这样做了，但给他们一个不同的名字，你就大功告成了。

        <input type="text" name="name" size="54" />

        <input type="radio" id="radio1" name="field" value="item1">
        <label for="radio1">item1</label>

        <input type="radio" id="radio1" name="field" value="item2">
        <label for="radio2">item2</label>

...等

现在request.GET 将是{'name': 'test', 'field': 'item1'} 或其他。

【讨论】：

这似乎 (1) 将该值作为所有请求的默认值。在这种情况下，对于 item1 字段，它将始终为 field:item1。对于我的问题，我需要 item1 具有在文本框中输入的任何值。另外，（2）如果所有按钮的名称=“字段”，那么我不知道请求将如何区分不同的按钮 - 标签会这样做吗？对不起，冗长的评论。
谢谢丹尼尔。如下所述解决它。

【解决方案2】：

谢谢大家。自己从后端解决。问题是我试图让请求只发送带有 key=whatever-radio-is-selected 的文本值。我所做的是查看它发送的请求，它是 name=?和文本框=？然后使用这两个键发送正确的响应。

【讨论】：