无法更改通过JQuery的RadioButtonFor选择

Question

我正在处理代码以确定是否显示联系人信息部分。为此，我正在为Razor中的MVC视图模型实现带有布尔值的RadioButtonFor html-helper。

页面加载时，如果HasConflicts模型值为true，我需要从默认值更改，而不是显示它。我试图使用JQuery在页面加载时执行此操作，但所选选项不会更改。

这里是剃刀部分

<div class="left-col" id="noConflict"> 
    @Html.RadioButtonFor(m => m.HasConflicts, "false") <strong><em>No Conflict of Interest exists at this time</em></strong> 
</div> 
<div class="right-col" id="yesConflict"> 
    @Html.RadioButtonFor(m => m.HasConflicts, "true") <strong><em>A Conflict of Interest exists at this time</em></strong> 
</div> 

这里是JQuery的，我试图把在页面加载，下面从网站另一个答案，并去除条件只是为了看看我甚至可以得到选择“yesConflict”按钮。

$(function() {   
    $('#yesConflict').prop('checked', true).change(); 
}; 

最奇怪的是改变事件发生，所以这应该是正确的ID，但屏幕上选择的按钮不会改变。

我感谢任何输入，谢谢！

编辑：我有一个这些RadioButtonFor行的HTML输出的请求 - 在这里。

<div class="left-col" id="noConflict"> 
     <input checked="checked" data-val="true" data-val-required="The HasConflicts field is required." id="HasConflicts" name="HasConflicts" type="radio" value="false" /> <strong><em>No Conflict of Interest exists at this time</em></strong> 
    </div> 
    <div class="right-col" id="yesConflict"> 
     <input id="HasConflicts" name="HasConflicts" type="radio" value="true" /> <strong><em>A Conflict of Interest exists at this time</em></strong> 
    </div> 

当通过IE浏览器开发者工具检查一边跑这里有两个输入：

<input name="HasConflicts" id="HasConflicts" type="radio" checked="checked" value="false" data-val-required="The HasConflicts field is required." data-val="true" data-dpmaxz-eid="6"> 
<input name="HasConflicts" id="HasConflicts" type="radio" value="true" data-dpmaxz-eid="7"> 

请让我知道如果我能在得到回答任何进一步的帮助。我研究过的所有东西都说我放在那里的JQuery行应该从JQuery 1.6开始，使用1.10来完成，但它根本无法工作。

Answer 1

首先，ID是唯一

对于id="HasConflicts"你不应该用这一次，尝试将其更改为class="HasConflicts"等，因为当你调用#HasConflicts将只针对第一个。

解决您的jQuery代码：

您定位的父元素，使用$('#yesConflict > input')目标输入射频（的#yesConflict直接子），检查以下内容：

注：

$('#yesConflict input')使用空间它会发现里面的所有输入#yesConflict

$('#yesConflict > input')使用>只会针对的#yesConflict

$(function() { 
 
    $('#yesConflict > input').prop('checked', true).change(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="left-col" id="noConflict"> 
 
    <input checked="checked" data-val="true" data-val-required="The HasConflicts field is required." id="HasConflicts" name="HasConflicts" type="radio" value="false" /> <strong><em>No Conflict of Interest exists at this time</em></strong> 
 
</div> 
 
<div class="right-col" id="yesConflict"> 
 
    <input id="HasConflicts" name="HasConflicts" type="radio" value="true" /> <strong><em>A Conflict of Interest exists at this time</em></strong> 
 
</div>