Question

我在HTML页面上有一个文本字段和一个按钮。还有一个para标签，它将在验证时显示错误。

如果该字段为空，则会更改为 Name must be filled out

它正在改变验证。

现在，当我输入一个字符串并按下提交按钮....该值应传递给PHP页面并检查条件并在HTML页面上相应地打印消息...但是当我单击提交消息时打印在index.php页面上。

我应该如何使用AJAX代码，以便在para标签上打印id错误？

请帮助。提前谢谢。

HTML CODE

<html>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js">    </script>
    <script type="text/javascript" src="java123.js"></script>
  </head>
  <body>
    <form action="index.php" method="post" onsubmit="return validateForm()">
      <input type="text" name="name" id="name">
      <input type="submit">
    </form> 
    <p id="error"></p>
  </body>
</html>

PHP代码

   <?php
   $name = $_POST['name'];
   if($name == "thistext"){
       $arr = array("sth"=>"hello");
       echo json_encode($arr);
   }else{
       $arr = array("sth"=>"User does not exist");
       echo json_encode($arr);
   }
   ?>

JAVASCRIPT CODE

var invalid = 0;

function validateForm() {

/* WHERE SHOULD I PUT THIS CODE
    $.ajax({
      url: "index.php",
      type: "POST",
      dataType: "json",
      success: function(response) {
         $("#error").html(response.sth);
      }
    });

 */

    invalid = 0;

    name = document.getElementById("name").value;
    if(name == ""){
      document.getElementById('error').innerHTML = "Name must be filled out";
      invalid = 1;
    }else{
      document.getElementById('error').innerHTML = "";
    }

    if(invalid != 0){
      return false;
    }else{
      return true;
    }
 }

Answer 1

 function validateForm() {

    invalid = 0;

    name = document.getElementById("name").value;

    if(name == ""){
        document.getElementById('error').innerHTML = "Name must be filled out";
        invalid = 1;
    }else{
        document.getElementById('error').innerHTML = "";
    }

    if(invalid != 0){
    $.ajax({
    url: "index.php",
    type: "POST",
    dataType: "json",
    success: function(response) {
        $("#error").html(response.sth);
    },
error: function(data){
            console.log("error");
            console.log(data);
        }
    });
    }
    }

Answer 2

试试这个

login : function (username, password) {
  var url = someUrl
    + '?callback=JSON_CALLBACK&user=' + username
    + '&pass=' + password;

  return $http.post(url);
},

如何在HTML页面上显示PHP的响应？

2 个答案: