doulun1939 2014-10-27 00:48
浏览 31
已采纳

Php表中的Javascript倒计时显示[关闭]

I have a db table with several fields and i want to make a countdown with the integer value of one of the fields (as minutes). How can i loop and display the countdown of each of those rows in a php table using these values and adding or subtracting time in the process if I need to?

Table.php

            $sql="SELECT * FROM List where depName='Admisiones' and  personStatus='Espera'";
            $result=mysqli_query($con, $sql);

            echo "<table border='15' cellpadding='10' cellspacing='3' bordercolor='00FF00'>
            <tr>
            <th>Turno</th>
            <th>Nombre</th>
            <th>Apellido</th>
            <th>Segundo Apellido</th>
            <th>Id Studiante</th>
            <th>Status</th>
            <th>Multiples Motivos</th>
            <th>Tiempo Categoria</th>
            <th>Tiempo Estimando</th>
            </tr>";

            while($row = mysqli_fetch_array($result)) 
            {
                echo "<tr>";
                echo "<td>" . $row['listNum'] . "</td>";
                echo "<td>" . $row['personName'] . "</td>";
                echo "<td>" . $row['personLast'] . "</td>";
                echo "<td>" . $row['secondLast'] . "</td>";
                echo "<td>" . $row['stuId'] . "</td>";
                echo "<td>" . $row['personStatus'] . "</td>";
                echo "<td>" . $row['manyMotive'] . "</td>";
                echo "<td>" . $row['categoryTime'] . "</td>";                                   
                echo "<td>" . $row['estimatedTime']"</td>"; //USE THE CLOCK.PHP TO MAKE A COUNTDOWN FOR EACH ESTIMATED TIME.
                //And have the ability to add or substrac time if needed.
                echo "</tr>";
            }

            echo "</table>";

Clock.php

      <script>
      $('.countdown').each(function(){
      var minutes = $(this).data('minutes');
      var count  = $(this); //countdown
      var id = $(this).id;
      $(this).countdown({
      date     :  Date.now() + (minutes * 60000),
      refresh  :  1000
      });

      setInterval(function(count)
      var minuteValue = count.text();
       $.ajax({
           url     : 'TEST.php', //I created to make the test..
           type    : 'POST',
           data    : {currentMin : minuteValue, id:id},
           success : function(response){
               console.log(response);
           }

          });
       });
    });

TEST.php

    <?php

    include 'Connection.php';
        $minValue =  mysqli_real_escape_string($con,  $_POST['minuteValue']);
        $ID = mysqli_real_escape_string($con,  $_POST['id']);

        if (!$con) {
            die("Connection failed: " . mysqli_connect_error());
        }

        $sql ="Update List SET estimatedTime='$minValue' WHERE listNum='$ID'";
        mysqli_query($con,$sql);
        mysqli_close($con);
    ?>
  • 写回答

1条回答 默认 最新

  • doujia1988 2014-10-27 03:55
    关注

    OK, here's how I would do it. I would delete clock.php and use something more sophisticated. For example this js plugin:

    http://rendro.github.io/countdown/

    Download the file and include it in your <head> tag. Make sure you include jquery before that.

    Inside your table.php change this line:

    echo "<td>" . $row['estimatedTime']"</td>";

    to:

    echo "<td><div class=\'countdown\' data-minutes=\'{$row['categoryTime']}\' id=\{$row['id']'\'></div></td>";

    Basically your html for that countdown field has to look like this (PS:30 is dynamic number coming from 'categoryTime') :

    <td><div class="countdown" data-minutes="30" id="16"></div></td>

    In footer of that page or in your javascript file include this script:

    <script>
   $('.countdown').each(function(){
      var minutes = $(this).data('minutes');
      var id = $(this).id;
      $(this).countdown({
         date     :  Date.now() + (minutes * 60000),
         refresh  :  60000
      });

      var minuteValue = $(this).text();
      setInterval(function(){

           $.ajax({
               url     : 'url/to/php/file', //php file that updates your DB. Take the values from POST VAR.
               type    : 'POST',
               data    : {currentMin : minuteValue, id:id},
               success : function(response){
                   console.log(response);
               }

           });
      });
   });



</script>

    With this, you will loop thru each .countdown element, get its minutes from data-minutes attr, and tell the countdown plugin when timer should expire by adding those minutes to Date.now() value.

    EDIT after your comment:

    What you are looking for is node.js. That would be perfect for you. But I've updated the code anyways. It is not tested so I don't know if that's gonna work. It should be something like that. The only issue could (MAYBE) be in setting interval for each row in your table.

    EDIT2

    • in php file, run query that updates rows in db
    • depending on your DB, see if you can get number of rows affected
    • if affected rows > 0, echo 1, otherwise echo 0
    • in Firebug (or similar) check the console message to see output of your php or any other errors

    This might help you find where the problem lies

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题？

悬赏问题

  • ¥15 交替优化波束形成和ris反射角使保密速率最大化
  • ¥15 树莓派与pix飞控通信
  • ¥15 自动转发微信群信息到另外一个微信群
  • ¥15 outlook无法配置成功
  • ¥30 这是哪个作者做的宝宝起名网站
  • ¥60 版本过低apk如何修改可以兼容新的安卓系统
  • ¥25 由IPR导致的DRIVER_POWER_STATE_FAILURE蓝屏
  • ¥50 有数据，怎么建立模型求影响全要素生产率的因素
  • ¥50 有数据，怎么用matlab求全要素生产率
  • ¥15 TI的insta-spin例程