1

我已经通过 StackOverFlow 进行了搜索，但没有找到我想要的内容，所以我发布了我想问你的内容。

我是 PHP 世界的新人，我是如何开始编写脚本的或管理页面。我已经完成了所有工作，但我喜欢知道如何使用 AJAX 来显示消息，而无需转到特定的处理页面。

进程页面，

<?php


include ('connect.php');

$data = ("SELECT * FROM poiinfo");

$poiName = $_REQUEST['Name'];
$poiDes = $_REQUEST['Descrip'];
$poiCon = $_REQUEST['ConInfo'];
/*$poiImg = $_REQUEST['Image']; */

$dbData = "INSERT INTO poiinfo(`Name`, `Des.`, `Contact`) VALUES ('$poiName','$poiDes','$poiCon')";

$putData = mysql_query($dbData);

if ($putData){
echo "Data inserted";
}else {
echo "Not Done";
}
?>

我可以知道如何使用 AJAX 来获取消息吗？

我已经使用了你们给我的代码示例，但我仍然没有完成工作，请你帮我找出我做错了什么。

我的表格，

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>

<script type="text/javascript">
$(document).ready(function(){
$("#save_data").click(function(){
var name  = document.getElementById("Name");
var desc = document.getElementById("Descrip");
var con = document.getElementById("ConInfo");

var dataString = 'Name='+name'&Descrip='+desc'&ConInfo='con;
$.ajax({
  type:'POST',
  data:dataString,
  url:'addpoipro.php',
  success:function(data){
   if(data="Data inserted") {
      alert("Insertion Success");
    } else {
      alert("Not Inserted"); 
    }
    } 
   });
   });
   });
   </script>

   <title>AddPOI</title>
   </head>

   <body>
   <form method="post" enctype="multipart/form-data" name="form1" id="form1">
   <p>
   <label for="poiid">ID :</label>
   <input type="text" name="poiid" id="poiid" readonly="readonly" style="width:70px;" value="<?php echo $tId; ?>" />
   </p>
   <p>
   <label for="Name">POI Name :</label>

   <input type="text" name="Name" id="Name" />
   </p>
   <p>
   <label for="Descrip" style="alignment-adjust:middle">POI Description :</label>
   <textarea name="Descrip" id="Descrip" cols="45" rows="5"></textarea>
   </p>
   <p>
   <label for="ConInfo">Contact Infomation :</label>
   <textarea name="ConInfo" id="ConInfo" cols="45" rows="5"></textarea>
   </p>
   <p>
   <label for="Img">POI Image :</label>
   <!--<input type="file" name="Image" id="Image" /> -->
   </p>
   <p>&nbsp;</p>
   <p>
   <div align="center">
   <input type="button" name="Submit" id="save_data" value="Submit" style="width:100px;" />
   <input type="reset" name="reset" id="reset" value="Rest Data" style="width:100px;" />
   </div>
   </p>
   </form>
   </body>
   </html>

以上4是我的表格，而process.php在此之前请帮助我，谢谢。

4

3 回答 3

2

使用 jQuery 的示例$.ajax：

$.ajax({
  url: "process.php",
  type: "POST",
  data : { Name : 'John', Descrip : 'some description..', ConInfo : 'some info...' },
  success : function(data){
      if(data == "Data inserted")
      {
          console.log("Success!");
      }
      else
      {
          console.log("fail!");
      }
  }
});
于 2013-01-15T12:21:06.227 回答
1

你也可以这样做。

你的 HTML

<label>Name</labe><input type="text" id="name" name="full_name" value="" />
<label>Address</labe><input type="text" id="addr" name="addr" value="" />
<input type="button" name="save" id="save_data" value="Save" />

在添加 jQuery 后的 head 部分做这样的事情

<script>
 $(document).ready(function(){
  $("#save_data").click(function(){
    var name  = $("#name").val();
    var addr = $("#addr").val();

    var dataString = 'name='+name'&address='+address;
    $.ajax({
      type:'POST',
      data:dataString,
      url:'process.php',
      success:function(data){
       if(data="inserted") {
          alert("Insertion Success");
        } else {
          alert("Not Inserted"); 
        }
     } 
   });
  });
});
</script>

“process.php 页面”

$name = $_POST['name'];
$address = $_POST['address'];

// DO YOUR INSERT QUERY
$insert_query = mysql_query("INSERT QUERY GOES HERE");
if(// CHECK FOR AFFECTED ROWS) {
     echo "inserted";
} else {
     echo "not";
}
于 2013-01-15T12:59:51.860 回答
1

这是另一个不使用 jquery 的解决方案。

索引.html

<head>
<script type="text/javascript" src="test.js"></script>

</head>
<body>
<!-- reply from process.php is shown in this div -->
<div id=message></div>
<!-- click to send data -->
<a href="#" onclick="sendData('John','student','no more info')"> click here </a> 
</body>
</html>

测试.js

function sendData(Name,description,info) {
        var ajaxRequest;  // The variable that makes Ajax possible!

        try{
            // Opera 8.0+, Firefox, Safari
            ajaxRequest = new XMLHttpRequest();
            }
        catch (e)
            {
            // Internet Explorer Browsers
                try
                    {
                    ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
                    }
                catch (e)
                    {
                        try
                            {
                            ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
                            }
                        catch (e)
                            {
                            // Something went wrong
                            alert("Your browser broke!");
                            return false;
                            }
                    }
            }
        // Create a function that will receive data sent from the server

        ajaxRequest.onreadystatechange = function()
            {
                    var ajaxDisplay = document.getElementById('message');
            if(ajaxRequest.readyState == 4)
                { ajaxDisplay.innerHTML = ajaxRequest.responseText;}
                    else { document.getElementById('message').innerHTML="<span style=\"color:green;\">Loading..</span>"; }
                     }
        var url="process.php?name="+Name+"&Descrip="+description+"&ConInfo="+info;
        ajaxRequest.open("POST", url, true);
        ajaxRequest.send(null);
        }
于 2013-01-15T12:38:34.233 回答