RadioButtonを変更できません。JQueryを使用して選択します。

Question

私は連絡先情報セクションを表示するかどうかを判断するコードを作成しています。これを行うには、私はRazorのMVCビューモデルのブール値を持つRadioButtonFor htmlヘルパーを実装しています。

ページが読み込まれたら、デフォルトから変更して、表示しないようにして、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である必要がありますが、画面上で選択したボタンは変更されません。

ありがとう！

EDIT：これらのRadioButtonForラインのHTML出力をリクエストしました。ここにあります。

<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"> 

私は答えを得ることに任意のさらなる支援のものとすることができる場合は私に知らせてください：ここで実行中にIEの開発者ツールを経由して検査

<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> 

は、2つの入力があります。私が調査したすべてのことは、私がそこに置いたJQueryラインは、JQuery 1.6以降から、1.10を使って欲しいものを行うべきだと言いますが、それは単に機能しません。

Answer 1

まず、IDはあなたが#HasConflictsを呼び出すとき、それは最初のものだけを対象としますので、class="HasConflicts"などにそれを変更しようと、複数回、それを使用すべきではありませんid="HasConflicts"について

ユニークです。お使いのjQueryコードに

ソリューション：

注：

あなたは親要素、入力ラジオ（#yesConflictの直接の子）を対象とする$('#yesConflict > input')を使用をターゲットにしている、次の点を確認してください

$('#yesConflict input')使用スペース内すべての入力を見つける#yesConflict

$('#yesConflict > input')あなたがレンダリングされたHTMLを表示することができ、それが唯一の#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>