Php 执行jquery.ajax成功后提交返回新表单_Php_Jquery_Ajax

Php 执行jquery.ajax成功后提交返回新表单

php jquery ajax

Php 执行jquery.ajax成功后提交返回新表单,php,jquery,ajax,Php,Jquery,Ajax,我相信我的问题与以下事实有关：我的第一个表单在DOM执行后通过ajaxsuccess.html（result）返回一个新表单。DOM中的jquery无法识别，因为元素在提交第一个表单之后才可见。如何获取我的$（“#fullFormMA”）。在（submit）（函数（e）{执行时，我一直在想。这是我的html <?php session_start(); require_once('functions.php'); include('header.htm');?> <title

我相信我的问题与以下事实有关：我的第一个表单在DOM执行后通过ajaxsuccess.html（result）返回一个新表单。DOM中的jquery无法识别，因为元素在提交第一个表单之后才可见。如何获取我的$（“#fullFormMA”）。在（submit）（函数（e）{执行时，我一直在想。这是我的html

<?php 
session_start();
require_once('functions.php');
include('header.htm');?>
<title>Membership Application</title>
<meta name="description" content="">
</head> 
<body> 
<div id="container">
    <div id="loginBanner">
        <?php include ("loginMenu.php"); ?>
        <?php include ("bannerIcons.php"); ?>
    </div> <!--end loginBanner-->
    <div id="header" class="clear">
        </div> <!--end header-->
    <div id="content"><div class="content">
        <div id="colLt">
            <?php include('tabContent.php');?>
            <?php include('leftSidebar.php');?>
        </div>
        <div id="colRt"><div class="content">
        <h1>New Member Application</h1>
        <ul><li>submitting an application</li><li>submitting payment</li></ul><h6>Step #1&mdash;the application</h6>Please enter an email which will ultimately be used as your website username.  This email will remain as your private email.</p><br><br>
        <form method="post" name="checkUserMA" id="checkUserMA">
            <label class="clear" style="width:120px">Username/Email<br><span class="small"></span></label>
            <input type="text" name="usernameMA" id="usernameMA" class="green" style="width:300px;"/><br><br>
            <input type="submit" id="checkUserMA" class="submit" value="Submit" />
        </form>
        <div class="clear"></div>
        <div id="errorMA" style="background:yellow;width:200px;height:100px"></div>
        <div id="resultMA"></div>       
    </div></div>
    <div class="clear"></div>
    </div></div><!--end content-->  
<div id="footer">
<?php include("footer.htm") ?>
<!--<?php include("disclaimer.htm") ?>-->
</div><!--end footer-->
<div class="clear"></div>
</div><!--end container-->
<div class="clear"></div>
</body> 
</html>

这里是checkMA.php

<?php
session_start();
include('functions.php');
connect();
$username = urldecode(protect($_POST['usernameMA']));
$_SESSION['guestUser'] = $username;
$sql2 = mysql_query("SELECT username FROM members WHERE username = '$username'");
$checkNumRows = mysql_num_rows($sql2);
if (!$username){
    echo "<p class='red'>Enter an email to be used as your username...</p>";
} else if ($checkNumRows == 1){
    echo "<span style='font-weight:bold'>The username: ".$username." is already in use.</span>";    
} else if ($checkNumRows == 0){
    echo "<hr><p class='green'>This username is available.</p><p>Please continue with the registration process...</p><br>";?>
    <form method="post" name="fullFormMA" action="memberAppProcess.php">
        <h6>Public Information - this information will be displayed to website visitors</h6>
        <label class="clear" style="width:75px">Name</label>
        <label class="error" id="name_error">This field is required.</label>
        <input type="text" name="firstName" id="firstName" class="left inputCheck" style="width:150px" placeholder="first name"/>
        <input type="text" name="lastName" id="lastName" class="inputCheck" style="margin-left:10px" placeholder="last name"/><br><br>
        <input type="submit" name="fullFormMA" id="fullFormMA" class='submit right' onClick='submitFullForm();' value="Submit application">
        </form> 
    <?php
}?>

它正在执行，您只是没有等待足够长的时间让它存在。将新表单添加到文档后，立即将新表单的事件绑定移动到行中
$("#resultMA").html(result).fadeIn();
$("#fullFormMA").on(submit,(function(e){...

DOM在ajax成功之前就准备好了，因此您可以编写这个JQuery完整代码
   $(document).ready(function() {
   $('#resultMA').hide();
   $('#errorMA').hide();
   $("#checkUserMA").submit(function(event){
event.preventDefault();
$("#resultMA").html('');
var values = $(this).serialize();
$.ajax({
    url: "checkMA.php",
    type: "post",
    data: values,
    success: function(result){
        $("#resultMA").html(result).fadeIn();
        $('.error').hide();
        RunAfterAjax();
       },
    error:function(){
       // alert("failure");
        $("#resultMA").html('There was an error.  Please try again.').fadeIn();
    }
});//end ajax
});
 function RunAfterAjax(){


 $("#fullFormMA").on(submit,(function(e){
e.preventDefault();
$("#errorMA").html('');
var values = $(this).serialize();
$.ajax({
    url: "validMA.php",
    type: "post",
    data: values,
    success: function(result){
    },
    error:function(){
    // alert("failure");
        $("#errorMA").html('There was an error.  Please try again.').fadeIn();
    }
});//end ajax
});
}
});//end dom

fullFormMA
是一个
，您应该绑定单击而不是submit
，并在事件名称周围使用引号
在（'event'，…）
上使用$（'something'）。时，仅当#something
元素已存在时，它才起作用
您可以通过将侦听器委托给更高的现有元素来修复代码：
$('#content').on('click', '#fullFormMA', function() { /* ... */ });

如果在ajax响应后添加，此代码将在#fullFormMA
事件上检测单击事件。
您使用单独函数的方法有效，但我必须绑定单击，而不是像下面提到的那样提交。提交没有“阻止默认”和我的表单操作（php备份方法）不断发生。有没有想过为什么会发生这种情况？在AJAX成功（验证表单字段）后，我还尝试重定向到另一个URL。我将window.location.href=”http://www.website.com/memberAppPay.php?reason=success"；
但这不起作用。我将回答你的第二个问题。因此，要使用JavaScript重定向，请编写window.location="http://www.website.cominstead抱歉…我不清楚。我不确定将此代码放置在何处。我将其作为validMA.php文件中的最后一行代码放置。这会导致我的URL尝试加载到我的#errorMA div中。我理解为什么会这样做，因为我正在将validMA.php结果定向到此div。我已尝试放置重定向代码e在其他地方，但没有运气。我希望它只有在用户成功填写所有必填字段后才能重定向。您的函数调用是让我通过此过程的验证阶段的答案。要完成此过程，我需要将用户发送到我的支付页面。请听@Leslie，而不是编写解释，您可以将新代码附加到您的帐户你的问题
$("#fullFormMA").on(submit,(function(e){ /* ... */ });

$('#content').on('click', '#fullFormMA', function() { /* ... */ });