Cargar archivo php con ajax
Frecuentes
Visto 4,897 equipos
-1
Im using ajax to load the testNew.php file into the Cart.html file. It loads the testNew.php file but when i click on the button add which is in the testNew.php, 0 is being entered in the database and as soon as i click on the add button the page refresh by itself. My problem is that i dont want the page to refresh and want the add button to do the same action as in the testNew.php file(which works correctly).
<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>
Here is the testNew.php which works correctly.
<?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 Respuestas
1
Your error in thought is actually that you are including a form through AJAX of which the HTML is then loaded into your page after which the action
attribute on the form refers to the page itself (loading HTML into your page with AJAX does not work the same as an iframe) which does not have the relevant code to actually parse and insert the database.
You need to make a separate page that only accepts a few parameters and inserts those into the database. However, before you do that you need to read this:
I'm going to go off on the safety of your code for a tad.
$_REQUEST
se refiere a ambos $_GET
e $_POST
, you really want only $_POST
as you just want to deal with what gets submitted through a form.
You never sanitize your input, this way a person could craft an URL with say phpNew.php?id='; DROP TABLE wooptiedoo
. This is a simplified example but nevertheless you should take a closer look at the mysql_real_escape_string
documentation and possibly some guides on "sql injection".
After that those same variables can be used for XSS which means someone can use your page to serve random HTML to people visiting that site and trusting your domain. I suggest you look up the htmlentities
function and/or read up on "cross-site scripting" attacks.
And to end it all, the mysql_*
functions are deprecated and you should probably be using mysqli_*
funciones.
contestado el 22 de mayo de 14 a las 13:05
No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas javascript php jquery ajax or haz tu propia pregunta.
remove the first jqeury library. There is no need to add two libraries. - Jai
Submitting a FORM refresh/redirect the page, you need to prevent this default behaviour. BTW, i don't see any add() method - A. Wolff
The page is refreshing because the
form
is submitting aPOST
request at the page level. If you want to use AJAX then you need to write a handler for the form which prevents the submit. Presumably youradd
function should do that, but you haven't shown us that function. As for adding a 0 to the database, we can't possibly know what's causing that with the code here. What are you inserting into the database? What value is being provided for that from the form post? - David