div中的JQuery表单没有刷新

时间:2012-05-22 10:28:23

标签: php jquery html

我有一些代码: 在index.html文件中,我有一个div

<div id="logindiv">
    <?php require_once('login.php'); ?>
</div>

与jquery一起使用

<script type="text/javascript">
  $(document).ready(function() {
    $.post('login.php', $('#login').serialize(), function (
      data, textStatus) {
        $('#login').html(data);
    });
    return false;
});
</script>

我想将登录表单放入div中,以便登录在div内部工作而不刷新页面。此外,还会在div id = login中自动显示重定向到其他文件(如you-are-logged-In.php)。

login.php是

<?PHP
    require_once("./include/membersite_config.php");
    if(isset($_POST['submitted'])) {
        if($fgmembersite->Login()) {
            $fgmembersite->RedirectToURL("login-home.php");
        }
    }
?>
<div id='fg_membersite'>
    <form id='login' accept-charset='UTF-8'>
        <fieldset>
            <legend>Login</legend>
            <input type='hidden' name='submitted' id='submitted' value='1'/>
            <div class='short_explanation'>* required fields</div>
            <div>
                <span class='error'>
                    <?php echo $fgmembersite->GetErrorMessage(); ?>
                </span>
            </div>
            <div class='container'>
                <label for='username' >UserName*:</label><br/>
                <input type='text' name='username' id='username' value='<?php echo $fgmembersite->SafeDisplay('username') ?>' maxlength="50" /><br/>
                <span id='login_username_errorloc' class='error'></span>
            </div>
            <div class='container'>
                <label for='password' >Password*:</label><br/>
                <input type='password' name='password' id='password' maxlength="50" /><br/>
                <span id='login_password_errorloc' class='error'></span>
            </div>
            <div class='container'>
                <input type='submit' name='Submit' value='Submit' onClick='loadLoginDiv();' />
            </div>
            <div class='short_explanation'>
                <a href='reset-pwd-req.php'>Forgot Password?</a>
            </div>
        </fieldset>
    </form>
    <!-- client-side Form Validations:
    Uses the excellent form validation 
    script from JavaScript-coder.com-->
    <script type='text/javascript'>
    // <![CDATA[
        var frmvalidator  = new Validator("login");
        frmvalidator.EnableOnPageErrorDisplay();
        frmvalidator.EnableMsgsTogether();
        frmvalidator.addValidation("username","req","Please provide your username");
        frmvalidator.addValidation("password","req","Please provide the password");
    // ]]>
    </script>
</div>

如何使用没有页面刷新的表单?它提交一次而不是多次而没有刷新。

1 个答案:

答案 0 :(得分:0)

您在页面加载时正在执行Ajax请求,这是不正确的。您必须用Ajax请求替换通常的提交。

<script type="text/javascript">
  $(document).ready(function() {
    $('#login').live('submit', function() {
        $.post('login.php', $(this).serialize(), function (
          data, textStatus) {
            $('#login_wrapper').html(data);
        });
        return false;
    });
   });
</script>