用ajax加载php文件

时间:2014-05-22 12:23:59

标签: javascript php jquery ajax

我使用ajax将testNew.php文件加载到Cart.html文件中。它加载testNew.php文件但是当我点击testNew.php中的按钮添加时,在数据库中输入0,并且一旦我点击添加按钮,页面就会自动刷新。我的问题是,我不希望页面刷新,并希望添加按钮执行与testNew.php文件(正常工作)相同的操作。

 <script type='text/javascript' src='http://code.jquery.com/jquery-1.6.2.js'>
 </script>
 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">    
    </script>
 <script>

  $(document).ready(function() {

   $("#product").click(function() {                

  $.ajax({    //create an ajax request to load_page.php
    type: "GET",
    url: "testNew.php",             
    dataType: "html",   //expect html to be returned                
    success: function(response){                    
        $("#responsecontainer").html(response); 
        //alert(response);
    }

   });
 });
 });

 </script>
 </head>
  <body>

    <table border="1">
     <tr>
   <td>
    <input type="button" id="product" name="product"value="View all products"/>
    </td>   
 </tr>
</table>        
 <div id="responsecontainer"></div>

这是testNew.php,它可以正常工作。

<?php
 include'connect.php';

  $image = isset($_REQUEST['image']) ? $_REQUEST['image'] : "";
  $id = isset($_REQUEST['id']) ? $_REQUEST['id'] : "";
  $name = isset($_REQUEST['name']) ? $_REQUEST['name'] : "";
  $price= isset($_REQUEST['price']) ? $_REQUEST['price'] : "";
  $sql="SELECT * FROM product";
   $result = mysql_query($sql);
  if($result>0){
  ?>
  <table border='1'>
<tr>
 <th>Id</th>
     <th>Image</th>
     <th>Name</th>
     <th>Price MUR</th>
    </tr>
     <?php

    while ($row = mysql_fetch_array($result)){

      ?>                  

    <tr>
        <td><?php echo ($row['id']); ?></td>
        <td><img src=<?php echo $row['image'] ?>  width='120' 
                   height='100'/></td>
        <td><?php echo htmlspecialchars($row['name']); ?></td>
        <td><?php echo htmlspecialchars($row['price']); ?></td>
           <td>
        <form method="POST" action="" >
            <input type="hidden" name="id" value="<?php echo $row['id']; ?>" />
            <input type="hidden" name="name" value="<?php echo $row['name']; ?>" />
            <input type="hidden" name="image" value="<?php echo $row['image']; ?>" />
            <input type="hidden" name="price" value="<?php echo $row['price']; ?>" />
            <input id="submit" type="submit" name="submit" value='Add to cart' 
            onclick="add()"/>
        </form>
         </td>
       </tr>
     <?php
      }
    ?>
    </table>
  <?php
}

$insert = "INSERT INTO product_add(id, name, price) VALUES ('$id',  '$name','$price')";
  $insertQuery=mysql_query($insert);

  ?>

1 个答案:

答案 0 :(得分:1)

您的想法中的错误实际上是您通过AJAX包含一个表单,然后将HTML加载到您的页面中,之后表单上的action属性引用页面本身(将HTML加载到您的页面中)使用AJAX与iframe不同,它没有相关代码来实际解析和插入数据库。

您需要创建一个单独的页面,只接受一些参数并将其插入数据库。但是,在你这样做之前,你需要阅读:

我会为你的代码安全起见。

$_REQUEST同时指代$_GET$_POST,您只想要$_POST,因为您只想处理通过表单提交的内容。

您永远不会清理您的输入,这样一个人就可以制作一个说phpNew.php?id='; DROP TABLE wooptiedoo的网址。这是一个简化的示例,但是您应该仔细查看mysql_real_escape_string文档以及可能的“sql注入”指南。

之后,这些相同的变量可以用于XSS,这意味着有人可以使用您的页面为访问该网站并信任您的域的人提供随机HTML。我建议你查看htmlentities函数和/或阅读“跨站点脚本”攻击。

要结束这一切,mysql_*函数已弃用,您可能应该使用mysqli_*函数。