0

データベースから生成されたさまざまなフォームを含むページがあります。各フォームには、データをロードするための下部に div が与えられています。これらには動的 ID があります: tempdiv_1 tempdiv_2 など。

セクションIDを持つ非表示の入力であるthis.input.valのようなものに基づいてdivを更新するためにjqueryを機能させようとしています。

コード：

<script type="text/javascript">
$('#formdataAddForm').live('submit' , function() { // catch the form's submit event
   $.ajax({ // create an AJAX call...
        data: $(this).serialize(), // get the form data
        type: $(this).attr('method'), // GET or POST
        url: $(this).attr('action'), // the file to call
        success: function(response,data) { // on success..
            $.fancybox({
            maxWidth    : 800,
            maxHeight   : 200,
            fitToView   : false,
            width       : '70%',
            height      : '70%',
            autoSize    : false,
            closeClick  : false,
            openEffect  : 'none',
            closeEffect : 'none',
            content     : response
        });
        $('#tempdiv_'+(('input[id="formdataSection"]', form).val())).load('/page/list.php');
    }
});
return false; // cancel original event to prevent form submitting
});
</script>

私が仕事に就けないのは、次のようなものです。

 $('#tempdiv_'+(('input[id="formdataSection"]', form).val())).load('/page/list.php');

jqueryで動的divを更新するにはどうすればよいですか? フォームはすべて同じ ID を持っているため、フォーム ID を呼び出すことはできません。

4

1 に答える 1

0

このコードを試してください:

 <script type="text/javascript">
   $('#formdataAddForm').live('submit' , function() { // catch the form's submit event
   var form = $(this)
   $.ajax({ // create an AJAX call...
        data: $(this).serialize(), // get the form data
        type: $(this).attr('method'), // GET or POST
        url: $(this).attr('action'), // the file to call
        success: function(response,data) { // on success..
            $.fancybox({
            maxWidth    : 800,
            maxHeight   : 200,
            fitToView   : false,
            width       : '70%',
            height      : '70%',
            autoSize    : false,
            closeClick  : false,
            openEffect  : 'none',
            closeEffect : 'none',
            content     : response
        });
        $('#tempdiv_'+($('input[id="formdataSection"]', form).val())).load('/page/list.php');
    }
});
return false; // cancel original event to prevent form submitting
});
</script>

質問のコードが実行しようとしているものと同じである場合は、それが役立つはずです。あなたのコードフォームでは変数が定義されておらず、この行で $ を見逃しています:$('#tempdiv_'+($('input[id="formdataSection"]', form).val())).load('/page/list.php');

さらに、 div id を格納する入力nameの代わりに属性を使用する方が本当に良いでしょう。idID は一意で、名前である必要があります - いいえ。フォーム コンテキスト ( の 2 番目のパラメーター$('input[id="formdataSection"]', form)) が正しい値を見つけるのに役立つはずですが (私が覚えているように、私はそのようなことを成功裏に試みてきました)、名前の方が信頼性が高く有効であるとします。

于 2012-09-10T11:56:30.547 に答える