7

ユーザーの操作に基づいて動的な部分ビューを追加するページがあります。また、同じ部分ビューを何度でも追加できます。各部分ビューは、JQuery と AJAX を介して送信を実行します。ページ全体で ID の重複を避ける最善の方法は何ですか。 JQuery 関数は ID セレクターを使用するため、これは非常に重要です。解決策を教えてください。

部分図1

<script type="text/javascript"> 
    $(function () {
        $("#MyButton1")
            .button()
            .click(function () {
                alert("MyButton1 clicked From MyForm1 ");
            });
    });
</script>
<div><p>MyForm1</p></div>
<form id="MyForm1" >
    <input id="MyButton1" type="button" value="buttonFromPartial1" />
 </form>

部分図2

<script type="text/javascript"> 
    $(function () {
        $("#MyButton1")
            .button()
            .click(function () {
                alert("MyButton1 clicked From MyForm2 ");
            });
    });
</script>
<div><p>MyForm2</p></div>

<form id="MyForm2" >
    <input id="MyButton1" type="button" value="buttonFromPartial2" />
</form>
4

4 に答える 4

2

このような場合、ページに同じものが N 個ある場合は、ID で返信するのをやめて、代わりに相対ロジックを使用するのが最善だと思います。

あなたの場合、送信ボタンのクリックイベントを処理し、投稿ロジックをフォームに適用することを意味します。

ID に依存しない jQuery セレクターを使用してバインディングを行うことができます。クラス セレクターを使用する以下のコードを参照してください。

サンプル HTML

<form name="myForm">
    <input class="buttonFromPartial" name="myButton" type="button"  />
</form>
<form name="myForm">
    <input class="buttonFromPartial" name="myButton" type="button"  />
</form>

クリックハンドラ

$("input.buttonFromPartial").click(function () {
    var $form = $(this).closest("form");
    //do your post logic here
}
于 2013-09-07T11:04:31.280 に答える