【问题标题】:How to display checked radio button on Modal?如何在 Modal 上显示选中的单选按钮?
【发布时间】:2020-11-10 02:48:21
【问题描述】:

我有这个编辑模式,当我加载它时,它会加载所有其他字段,除了单选按钮之一。 我尝试使用下面列出的两个命令加载它,但没有运气。 有什么我缺少的东西让它工作吗?

<div class="text-center">
                                <div class="w3-row">
                                    <label for="event_category">Event Category:</label>
                                    <input class="w3-radio" type="radio" name="event_category" id="event-category" value="C">
                                    <label>Competition</label>    
                                    <input class="w3-radio" type="radio" name="event_category"  id="event-category" value="F">
                                    <label>Fundraiser</label>    
                                    <br>
                                    <input class="w3-radio" type="radio"  name="event_category" id="event-category" value="P">
                                    <label>Practice</label>
                                    <input class="w3-radio" type="radio"  name="event_category" id="event-category" value="O">
                                    <label>Other</label>
                                </div>
                            </div>

$('#event_category').prop('checked',event.event_category);
$('#event_category').val("input[name='radio']:checked");

【问题讨论】:

  • 你希望&lt;input class="w3-radio" type="radio" name="event_category" id="event-category" value="C"&gt;在加载时被检查

标签: javascript html ajax laravel


【解决方案1】:

每个输入元素都需要唯一的 ID。 (在任何 HTML 文档中都不应重复 ID)。

<div class="text-center">
    <div class="w3-row">
        <label for="event_category">Event Category:</label>
        <input class="w3-radio" type="radio" name="event_category" id="event-category-C" value="C">
        <label>Competition</label>    
        <input class="w3-radio" type="radio" name="event_category"  id="event-category-F" value="F">
        <label>Fundraiser</label>    
        <br>
        <input class="w3-radio" type="radio"  name="event_category" id="event-category-P" value="P">
        <label>Practice</label>
        <input class="w3-radio" type="radio"  name="event_category" id="event-category-O" value="O">
        <label>Other</label>
    </div>
</div>

需要的单选按钮可以通过ID查询并设置为选中。

$("#event-category-P").prop("checked", true);

例如,如果您在 event_category 变量中有值,则可以将其附加到选择器:

let event_category = 'P';
$("#event-category-" + event_category).prop("checked", true);

【讨论】:

  • 我遵循了您的建议,它对我有用,谢谢!我想我的困惑是因为我认为因为它是一组单选按钮,所以它们需要具有相同的 ID。感谢您为我澄清这一点。
猜你喜欢
  • 1970-01-01
  • 2011-02-07
  • 1970-01-01
  • 2017-10-11
  • 2021-07-03
  • 1970-01-01
  • 1970-01-01
  • 2012-09-05
  • 2021-07-27
相关资源
最近更新 更多