0

「パスワードを忘れた」リンクは「パスワードを忘れた」モーダルを開き、「友達に教える」リンクは「友達に教える」モーダルを開きます。

どちらのモーダルにも、送信できるフォームが含まれています。

問題は、最初のモーダルを開いて送信するか閉じると、2 番目のモーダルを送信できないことです。2 番目のモーダルを開くことはできますが、送信できません。

何が問題なのか教えてください！

以下は、HTML ファイルにインポートされる別の JavaScript ファイルにある JavaScript コードです。それが問題になる場合、それはインラインJavaScriptではありません。

[コード]

var forgottenPasswordDiv;
var tellAFriendDiv;

function clearErrorMessages() {
    $('#errorMessage').text("");        
}

function openForgottenPassword() {
    forgottenPasswordDiv = $('#forgotten-password');
    $('#forgotten-password').load("/Templates/include/new/ajax/modal/forgottenPassword.jsp")
    .dialog(
        {
            autoOpen:false,
            modal:true, 
            position:'left+35% top+20%', 
            width:'330', 
            height:'auto'
        }
    );
    $('#forgotten-password').dialog('open');
}

function closeForgottenPassword() {
    forgottenPasswordDiv.dialog("close");
}

function submitForgottenPassword() {
    clearErrorMessages();
    var email = $('#email').val();
    if (email == null || email == '') {
        $('#errorMessage').text("Please enter your user name or email");
    } else {
        clearErrorMessages();
        /* Ajax Post */
        var formData = $("#forgottenPasswordForm").serialize();
        $.ajax({
            type: "GET",
            url: "/Templates/include/new/ajax/forgottenPassword.jsp", 
            data: formData,
            success: function(data) {
                if (data.error != null) {
                    $("#errorMessage").text(data.error);
                } else {                            
                    $('#forgottenPasswordForm , .info').fadeOut(1000);
                    $("#successMessage").text(data.success);        
                    $("div").removeClass('display-none');
                }
            },
            dataType: 'json'
        });
    }               
}

function openTellAFriend(gunId) {
    tellAFriendDiv = $('#tell-a-friend');
    $('#tell-a-friend').load("/Templates/include/new/ajax/modal/tellAFriend.jsp?id=" + gunId)
    .dialog(
        {
            autoOpen:false,         
            modal:true, 
            position:'center top+10%', 
            width:'330', 
            height:'auto'
        }
    );
    $('#tell-a-friend').dialog('open');
}


function closeTellAFriend() {
    tellAFriendDiv.dialog("close");
}

function submitTellAFriend() {
    clearErrorMessages();
    var yourname = $('#yourname').val();
    var errorMessage = "";
    if (yourname == null || yourname == '') {
        errorMessage += "Please enter your name<br />";                 
    } 

    if (errorMessage != '') { 
        $('#errorMessage').html(errorMessage);
    } else {
        clearErrorMessages();
        /* Ajax Post */
        var formData = $("#tellAFriendForm").serialize();
        $.ajax({
            type: "GET",
            url: "/Templates/include/new/ajax/tellAFriend.jsp", 
            data: formData,
            success: function(data) {
                if (data.error != null) {
                    $("#errorMessage").text(data.error);
                } else {
                    $("#tellAFriendForm").fadeOut(1000);                        
                    $("#successMessage").text(data.success);
                    $("div").removeClass('display-none');
                }
            },
            dataType: 'json'
        });
    }
}

[/コード]

4

1 に答える 1

1

ui-dialog ウィジェットは、ダイアログが閉じられた後でも非表示の要素として DOM に残ります。したがって、2 つのダイアログ機能を互いに分離するために、次のように呼び出すことをお勧めします。

forgottenPasswordDiv.dialog("destroy")

「closeForgottenPassword」関数で

tellAFriendDiv.dialog("destroy")

「closeTellAFriend」機能で。

これにより、ダイアログが初期化前の状態に戻ります (「open」関数でダイアログを再初期化するため、まったく害はありません)。

于 2013-02-07T21:31:42.937 に答える