私はASP.NET MVCの初心者で、ページが最初にロードされたよりも後にページに表示される場合、チェックボックスで発生する問題に直面しました。次のシナリオを見てください。たとえば、ボタンをクリックすると、Javascript ハンドラーがコントローラーのポストアクションを呼び出し、その結果の html が具体的な div に読み込まれます。このhtmlには、マウスダウンイベントに反応しないチェックボックスが含まれています(チェック状態を変更しません)。
チェックボックスがページ全体とともにレンダリングされた場合は正常に機能しますが、後でレンダリングされた場合 (ポストアクションの結果として) は機能しません。ここで私のマークアップを参照してください:
<a name="button" onclick="handler();"></a>
「ボタン」をクリックActionResult
して、コントローラーから取得してdivに入れたい:
<div id="resultWillBeLoadedIn">
<!-- here is placeholder-->
</div>
次の html は /SomeController/SomeAction から返され、上記の div にロードされます。
<span class="check">
<span class="checkbox">
<input type="checkbox" name="form" value="2" />
</span>
</span>
これが私の「ボタンクリック」のJavascriptハンドラーです。
function handler() {
var url = '/SomeController/SomeAction';
$.post(url, { params... }, function (result) {
$('#resultWillBeLoadedIn').html(result);
}
それについては、CSS の一部を参照してください (私は CSS の専門家ではないので、ここで表示する必要があるかどうかはわかりません。そして... (正直に言うと) 私は著者ではありません)。それ以上必要な場合は教えてください):
.check .checkbox{
float: left;
height: 12px;
width: 12px;
display: inline-block;
margin: 3px 5px 0 0;
cursor: pointer;
background: url(../img/checkbox.png) 0 0 no-repeat;
}
.check span.disable{
float: left;
height: 12px;
width: 12px;
margin: 3px 5px 0 0;
display: inline-block;
background: url(../img/checkbox.png) 0 -24px no-repeat;
}
チェックボックスがページの読み込み時に正しくレンダリングされた場合だけでなく、いくつかの div へのポストバックの結果としてレンダリングされた場合でも機能しないようにするために何が欠けているか教えてください。