Php 如何使用AJAX（无jquery）获取表单的值？_Php_Javascript_Ajax_Html_Forms

Php 如何使用AJAX（无jquery）获取表单的值？

php javascript ajax html forms

Php 如何使用AJAX（无jquery）获取表单的值？,php,javascript,ajax,html,forms,Php,Javascript,Ajax,Html,Forms,我有一些表单，当我按下其中一个按钮时，我想进入javascript，这就是我按下的这个按钮的表单。或者使用var$\u POST在php代码中获取值的形式 <?php include ('conexion.php');?> <!DOCTYPE html PUBLIC "=//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <

我有一些表单，当我按下其中一个按钮时，我想进入javascript，这就是我按下的这个按钮的表单。或者使用var$\u POST在php代码中获取值的形式

<?php include ('conexion.php');?>

<!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/199/xhtml">

<head>
<meta hhtp-equiv="Content-Type" content="text/html; charset="utf-8" />
<title>Tienda</title>

<script>
function inicializar()
{
if (window.XMLHttpRequest){// code for IE7+, Firefox, Chrome, Opera, Safari
    return new XMLHttpRequest();
}
else{// code for IE6, IE5
    return new ActiveXObject("Microsoft.XMLHTTP");
}
}
function comprar()
{
var xmlhttp;
var fieldValue = document.comprar.elements[0].value;
xmlhttp=inicializar();

xmlhttp.onreadystatechange=function(){
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
  }
xmlhttp.open("POST","comprar.php",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("p="+fieldValue);
}
</script>

</head>

<body>

<div id="myDiv"><p>Carrito: 0 productos 0,00&#8364 </p></div>

<p>LISTADO DE PRODUCTOS</p>

<table width="200" border="0" id="myTable">
<tr>
    <td bgcolor="#D6D6D6">ID</td>
    <td bgcolor="#D6D6D6">IMAGEN</td>
    <td bgcolor="#D6D6D6">NOMBRE</td>
    <td bgcolor="#D6D6D6">DESCRIPCION</td>
    <td bgcolor="#D6D6D6">PRECIO</td>
    <td bgcolor="#D6D6D6">AGREGAR</td>
</tr>
<tbody>
<?php 

$consulta=mysql_query("select * from productos");

while($filas=mysql_fetch_array($consulta)){
    $id=$filas['id'];
    $imagen=$filas['imagen'];
    $nombre=$filas['nombre'];
    $descripcion=$filas['descripcion'];
    $precio=$filas['precio'];

?>

    <tr>
    <td><?php echo $id ?></td>
    <td><img src="<?php echo $imagen; ?>" width="70" height="70"></td>
    <td><?php echo $nombre ?></td>
    <td><?php echo $descripcion ?></td>
    <td><?php echo $precio ?></td>
    <td><form action ="javascript:comprar()" method="post" name="comprar">
        <input name="id_txt" type="hidden" value="'.$id.'" />
        <input name="nombre" type="hidden" value="'.$nombre.'" />
        <input name="precio" type="hidden" value="'.$descripcion.'" />
        <input name="cantidad" type="hidden" value=1 />
        <input type="submit" name="Comprar" value="Comprar" /></form></td>
    </tr>   

<?php } ?>
</tbody>    
</table>
</body>
</html>


您需要在表单中的这些变量上启用php
<form action ="javascript:comprar()" method="post" name="comprar">
        <input name="id_txt" type="hidden" value="<?php echo $id; ?>" />
        <input name="nombre" type="hidden" value="<?php echo $nombre; ?>" />
        <input name="precio" type="hidden" value="<?php echo $descripcion; ?>" />
        <input name="cantidad" type="hidden" value=1 />
        <input type="submit" name="Comprar" value="Comprar" />
</form>


将您的ajax更改为此，它将起作用，但您必须处理compar.php中的三个值
function comprar()
{
var id_txt = document.forms["comprar"]["id_txt"].value;
var nombre = document.forms["comprar"]["nombre"].value;
var precio = document.forms["comprar"]["precio"].value;


var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;


  }
xmlhttp.open("POST","comprar.php",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("id_txt=" + id_txt + "&nombre=" + nombre + "&precio=" + precio + "");
}

在compar.php页面中：
<?php 
$id_txt = $_POST['id_txt'];
$nombre = $_POST['nombre'];
$precio = $_POST['precio'];
?>

现在在compar.php中，您有了在nr_form变量中单击的表单的编号
<?php 
$nr_form = $_POST['nr_form'];
$id_txt = $_POST['id_txt'];
$nombre = $_POST['nombre'];
$precio = $_POST['precio'];
?>



 <input name="precio" type="hidden" value="<?php echo $descripcion;?>" />

<?php 

$consulta=mysql_query("select * from productos");

$i = 0;
while($filas=mysql_fetch_array($consulta)){
    $id=$filas['id'];
    $imagen=$filas['imagen'];
    $nombre=$filas['nombre'];
    $descripcion=$filas['descripcion'];
    $precio=$filas['precio'];

?>

    <tr>
    <td><?php echo $id ?></td>
    <td><img src="<?php echo $imagen; ?>" width="70" height="70"></td>
    <td><?php echo $nombre ?></td>
    <td><?php echo $descripcion ?></td>
    <td><?php echo $precio ?></td>
    <td><form action ="javascript:comprar(<?php echo $i; ?>)" method="post" name="comprar">
        <input name="id_txt" type="hidden" value="<?php echo $id;?>" />
        <input name="nombre" type="hidden" value="<?php echo $nombre;?>" />
        <input name="precio" type="hidden" value="<?php echo $descripcion;?>" />
        <input name="cantidad" type="hidden" value=1 />
        <input type="submit" name="Comprar" value="Comprar" /></form></td>
    </tr>   


<?php $i = $i + 1; } ?>

function comprar(nr_form)
{
var id_txt = document.forms["comprar"]["id_txt"].value;
var nombre = document.forms["comprar"]["nombre"].value;
var precio = document.forms["comprar"]["precio"].value;


var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;


  }
xmlhttp.open("POST","comprar.php",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("id_txt=" + id_txt + "&nombre=" + nombre + "&precio=" + precio + "&nr_form=" + nr_form +"");
}

<?php 
$nr_form = $_POST['nr_form'];
$id_txt = $_POST['id_txt'];
$nombre = $_POST['nombre'];
$precio = $_POST['precio'];
?>