2013-03-11 62 views
0

我有一个MVC3网站,产生与安全问题的模式窗口。问题是,当Ajax调用回来,成功或错误和模态窗口是否关闭,所有的表单数据的父窗口的查询字符串结束模式窗口关闭查询字符串后形式数据

$(this).dialog('destroy'); 

$(this).dialog('destroy').remove(); 

and placing close: function() { $(this).dialog('destroy'); }, 
与零个成功的对话框实例

如何防止模态窗口传递窗体值到父窗口查询字符串?

出现在模式窗口管窥

<div id="resetpanel"> 
    <form name="pwreset" id="pwreset" action="" method="post"> 
     Account Number: <input type="text" name="acctNumber" id="acctNumber" /><br /> 
     <button class="btn" name="btnNext" onclick="goResetValidate();return false;">Next</button> 
    </form> 
</div> 
<div id="challengepanel"> 
    <form name="challenge" id="challenge" style="display:none;" action="" method="post"> 
     <input type="hidden" name="setNum" id="setNum" value="" /> 
     Member Number: <input type="text" name="acctNumber2" id="acctNumber2" readonly="true" /><br /> 
     <label id="Q0"></label> 
     Answer: <input type="text" name="answer1" id="answer1" /><br /> 
     <label id="Q1"></label> 
     Answer: <input type="text" name="answer2" id="answer2" /><br /> 
     <label id="Q2"></label> 
     Answer: <input type="text" name="answer3" id="answer3" /><br /> 
     <button class="btn" name="btnNext" id="challengebutton" onclick="goResetPassword();return false;">Submit</button> 
    </form> 
</div> 

AJAX使用jQuery调用

//function that captures the account number and sends them to the service for processing   
    function goResetValidate() { 

     // check that all answers are numbers only on challenge questions 
     var ruleset = { 
        required: true, 
        digits: true 
        }; 
     $('#pwreset').validate({ 
      rules: { 
       qSet0: ruleset, 
       qSet1: ruleset, 
       qSet2: ruleset 
        } 
     }); 

     // challenge questions for password reset 
     var qSet0 = ["Please enter the numeral of the month you were born (i.e. January = 1, February = 2)", "Please enter the last 4 digits of your Social Security number (i.e. 444-55-XXXX)", "Please enter your home zip code - first five digits only (i.e. 22333)."]; 
     var qSet1 = ["Please enter the day of the month you were born (i.e. 1, 2, 3, etc.).", "Please enter the 2 middle digits of your Social Security number (i.e. 444-XX-6666).", "Please enter the last 4 digits of your home telephone number (i.e. 703-555-XXXX)."]; 
     var qSet2 = ["Please enter the first 3 digits of your Social Security number (i.e. XXX-55-6666).", "Please enter the 3 middle digits of your home telephone (i.e. 703-XXX-5555).", "Please enter your home zip code - first five digits only (i.e. 22333)."]; 
     // rand for choice of questions 
     var random = (Math.ceil(Math.random() * 3) - 1); 
     var jRequest = {}; 
     var acnum = $("#acctNumber").val(); 
     jRequest.an = acnum; 

     var jData = {}; 
     jData.request = jRequest; 

     $.ajax({ 
      cache: false, 
      type: "POST", 
      async: false, 
      url: ResetValidateUrl, 
      data: JSON.stringify(jData), 
      contentType: "application/json; charset=utf-8", 
      dataType: "json", 
      success: function (splashObj) { 
       switch (splashObj.ResetValidateResult.RESPONSE) { 
        case "VALID": 
         var challengequestiondisplayed = splashObj.ResetValidateResult.RESPONSE; 
         var quest = "qSet" + random; 
         // remove reset form 
         $('#resetpanel').fadeOut("slow", function() { 
          $('#resetpanel').remove(); 
          $('#acctNumber2').val(acnum); 
          $('#setNum').val(random); 
         }); 
         $.each(eval(quest), function (index, item) { 
          $('#Q' + index).text("" + this + ""); 
         }); 
         $('form#challenge').fadeToggle("slow", "linear"); 
         break; 
        // bad member number    
        case "INVALID": 
         alert("We're sorry; the system did not recognize the Member Number entered. Please try again."); 
         break; 
        // no email on file  
        case "NO_EMAIL": 
         alert("This feature requires a valid email in the system. Please contact us to provide a valid email address."); 
         break; 
        // error  
        case "ERROR": 
         alert("We're sorry; the system was uanble to complete your request. We apologize for the inconvenience."); 
         break; 
        // system is in memo-post mode  
        case "MEMO_POST": 
         alert("The system is unavailable at this time. Please try your request again later."); 
         break; 
       } 
      }, 
      error: function (xhr) { 
       alert("A Password Web Service Error!"); 
       //$(this).dialog('destroy').remove(); 
      } 
     }); 
    } 

