使用Javascript将值插入到多个隐藏字段中，每个字段都以不同的形式 [英] Insert values into multiple hidden fields each in a different form using Javascript

问题描述

我有一个HTML表，其中包含从数据库中提取的记录。从MySQL数据库中检索调用时间列中的条目。 Timer列中的条目不是从数据库中检索的，而是一个Javascript计时器。

I have a HTML table which has records pulled in from the database. The entries from the Column "Time of Call" is retrieved from the MySQL Database. The entries in the column "Timer" is not retrieved from the database, it's a Javascript timer.

用户点击确认按钮后，计时器停止，计时器的最终值必须插入数据库。以下Javascript计时器是其他人代码的略微修改版本（数据库中给定时间的经过时间）

Once the user clicks on the Confirm Button, the timer Stops and the final value of the timer must be INSERTED into the database. The following Javascript timer is a slightly modified version of someone else's code (Elapsed time from a given time in the database)

问题：我不知道如何将经过的时间值插入隐藏表格字段。请注意，每个条目都有一个隐藏表单字段，ID id =stoppedtime<？php echo $ stopid;？> ，我知道我必须继续增加stopid变量的值。我需要将每个经过的时间（在按下确认按钮之后）插入到相应的隐藏表单字段中，以便稍后可以将这些隐藏表单字段中的值插入到数据库中。

Problem: I don't know how to insert the Elapsed time Value into the Hidden Form Fields. Please note that there is One Hidden form field for each entry with the ID id="stoppedtime<?php echo $stopid; ?> , I know I have to keep incrementing the value of the stopid variable. I need to insert every single elapsed time (after the confirm button is pressed) into the corresponding hidden form fields so that the value from these hidden form fields can later be INSERTED into the database.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
ElapsedTimeLogger = function(dateElementId, elapsedElementId, interval) {
    var container = $(elapsedElementId);
    var time = parseDate($(dateElementId).text());
    var interval = interval;
    var timer;

    function parseDate(dateString) {
        var date = new Date(dateString);
        return date.getTime();
    }

    function update() {
        var systemTime = new Date().getTime();
        elapsedTime = systemTime - time;
        container.html(prettyPrintTime(Math.floor(elapsedTime / 1000)));
       // I Know I have to do something here to put the elapsed time into the hidden field
       //But I don't know how exactly to do it
x = document.getElementById("stoppedid");  // The Problem here is that there are Multiple IDs!!  
x.value=; prettyPrintTime(Math.floor(elapsedTime / 1000))   // Change the hidden input field value
    }

    function prettyPrintTime(numSeconds) {
        var hours = Math.floor(numSeconds / 3600);
        var minutes = Math.floor((numSeconds - (hours * 3600)) / 60);
        var seconds = numSeconds - (hours * 3600) - (minutes * 60);

        if (hours < 10) hours = "0" + hours;
        if (minutes < 10) minutes = "0" + minutes;
        if (seconds < 10) seconds = "0" + seconds;
        var time = hours + ":" + minutes + ":" + seconds;

        return time;
    }

    this.start = function() {

        timer = setInterval(function() {update()}, interval * 1000);
    }

    this.stop = function() {
        clearTimeout(timer);
    }
}
$(document).ready(function () {
    <?php 
    $count= $totalRows; // Total Number of Entries in the Database
    $datevar=1;
    $elapsedvar =1;
    $timeloggervar= 1;
    $confirmvar=1;      

if ($count > 0){
        do { 
        $count--;
        $timeloggervar++;
        $confirmvar++;
        $datevar++;
        $elapsedvar++;?>
        var timeLogger<?php echo $timeloggervar; ?> = new ElapsedTimeLogger("#date<?php echo $datevar; ?>", "#elapsed<?php echo $elapsedvar; ?>", 1);
        timeLogger<?php echo $timeloggervar; ?>.start();

        $("#Confirm<?php echo $confirmvar; ?>").click(function() { //Stop timer upon clicking the Confirm Button 
            timeLogger<?php echo $timeloggervar; ?>.stop();

        });
        <?php } while ($count > 0);}?>

    });

    </script>

一些额外信息：
表中的每个条目都有像这样的独特形式。我在表单中放置了一个隐藏字段，以便每个记录的最终ELAPSED TIME VALUE可以存储在值部分中，如下所示。

Some Extra Information: Every entry in the table has a UNIQUE FORM like this. I have placed a hidden field in the form so that each of the records' FINAL ELAPSED TIME VALUE can be stored in value part as in below.

<?php echo'<form action="'.$_SERVER['PHP_SELF'].'" method="post" id="form'.$formid.'">';?>
<input name="Num" type="hidden" value="<?php echo $results['Time of Call']; ?>" />
**<input type="hidden" name="stoppedtime" id="stoppedtime<?php echo $stopid; ?>" value="">**
.....

真的很感激它如果你可以帮我这个，谢谢你！

Would really appreciate it if you could help me with this, Thank you!

编辑：

   function update(id) {
        var systemTime = new Date().getTime();
        elapsedTime = systemTime - time;
        container.html(prettyPrintTime(Math.floor(elapsedTime / 1000)));
       // I Know I have to do something here to put the elapsed time into the hidden field
       //But I don't know how exactly to do it
x = document.getElementById("stoppedid"+id);  // The Problem here is that there are Multiple IDs!!  
x.value= prettyPrintTime(Math.floor(elapsedTime / 1000));   // Change the hidden input field value
    }


this.start = function(id) { 
    timer = setInterval(function(id) {update(id)}, interval * 1000);
}

推荐答案

试试这个，

<script>
ElapsedTimeLogger = function(dateElementId, elapsedElementId, hiden, interval) {
.
.
.
function update() {
    var systemTime = new Date().getTime();
    elapsedTime = systemTime - time;
    container.html(prettyPrintTime(Math.floor(elapsedTime / 1000)));
$(hiden).val(prettyPrintTime(Math.floor(elapsedTime / 1000)));
}
.
.
.

$(document).ready(function () {
<?php
for($id=1; $id<$totalRows; $id++){
?>
    var timeLogger = new ElapsedTimeLogger("#date<?php echo $id;?>", "#elapsed<?php echo $id;?>","#stoppedid<?php echo $id;?>", 1);
    timeLogger.start();

   $("#Confirm<?php echo $id; ?>").click(function() { //Stop timer upon clicking the Confirm Button 
        timeLogger.stop();

    });
<?php
}
?>
});
</script>

这篇关于使用Javascript将值插入到多个隐藏字段中，每个字段都以不同的形式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！