从同一页面中的多个时钟采集器获取数据

时间:2018-01-13 21:33:33

标签: javascript php jquery clockpicker

我的php页面上有卡片。这些卡来自我的sql。该页面如下:

$getsql = "SELECT * FROM 2dopuzzler ORDER BY tableid";
$itsresult = $conn->query($getsql);

// Good one...
$current_cat = null;
while($row = $itsresult->fetch_assoc()) {   
    if ($row["tableid"] != $current_cat) {
        if ($current_cat) { // end previous card
            echo "</div></div></div></div>";
        }
        $current_cat = $row["tableid"]; // Table Number
        $timein = $row["timein"]; // Placing Order Time
        // PRINT THE ORDER CARD
        echo "<div class='col s12 m6 l3'>";
        echo "<div class='card'>";
        echo "<div class='card-content '>";
        echo "<div class='row'>";

        echo " <div class='clearfix'><div class='input-group clockpicker-with-callbacks'> 
             <input id='attime' type='text' class='form-control' value=".$row['attime'].">
             <span class='input-group-addon'><span class='glyphicon glyphicon-time'></span></span>
        </div>
        </div>";
        echo "<div class='col s12 m4 l4 card-wtime'> <i class='tiny material-icons'>add</i><span class='card-wtimetext'>$timein</span> </div>";
        echo "<div class='col s12 m4 l4'>   <a class='  card-nday waves-effect waves-light red'> <span class='card-ndaytext'>$current_cat</span> </a></div>";
        echo "<div class='col s12 m4 l4 card-alldone-btn'> <i class='medium material-icons'>check</i> </div>";
        echo "</div>";
        echo "<div class='row'>";
    } 
    echo "<div class='card-line'>";
    echo " -- ". $row["itemdesc"]." <span class='card-line-q'> ". $row["qty"] . "</span>";
    echo "</div>";
}
if ($current_cat) { // end last card
    echo "</div></div></div></div>";
}

我在一个php文件的顶部有clockpicker脚本:

<script type="text/javascript">
$('.clockpicker-with-callbacks').clockpicker({
        donetext: 'Done',
        afterDone: function() {
        var attime = $('#attime').val();
        var order_num = "<?php echo $order_number ?>";

        console.log(attime, order_num);
        $.post( "2_settime.php", { 
            attime: attime, order_num: order_num
        })

        }
    })
</script>

这两行有点正确: var attime = $('#attime').val(); var order_num = "<?php echo $order_number ?>";

我确实得到了attime,但它只是来自第一个时间选择器。 第二个没有返回任何东西,因为它是动态的。我从周期while获得$ order_number。

如何从多个clockpickers传递正确的变量到javascript?

1 个答案:

答案 0 :(得分:0)

我可以添加一个属性data-details,然后使用$()。attr('data-details')获取/传递该值,有很多方法可以解决此问题