отправлять данные по нажатию кнопки из javascript в базу данных

Итак, у меня есть php-страница, которая получает данные из базы данных и отображает таблицу. Каждый td символизирует место в кинотеатре. Что я хочу сделать, так это когда пользователь нажимает на один или несколько td и нажимает «Отправить», столбец состояния для каждого td в базе данных изменяется на 1 с 0 (по умолчанию). При следующем доступе к базе данных td со статусом = 1 будут иметь другой цвет. Мой код до сих пор:

    <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);
        })

Я далеко не то, что хочу, и мне жаль, если какой-либо из моих кодов «любительский», но я новичок в этом, и я очень старался. Был бы признателен за любую помощь, которую я могу получить.


php database jquery web-site-project
person nupac    schedule 06.11.2012    source источник
comment
Для таких вещей лучше использовать ajax. Пользователя будет раздражать, если он захочет нажать на 10 мест и должен отправить страницу 10 раз.   -  person enenen    schedule 06.11.2012
comment
почему вы зацикливаетесь два раза? где запрос первого цикла?   -  person Awais Qarni    schedule 06.11.2012
comment
jQuery+Ajax упростит ваш процесс   -  person asprin    schedule 06.11.2012

Ответы (5)


arrow_upward
3
arrow_downward

Прежде всего, вы должны добавить идентификатор к каждому TD в вашей таблице, т.е. Seat ID, например:

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

Затем отправьте этот идентификатор в свой PHP-скрипт с помощью Ajax:

$("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 вы должны делать то, что хотите, с местом с этим идентификатором и возвращать в результате true или false. Предположим, у вас есть поле с именем reserved в таблице базы данных. Вы можете получить уникальный идентификатор и обновить эту строку, например, до reserved = 1.

person enenen    schedule 06.11.2012
comment
Большое спасибо, мне потребовалось время, чтобы понять код, но позже лучше, чем никогда, верно? Большое спасибо еще раз. - person nupac; 07.11.2012

arrow_upward
2
arrow_downward

Попробуйте этот простой в использовании скрипт ajax для выполнения вашей задачи

Возможности: вы можете показать GIF-изображение перед отправкой данных в БД в разделе beforeSend
получить ответ от php-файла в разделе success
скрыть img после вставки данных в БД в разделе complete и показать успешное или неудачное сообщение

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
person Sohail Ahmed    schedule 06.11.2012

arrow_upward
1
arrow_downward

Javascript на стороне клиента. Ваша база данных находится на стороне сервера. Поэтому вам нужно использовать php для изменения записей в базе данных.

person Sentencio    schedule 06.11.2012

arrow_upward
1
arrow_downward

Короче говоря, если вы хотите выполнять вещи PHP без перезагрузки страницы, используйте AJAX. Вы можете использовать его с вашим любимым JQuery.

person F0G    schedule 06.11.2012

arrow_upward
0
arrow_downward

Это обзор. Для существующих записей вы должны что-то вроде этого

  <?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 вы измените статус... :-) Подробнее об ajax можно прочитать здесь. :-)

person Awais Qarni    schedule 06.11.2012
comment
Большое вам спасибо за вашу помощь. Я использовал комбинацию вашего и метода, описанного выше. Большое спасибо еще раз - person nupac; 07.11.2012