0

这里有fregister和register两种形式。在第一种形式中,我输入名称、用户名并通过单击检查用户 ID 按钮检查用户名的可用性。如果用户名不可用,我将在 php 的帮助下显示消息,并希望通过字段向用户显示此消息他之前填的。

<?php RegFormCrAndValid($name,$username,$email) {?>
    <form name="fregister"  method="post">
        <table>
        <tr><td>Name</td>
        <td><input type="text" id="name" name="name" value ="<?php echo $name;?>" onChange="ValidAllAlpha()" required></td>
        <td><span id="ErrorName"></span></td></tr>
        <tr><td>Username</td>
        <td><input type="text" id="user" name="UsrText" value="<?php echo $user;?>" required onblur="SetNextElement()"></td>
        <td><?php  echo $_SESSION['ErrorUserMsg']?></td> <td><input type="submit" name="CheckUsr" value="Check User ID"></td> </tr> </form>

在第二种形式中,用户将首先在此处注册检查可用性,然后通过单击注册进行提交。在此形式中,如果用户还没有成功注册,那么我想显示带有填充字段的消息。

<form name="register" method="post">
    <td style="display:none"><input type="text" id="fname" name="fname" required></td>
    <td style="display:none"><input type="text" id="fuser" name="fuser" required></td>
    <tr><td>Email</td>
    <td><input type="email" id="email" name="email" value="<?php echo $email;?>" onChange="ValidateEmail()" required></td>
    <td><span id="ErrorEmail"></span></td></tr>
    <tr><td><input type="submit" name="submitForm" value="Submit" onClick="ValidationCheckOnSubmit('register');return false;"></td></tr>
    </form>
</body>
</html>

这里没有显示两行,因为它们在 javascript 的帮助下从表单 fregister 中获取 name 和 username 的值,然后显示它们。

JavaScript 代码 // 验证在那里,这里我提到了将值传递给 fname 和 fuser 的代码

 function SetNextElement()
                {           
                         document.getElementById('fname').value = document.getElementById('name').value;

                document.getElementById('fuser').value = document.getElementById('user').value;
                }
<?php }?> //RegFormCrAndValid($name,$username,$email) this function getting closed over here

php编码

if(isset($_POST['CheckUsr']))
    {
        if(IsUsernameAvail($_POST['UsrText'])) //IsUsernameAvai checking for the username availabilty return true if available as false
        {   
            $_SESSION['ErrorUserMsg']="<font color=red>This Username Is Available</font>";
        }
        else
        { 
            $_SESSION['ErrorUserMsg']="<font color=red><--Username is not available</font>";
        }

    }

    if(isset($_POST['submitForm']))
    {
        if(IsUsernameAvail($_POST['fuser']))
        {   
            echo 'You have been successfully registered'; 
        }
        else
        { 
            $_SESSION['ErrorUserMsg']="<font color=red><--Username is not available</font>";
            RegFormCrAndValid($_POST['fname'],$_POST['fuser'],$_POST['email']);
        //RegFormCrAndValid($name,$username,$email) is the function in which whole html and javascript code is there to create and validate the form.
        }

    }
    else{   if(isset($_POST['CheckUsr']))
            {

                RegFormCrAndValid($_GET['name'],$_POST['UsrText'],'');

            }
            else  RegFormCrAndValid('','','');

        }

我的问题

  1. 在单击 CheckUserId 按钮时,我希望页面仅停留在那里,为什么单击它后不会停留在同一页面上,并且所有字段都由用户填写。它应该只执行检查,为什么页面会重新加载?
  2. 如果我能够停留在同一页面上,那么我不需要再次调用 RegFormCrAndValid($name,$username,$email) 这个函数来重建我的表单,是否可以留在那里填充填充而不调用函数。
  3. 我想消除使用虚假列来再次显示用户名和姓名,因为在真实的注册表单中会有很多字段,我不能对所有这些字段进行虚假呼叫或分配。

我不想使用 ajax 或 jquery,想通过 javascript、php 和 html 来实现一切。

4

2 回答 2

1

当您单击<input type="submit" name="CheckUsr" value="Check User ID">正在提交的表单时,因为这就是单击提交按钮所做的事情,除非您有 javascript 来阻止它并执行其他操作。

当页面被提交回服务器时,页面将重新加载。

现在,回到您的基本目标:您必须了解您正在执行的确定用户名是否可用的实际检查是在服务器端,即逻辑驻留在服务器上。而用户输入用户名的表单位于客户端,即驻留在用户计算机上,通过浏览器显示。现在,一旦用户键入名称,您就需要以某种方式将该数据传递到服务器端,以便它进行检查并相应地执行操作。因此,您有两种选择:

a) 像现在一样提交表单,并使用服务器端 php 代码收集用户填写的所有数据并再次填充它们

b) 不要提交表单,只需向 php 脚本发出 ajax 请求,该脚本会将用户名作为输入并向您返回可以使用 javascript 捕获的 true 或 false 响应,并相应地允许提交表单或没有提交。

在这种情况下,在提交按钮 onclick 事件或表单 onsubmit 事件触发器上设置一个 javascript 函数来发出 ajax 请求,如果 ajax 请求返回 false,则“返回 false”,如果 ajax 请求返回 true,则“返回 true”。同样在“错误情况”中,您可以使用 getElementById 为用户设置错误消息。

于 2013-08-15T13:25:08.283 回答
0

(a) 的答案

您正在使用表单提交操作

表单提交的默认行为是重新加载页面。您必须通过使用来抑制表单提交的默认行为return false。但不推荐..您可以使用AJAX

示例代码

$('#yourFormId').submit(function () {
 //business logics here
 return false;//to avoid page reload
});

您不再需要提交按钮上的 onclick 事件:

<input class="submit" type="submit" value="Send" />
于 2013-08-15T13:15:25.020 回答