以下は、ボックスがチェックされているかどうかに基づいてテキストボックスを表示/非表示にするコードです (ページが読み込まれるとテキストボックスは非表示になります)。すべてのアラートは適切に発生していますが、チェック ボックスを.show()
機能させることができません。
ここにjQueryがあります。これはdocument.ready
関数内からです。私が試した他の 2 つの方法をコメントアウトしたことからわかります (どちらも機能しませんでした)。
$('#OverrideRegionInd').click(function () {
alert($(this).is(':checked'));
if ($(this).is(':checked')) {
alert("inside if");
$('#Region').show();
//$('#Region').css("display", "inline");
// $('#Region').toggle();
$('#territoryName').html("");
$('#Region').val("");
} else {
alert("inside else");
$('#Region').hide();
//$('#Region').css("display", "none");
// $('#Region').toggle();
}
});
ここにビューからのコードがあります
<div class="M-editor-label">
@Html.LabelFor(model => model.Region)
</div>
<div class="M-editor-field" id="territoryName">
@Html.TextBoxFor(model => model.Region, new { style = "display: none;" })
@Html.ValidationMessageFor(model => model.Region)
</div>
この特定<div>
の のセットに対してページがレンダリングされた後の HTML は次のとおりです。
<div class="M-editor-label">
<label for="Region">Territory</label>
</div>
<div class="M-editor-field" id="territoryName">
<input id="Region" name="Region" style="display: none;" type="text" value="" />
<span class="field-validation-valid" data-valmsg-for="Region" data-valmsg-replace="true"></span>
</div>