1

これとほとんど同じモーダルフォームがあります:http://jqueryui.com/demos/dialog/modal-form.html

フォームにはすでに送信ボタンがあります。このボタンを使用してフォームを送信することはできますが、コールバック関数が機能しません。自分の送信ボタンを使用してコールバック関数を機能させる方法はありますか?

buttons: {
    "Create an account": function () {            
        $("#dialog-form").html("thank you for <b>submit</a>");
    },
    Cancel: function () {
        $(this).dialog("close");
    }
}

あなたはjsFiddleで私のコードをテストすることができます

http://jsfiddle.net/QSJpS/3/

4

2 に答える 2

1

動作中の jsFiddle デモは次のとおりです。

私が変更した部分は、「アカウントの作成」セクション内でした。

if ( bValid ) {
    $( "#users tbody" ).append( "<tr>" +
        "<td>" + name.val() + "</td>" + 
        "<td>" + email.val() + "</td>" + 
        "<td>" + password.val() + "</td>" +
        "</tr>" ); 
    $( this ).html("Thank you!");
}

出力:

ここに画像の説明を入力


Ajaxソリューションの編集:

あなたがする必要があるのは、メッセージを台無しにするページの更新がないように、ajax を介してフォームを投稿することです。次のようなことができます。

$("#submit-button-id").click(function(e) {

    var data = 'name='+ $("#name").val() + 
               '&email=' + $("#email").val() + 
               '&password=' + $("#password").val() ;  

    $.ajax({  
        type: "POST",  
        url: "some-processing-page.html",  
        data: data,  
        success: function() {  
            $('#dialog-form').html("Thank you for your submission!");  
            $(".ui-dialog-buttonpane").hide();
        }  
    });  

    e.preventDefault();  

});
于 2012-04-18T18:16:34.603 に答える
0

したがって、次のようになります。

http://jsfiddle.net/QSJpS/4/ ?

$(function(){
    $("#submitButton").click(function () {

                    var bValid = true;

                    if (bValid) {
                        $("#users tbody").append("<tr>" +
                        "<td>" + $("#name").val() + "</td>" +
                        "<td>" + $("#email").val() + "</td>" +
                        "<td>" + $("#password").val() + "</td>" +
                    "</tr>");
                        $("#dialog-form").html("thank you for <b>submit</a>");
                        $(".ui-dialog-buttonpane").hide();
                    }
     });
});               
​
于 2012-04-18T18:51:41.030 に答える