按钮点击从javascript发送数据到数据库

时间:2012-11-06 10:42:24

标签: php jquery database web-site-project

所以我有一个php页面从数据库中获取数据并显示一个表格。每个td象征着电影院的座位。我想要做的是当用户点击一个或多个tds,并点击发送时,数据库中每个td的状态列从0变为1(默认值)。下次访问数据库时,状态为1的td具有不同的颜色。 我的代码到目前为止:

    <div id="screen">SCREEN</div>
<div id="Seatings">
    <?php echo "<table border='1'>
        <tr>
        <th>Seating</th>
        </tr>";
        $count=0;
    echo "<tr>";
    echo"<td id='Seat_rn'>A</td>";
    while($row = mysql_fetch_array($sql))
    {

        if($count<10){
        echo "<td id='Seat_A' class='count'>" . $row['Seat'] . "</td>";  
        }
    $count++;
    }   
    echo "</tr>";
   $sql=mysql_query("SELECT * FROM Seating_para_20 Where Seat > '10'");
   echo "<tr>";
   echo"<td id='Seat_rn'>B</td>";
   while($row = mysql_fetch_array($sql))
   {
      if($count>=10){
       echo "<td id='Seat_B' class='count'>" . $row['Seat'] . "</td>";  
      }
   $count++;
   }
   echo"</tr>";
   echo "</table>";
   ?>
</div>
<input type="button" value="Done" name="done" onclick="window.close()"> 

我的jquery代码是:

        $("td #Seat_A").click(function(){
    $(this).css("background", "red");
        });
        $("td #Seat_B").click(function(){
    $(this).css("background", "red");
        });
        $(document."done").click(function(){
    alert(price:750 Baht);
        }) 

我无法接近我想要的东西,如果我的任何代码都是“amatuer-ish”,我很抱歉,但我是新手,我一直在努力。非常感谢我能得到的任何帮助。

5 个答案:

答案 0 :(得分:3)

首先,您必须为表格中的每个TD添加ID,例如Seat ID,例如:

echo "<td id='Seat_A' data-seat='". $row['id'] ."'class='count'>" . $row['Seat'] . "</td>";

然后使用Ajax将此ID发送到您的PHP脚本:

$("td #Seat_A").click(function(){
    var seat_number = $(this).data("seat");

    $.ajax({
        type: 'POST',
        url: "/take_a_seat.php",
        data: 'seat_number='+seat_number,
        success: function(data){
            $(this).css("background", "red");
        }
        dataType: "json"
    });
});

在PHP脚本中,您必须使用此ID执行您想要的座位,并返回truefalse作为结果。假设您的数据库表中有一个名为reserved的字段。例如,您可以获取唯一ID并将该行更新为reserved = 1

答案 1 :(得分:2)

试试这个易于使用的ajax脚本来完成你的任务

功能:您可以在beforeSend部分向db发送数据之前显示gif img从success部分的php文件获取响应
在db中的数据插入后隐藏img在complete部分,显示成功或不成功msg

var myVar = 'your desire data you want to send to db';
$.ajax({           
            type: "POST",  
            url:"scripts/dummy.php",  
            data:"myVar="+myVar,

            beforeSend: function()
            {                   

            },
            success: function(resp)
            {               

            }, 

            complete: function()
            {

            },

            error: function(e)
            {  
            alert('Error: ' + e);  
            }  

    }); //end Ajax

答案 2 :(得分:1)

Javascript是客户端。您的数据库是服务器端..因此您必须使用php来更改数据库条目。

答案 3 :(得分:1)

简而言之,如果你想在不重新加载页面的情况下执行PHP东西,那么就要使用AJAX。您可以使用它with your favorite JQuery

答案 4 :(得分:0)

这是一个概述。对于现有记录,你应该做这样的事情

  <?php
  $count=1;
  $res = mysql_query("SELECT * FROM Seating_para_20 Where Seat > '10'");
  while($row = mysql_fetch_array($sql)) {

    if($row['status']==1) {
      $tdcolor = 'red';
    } else {
       $tdcolor = 'blue';

    }
    ?>

    <td id="td-<?php echo $count;?>" sytle="background-color:<?php echo $tdcolor; ?>" onclick="reserveseat(<?php echo $count; ?>);" >
    <?php
    $count++;
  }
  ?>

要更改页面加载后,您将执行ajax操作

 <script type="text/javascript" language="javascript">
 function reserveseat(count) {
   $.ajax({
    type: 'POST',
    url: "bookseat.php",
    data: '',
    success: function(data){
        $("#td-"+count).css("background-color", "red");
    }

   });
 }

 </script>

bookseat.php中,您将更改状态... :-)从here了解ajax。 : - )