//功能捕获账号/ qeustins设置数量/答案,并将其发送到服务处理
函数goResetPassword(){

 var jRequest = {}; 
     jRequest.an = $("#acctNumber2").val(); 
     jRequest.setNumber = $("#setNum").val(); 
     jRequest.answer1 = $("#answer1").val(); 
     jRequest.answer2 = $("#answer2").val(); 
     jRequest.answer3 = $("#answer3").val(); 

     var jData = {}; 
     jData.request = jRequest; 

     $.ajax({ 
      cache: false, 
      type: "POST", 
      async: false, 
      url: ResetPasswordUrl, 
      data: JSON.stringify(jData), 
      contentType: "application/json; charset=utf-8", 
      dataType: "json", 
      success: function (splashObj) { 
       switch (splashObj.ResetPasswordResult.RESPONSE) { 
        // error  
        case "ERROR": 
         alert("We're sorry; the system was uanble to complete your request. We apologize for the inconvenience."); 
         break; 
        // system is in memo-post mode  
        case "MEMO_POST": 
         alert("The system is unavailable at this time. Please try your request again later."); 
         break; 
        case "INVALID_RESPONSE": 
         alert("We're sorry; we are unable to validate your status as the NetBranch account holder based upon your answers to the security questions. Note: The information requested is based upon member data currently on file with Apple FCU. If you continue to encounter difficulties with the security questions, please contact."); 
         break; 
        case "PERM_FROZEN": 
         alert("We're sorry; For security reasons, your online account access has been disabled. We apologize for the inconvenience."); 
         break; 
        case "FROZE_NOW": 
         alert("We're sorry; we are unable to validate your status as the NetBranch account holder. For security purposes, your account has been locked. We apologize for the inconvenience. To restore access, please contact "); 
         break; 
        case "SUCCESS": 
         alert("A temporary password has been sent to the email we have on file."); 
         break; 
       } 
       return false; 
       $(this).dialog('close'); 
      }, 
      error: function (xhr) { 
       alert("Password Web Service Error!"); 
       $.dialog('close').remove; 
      } 
     }); 
    } 

模态窗口的Jquery

$(document).ready(function() { 
    $(".openDialog").live("click", function (e) { 
     e.preventDefault(); 
     $("<div></div>") 
       .addClass("dialog") 
       .attr("id", $(this).attr("data-dialog-id")) 
       .appendTo("body") 
       .dialog({ 
        title: $(this).attr("data-dialog-title"), 
        close: function() { $(this).dialog('destroy'); }, 
        modal: true, 
        width: '530px' 
       }) 
       .load(this.href); 
    }); 

    $(".close").live("click", function (e) { 
     e.preventDefault(); 
     $(this).closest(".dialog").dialog("close"); 
    }); 
}); 
+0

尝试搞乱按钮元素的类型属性(按钮,提交)。从内存中,如果不指定类型,表单中的按钮元素在某些浏览器中可能会表现得异常。如果这能解决它,我会重新发布一个答案。 – Charlino 2013-03-12 19:42:53

回答

0

听着,我不明白你的问题,不过,我会尽量解决您的问题,

$("#my-form-div").dialog({ 
    autoOpen: true, 
    width: 600, 
    height: 600, 
    modal: true, 
    draggable:true, 
    resizable:false, 
    title: 'FORM', 
    buttons: [ 
     { 
      text: "CLOSE", 
      className: 'close-button-class', 
      click: function() { 
       // do what ever you want on the close event 
       $(this).dialog("close"); 
       location.reload(); 
      } 
     } 
    ], 
    open: function() { 
    //do whatever you want on the open event. 
    $("#my-form-div").html("<%= escape_javascript(render('form_view')) %>"); 
    } 
}); 

请有关更清楚你要。

+0

如果我不明确,我表示歉意。模态窗口以局部视图打开,并显示一个输入字段,该字段需要用户编号。点击该模式窗口中的按钮,使用Ajax调用在Db中检查该数字。如果他们失败,我提醒然后关闭模态窗口。模式窗口将数字和按钮名称发送到查询字符串中的父级。我想阻止数据从父母的地址得到解决。 – Techmaniac 2013-03-12 04:15:43

+0

你可以发布代码吗? – beck03076 2013-03-12 07:03:08

0

Ahhhhhh找到了。我需要在表单上放置一个POST方法来防止它被拖欠。我猜即使我刚刚关闭了对话框,表单也将自己提交为默认的GET。