0

私はTwitterBootstrapmodaleを使用して、ajaxによってロードされたフォームを表示しています。

ボタンをクリックして、modaleを表示します。これは、ajaxを介してコンテンツを取得します。

$('#team_join_modale_show').on('click', function(e) {
    e.preventDefault();
    var href = $(e.target).attr('href');

    $.get(href, function(data) {
        $(data).modal();
    });
});

次に、「＃team_join_modal」という名前のモデルが表示されます（これは以前はDOMにありませんでした）。その上に「#ajax_form_team_join」というフォームがあります。

$('#team_join_modal').on('shown', function () {
    $('#ajax_form_team_join').ajaxForm({
        target:        '#errorTeamJoin',
        clearForm:     true
    });
});

問題は、スニペット$（'＃ajax_form_team_join'）。ajaxForm（）;です。が実行されることはないため、フォームが正しく機能していません。

イベントをjs全体に移動しようとしましたが、.onを.liveに変更し、新しいメソッド.onに変更しましたが結果はありません。何が足りないのですか？

4

2 に答える 2

1

成功AJAX関数でイベントをすぐにバインドできます。

$('#team_join_modale_show').on('click', function(e) {
    e.preventDefault();
    var href = $(e.target).attr('href');
    $.get(href, function(data) {
        var $data = $(data);
        $data
          .on('shown', function () {
            $('#ajax_form_team_join', $data).ajaxForm({
              target: '#errorTeamJoin',
              clearForm: true
            });
          })
          .modal();
    });
});

ただし、これはより適切にリファクタリングできます。

于 2012-05-13T17:43:15.567 に答える
-1 
$('#team_join_modale_show').on('click', function(e){
    e.preventDefault();
    var href = $(e.target).attr('href');
    $.get(href, function(data) {
        $(data).modal();
    });
    $('#ajax_form_team_join').ajaxForm({
        target:'#errorTeamJoin',
        clearForm: true
    });
});

これを試してください。

于 2012-05-13T14:56:15.167 に答える