使用ajax在同一页面中传递值

Question

我是ajax的新手。我的情况是，我想在同一页面上传递值，所以如果我点击选中值传递到上面

我的纯PHP代码就像这样

<?php include('connect.php');

$query="SELECT barang_id, nama, stok, AuUser,AuDate FROM barang";
$result=mysql_query($query);

$num=mysql_numrows($result);

mysql_close();
?>
<table border="1" cellspacing="2" cellpadding="2" >
<tr>
<td><font face="Arial, Helvetica, sans-serif">No.</font></td>
<td><font face="Arial, Helvetica, sans-serif">Barang ID</font></td>
<td><font face="Arial, Helvetica, sans-serif">Nama</font></td>
<td><font face="Arial, Helvetica, sans-serif">Stock</font></td>
<td><font face="Arial, Helvetica, sans-serif">AuUser</font></td>
<td><font face="Arial, Helvetica, sans-serif">AuDate</font></td>
<td><font face="Arial, Helvetica, sans-serif">Select</font></td>
</tr>

<?php
$i=0;$j=1;
while ($i < $num) {

$f1 = mysql_result($result,$i,"barang_id");
$f2 = mysql_result($result,$i,"nama");
$f3 = mysql_result($result,$i,"stok");
$f4 = mysql_result($result,$i,"auuser");
$f5 = mysql_result($result,$i,"audate");

?>

<tr>
<td><font face="Arial, Helvetica, sans-serif"><?php echo $j; ?></font></td>
<td><font face="Arial, Helvetica, sans-serif"><?php echo $f1; ?></font></td>
<td><font face="Arial, Helvetica, sans-serif"><?php echo $f2; ?></font></td>
<td><font face="Arial, Helvetica, sans-serif"><?php echo $f3; ?></font></td>
<td><font face="Arial, Helvetica, sans-serif"><?php echo $f4; ?></font></td>
<td><font face="Arial, Helvetica, sans-serif"><?php echo $f5; ?></font></td> 
<td><a href="data.php?id=<?php echo $f1;?>&nama=<?php echo $f2;?>&stok=<?php echo $f3;?>&auuser=<?php echo $f4;?>&audate=<?php echo $f5;?>">Selected</a></td>
</tr>

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

$id1 = ($_GET['id']) ;
$nama1 = ($_GET['nama']) ;
$stok1 = ($_GET['stok']);
$auuser1 = ($_GET['auuser']);
$audate1 = ($_GET['audate']) ;

?>
<div class="tengah">
    <form action="doupload.php" method="post">
        <div class="kiri">ID </div>
        <div class="kanan"><input type="text" name="id" id="id" value="<?php echo $id1;?>"/> </div>
        <div class="kiri">nama </div> 
        <div class="kanan"><input type="text" name="nama" id="nama" value="<?php echo $nama1;?>"/></div>
        <div class="kiri"> stock </div>
        <div class="kanan"><input type="text" name="stok" id="stok" value="<?php echo $stok1;?><?php echo $id1;?>"/></div>
        <div class="kiri">auuser </div>
        <div class="kanan"><input type="text" name="user" id="user" value="<?php echo $auuser1;?>"/></div>
        <div class="kiri">audate </div>
        <div class="kanan"><input type="text" name="date" id="date" value="<?php echo $audate1;?>"/></div>

        <div class="kiri"><input name="Submit" type="submit" value="submit" /></div>
        <div class="kanan"><input name="Reset" type="reset" value="cancel" /></div>
    </form>
    <div id="insert_response"></div>
</div>

这里的问题是我想使用ajax所以当我点击选中表时。 值无需加载即可传递到顶部。 感谢

Answer 1

您不需要使用AJAX，因为您不必从外部文件加载数据。您可以使用一些JavaScript来填充表单。有更有效的方法，然后下面的代码，但这是一个快速和肮脏的答案...

哦，我在jquery中使用javascript，因为它使事情变得更容易。但是在纯javascript中也可以这样做。

对于HTML / PHP代码，更改a标签以使用onclick而不是href，并调用javascript函数：

<a onclick="updateForm('<?php echo '$f1'?>','<?php echo '$f2'?>','<?php echo '$f3'?>','<?php echo '$f4'?>','<?php echo '$f5'?>');">Selected</a>

然后，在同一页面上创建一个javascript函数，如下所示：

<script>

function updateForm(id, nama, stok, user,date){
    $('#id').val(id);
    $('#nama').val(name);
    $('#stok').val(stok);
    $('#user').val(user);
    $('#date').val(date);
}

</script>

如果你不想使用jquery，我认为相当于$（'＃id'）。val（id）是document.getElementById（'id'）。value = id;