php - 自动提交表单js

Question

我正在尝试自动提交一个表单，（它下面只是表单，它用一段时间包装了{}，以便显示每个数据库条目）。它适用于一周中的所有日子，但如果没有像 onfocus() 这样的 js 事件，我无法提交 $totalhours、$holidayhours、$wagegross 的值。

基本上我想提交这 3 个输入而无需单击或任何其他手动操作。

任何的想法？

<form id="weeklysheet" name="weeklysheet" method="post" action="hourly-function.php">
            <tbody>

                <tr style="line-height:0px;">
                    <td class="large">
                        <p class="employee_name"><?php echo  $fullname?></p>
                    </td>
                    <td class="small">
                        <input name="mon" id="mon" type="text" class="days_input" value="<?php echo $data['mon'];?>"onchange="this.form.submit();"/>
                    </td>                   
                    <td class="small">
                        <input name="tue" id="tue" type="text" class="days_input" value="<?php echo $data['tue'];?>"onchange="this.form.submit();"/>
                    </td>
                    <td class="small">
                        <input name="wed" id="wed" type="text" class="days_input" value="<?php echo $data['wed'];?>"onchange="this.form.submit();"/>
                    </td>
                    <td class="small">
                        <input name="thu" id="thu" type="text" class="days_input" value="<?php echo $data['thu'];?>"onchange="this.form.submit();"/>
                    </td>
                    <td class="small">
                        <input name="fri" id="fri" type="text" class="days_input" value="<?php echo $data['fri'];?>"onchange="this.form.submit();"/>
                    </td>
                    <td class="small">
                        <input name="sat" id="sat" type="text" class="days_input" value="<?php echo $data['sat'];?>"onchange="this.form.submit();"/>
                    </td>
                    <td class="small">
                        <input name="sun" id="sun" type="text" class="days_input" value="<?php echo $data['sun'];?>"onchange="this.form.submit();"/>
                    </td >  
                    <td class="small">
                        <input name="totalhours" id="totalhours" type="text" class="cumul_week_input" value="<?php echo $totalhours ?>"onfocus="this.form.submit();"/>
                    </td>
                    <td class="small">
                        <input name="holidayhours" type="text" class="cumul_week_input" value="<?php echo $holidayhours ?>"onfocus="this.form.submit();"/>
                    </td>
                    <td class="small">
                        <input name="wagegross" type="text" class="cumul_week_input" value="<?php echo $wagegross ?>"onfocus="this.form.submit();"/>
                    </td>
                    <td>
                    <input type="submit"name="save" id="save" value="Confirm" style="display:none;" />
                </tr>
            </tbody>
        </form>

score 1 · Accepted Answer

您可以jQuerytrigger在文档加载后使用提交按钮的单击操作，如下所示：

1.)您可以从Google 的托管库链接 jQuery 库：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

或者，从 jQuery.com 下载它到一个“js”文件夹，然后包含它

<script src="js/jQuery.js"></script>

2.)将此脚本标签放在标签下方</form>：

<script type="text/javascript">
    $(document).ready(function(){ //When the document is done loading
        $("input#save").trigger('click'); //"Click" on the input button with an ID of "save"
    });
</script>

或者你可以在没有 jQuery 的情况下使用纯 javascript 方式，如下所示：

<html>
    <body onLoad="submitform()">
        <form id="weeklysheet" name="weeklysheet" method="post" action="hourly-function.php">

然后将此脚本标签放在标签下方</form>：

<script type="text/javascript">
    function submitform()
    {
      document.weeklysheet.submit();
    }
</script>

或者，缩短上述方法：

<html>
    <body onLoad="Javascript: document.weeklysheet.submit();">
        <form id="weeklysheet" name="weeklysheet" method="post" action="hourly-function.php">

score 0 · Accepted Answer

您是要单独提交还是一次性提交？如果您想一次完成所有操作，您可以给最后一个元素一个 id 并在 jquery 中使用 $('#div').moueleave

score 0 · Accepted Answer

那是我正在使用的js，我尝试超时提交并且它正在工作。最后我的问题不存在，似乎当我提交表单时，3 个 php 变量推送了前一个输入条目的值。

我不知道我的解释是否清楚......

     <script type="text/javascript">
    function submitform()
    {   
        //document.getElementById("weeklysheet");
        var form = document.getElementById("weeklysheet")
       form.submit();
    }
    function submit()
    {   
        if (document.getElementById("weeklysheet")) {
            setTimeout("submitform()", 5000); // set timout

       }
       return false;
    }
</script>

score 0 · Accepted Answer

（对不起，如果这是一个很长的解释）我会带着我的解决方案回来......以防万一这可以帮助任何人。

所以想法是有一个表格来显示员工列表，您可以在其中输入工作天数、假期、病假。然后根据工资频率（即：每周、4 周或每月）计算每个的总和并计算总额。因为用户不会一次完成所有表单，所以我需要在本周的所有时间自动提交所有输入。

这是JS：

<script type="text/javascript">
function grab<?=$empnum?>(){

// Monday
var mon<?=$empnum?> = document.getElementById('mon<?=$empnum?>').value;
if ((mon<?=$empnum?> == "h" || mon<?=$empnum?> == "H")){
    var Hmon<?=$empnum?> = 1;
    var Wmon<?=$empnum?> = 0;
    var Smon<?=$empnum?> = 0;
    }
else if((mon<?=$empnum?> == "w" || mon<?=$empnum?> == "W")){
    var Wmon<?=$empnum?> = 1;
    var Hmon<?=$empnum?> = 0;
    var Smon<?=$empnum?> = 0;
    }
else if((mon<?=$empnum?> == "s" || mon<?=$empnum?> == "S")){
        var Smon<?=$empnum?> = 1;
        var Hmon<?=$empnum?> = 0;
        var Wmon<?=$empnum?> = 0;
    }
else{
        var Smon<?=$empnum?> = 0;
        var Hmon<?=$empnum?> = 0;
        var Wmon<?=$empnum?> = 0;
        var Xmon<?=$empnum?> = 0;
    }
// Tuesday  
var tue<?=$empnum?> = document.getElementById('tue<?=$empnum?>').value;
if ((tue<?=$empnum?> == "h" || tue<?=$empnum?> == "H")){
    var Htue<?=$empnum?> = 1;
    var Wtue<?=$empnum?> = 0;
    var Stue<?=$empnum?> = 0;
    }
else if((tue<?=$empnum?> == "w" || tue<?=$empnum?> == "W")){
    var Wtue<?=$empnum?> = 1;
    var Htue<?=$empnum?> = 0;
    var Stue<?=$empnum?> = 0;
    }
else if((tue<?=$empnum?> == "s" || tue<?=$empnum?> == "S")){
        var Stue<?=$empnum?> = 1;
        var Htue<?=$empnum?> = 0;
        var Wtue<?=$empnum?> = 0;
    }
else{
        var Stue<?=$empnum?> = 0;
        var Htue<?=$empnum?> = 0;
        var Wtue<?=$empnum?> = 0;
    }
// Wednesday
var wed<?=$empnum?> = document.getElementById('wed<?=$empnum?>').value;
if ((wed<?=$empnum?> == "h" || wed<?=$empnum?> == "H")){
    var Hwed<?=$empnum?> = 1;
    var Wwed<?=$empnum?> = 0;
    var Swed<?=$empnum?> = 0;
    }
else if((wed<?=$empnum?> == "w" || wed<?=$empnum?> == "W")){
    var Wwed<?=$empnum?> = 1;
    var Hwed<?=$empnum?> = 0;
    var Swed<?=$empnum?> = 0;
    }
else if((wed<?=$empnum?> == "s" || wed<?=$empnum?> == "S")){
        var Swed<?=$empnum?> = 1;
        var Hwed<?=$empnum?> = 0;
        var Wwed<?=$empnum?> = 0;
    }
else{
        var Swed<?=$empnum?> = 0;
        var Hwed<?=$empnum?> = 0;
        var Wwed<?=$empnum?> = 0;
    }
// Thurday
var thu<?=$empnum?> = document.getElementById('thu<?=$empnum?>').value;
if ((thu<?=$empnum?> == "h" || thu<?=$empnum?> == "H")){
    var Hthu<?=$empnum?> = 1;
    var Wthu<?=$empnum?> = 0;
    var Sthu<?=$empnum?> = 0;
    }
else if((thu<?=$empnum?> == "w" || thu<?=$empnum?> == "W")){
    var Wthu<?=$empnum?> = 1;
    var Hthu<?=$empnum?> = 0;
    var Sthu<?=$empnum?> = 0;
    }
else if((thu<?=$empnum?> == "s" || thu<?=$empnum?> == "S")){
        var Sthu<?=$empnum?> = 1;
        var Hthu<?=$empnum?> = 0;
        var Wthu<?=$empnum?> = 0;
    }
else{
        var Sthu<?=$empnum?> = 0;
        var Hthu<?=$empnum?> = 0;
        var Wthu<?=$empnum?> = 0;
    }
// Friday
var fri<?=$empnum?> = document.getElementById('fri<?=$empnum?>').value;
if ((fri<?=$empnum?> == "h" || fri<?=$empnum?> == "H")){
    var Hfri<?=$empnum?> = 1;
    var Wfri<?=$empnum?> = 0;
    var Sfri<?=$empnum?> = 0;
    }
else if((fri<?=$empnum?> == "w" || fri<?=$empnum?> == "W")){
    var Wfri<?=$empnum?> = 1;
    var Hfri<?=$empnum?> = 0;
    var Sfri<?=$empnum?> = 0;
    }
else if((fri<?=$empnum?> == "s" || fri<?=$empnum?> == "S")){
        var Sfri<?=$empnum?> = 1;
        var Hfri<?=$empnum?> = 0;
        var Wfri<?=$empnum?> = 0;
    }
else{
        var Sfri<?=$empnum?> = 0;
        var Hfri<?=$empnum?> = 0;
        var Wfri<?=$empnum?> = 0;
    }
// Saturday
var sat<?=$empnum?> = document.getElementById('sat<?=$empnum?>').value;
if ((sat<?=$empnum?> == "h" || sat<?=$empnum?> == "H")){
    var Hsat<?=$empnum?> = 1;
    var Wsat<?=$empnum?> = 0;
    var Ssat<?=$empnum?> = 0;
    }
else if((sat<?=$empnum?> == "w" || sat<?=$empnum?> == "W")){
    var Wsat<?=$empnum?> = 1;
    var Hsat<?=$empnum?> = 0;
    var Ssat<?=$empnum?> = 0;
    }
else if((sat<?=$empnum?> == "s" || sat<?=$empnum?> == "S")){
        var Ssat<?=$empnum?> = 1;
        var Hsat<?=$empnum?> = 0;
        var Wsat<?=$empnum?> = 0;
    }
else{
        var Ssat<?=$empnum?> = 0;
        var Hsat<?=$empnum?> = 0;
        var Wsat<?=$empnum?> = 0;
    }
// Sunday
var sun<?=$empnum?> = document.getElementById('sun<?=$empnum?>').value;
if ((sun<?=$empnum?> == "h" || sun<?=$empnum?> == "H")){
    var Hsun<?=$empnum?> = 1;
    var Wsun<?=$empnum?> = 0;
    var Ssun<?=$empnum?> = 0;
    }
else if((sun<?=$empnum?> == "w" || sun<?=$empnum?> == "W")){
    var Wsun<?=$empnum?> = 1;
    var Hsun<?=$empnum?> = 0;
    var Ssun<?=$empnum?> = 0;
    }
else if((sun<?=$empnum?> == "s" || sun<?=$empnum?> == "S")){
        var Ssun<?=$empnum?> = 1;
        var Hsun<?=$empnum?> = 0;
        var Wsun<?=$empnum?> = 0;
    }
else{
        var Ssun<?=$empnum?> = 0;
        var Hsun<?=$empnum?> = 0;
        var Wsun<?=$empnum?> = 0;
    }

var W<?=$empnum?> = Wmon<?=$empnum?>*1+Wtue<?=$empnum?>*1+Wwed<?=$empnum?>*1+Wthu<?=$empnum?>*1+Wfri<?=$empnum?>*1+Wsat<?=$empnum?>*1+Wsun<?=$empnum?>*1;
var H<?=$empnum?> = Hmon<?=$empnum?>*1+Htue<?=$empnum?>*1+Hwed<?=$empnum?>*1+Hthu<?=$empnum?>*1+Hfri<?=$empnum?>*1+Hsat<?=$empnum?>*1+Hsun<?=$empnum?>*1;
var S<?=$empnum?> = Smon<?=$empnum?>*1+Stue<?=$empnum?>*1+Swed<?=$empnum?>*1+Sthu<?=$empnum?>*1+Sfri<?=$empnum?>*1+Ssat<?=$empnum?>*1+Ssun<?=$empnum?>*1;

var totals<?=$empnum?> = document.getElementById('totalhrs<?=$empnum?>').value = W<?=$empnum?>; 
var holiday<?=$empnum?> = document.getElementById('holihrs<?=$empnum?>').value = H<?=$empnum?>; 
var sick<?=$empnum?> = document.getElementById('sickdays<?=$empnum?>').value = S<?=$empnum?>; 
var wage<?=$empnum?> = document.getElementById('wagefreq<?=$empnum?>').value;
if(wage<?=$empnum?> == 'Weekly'){ 
document.getElementById('gross<?=$empnum?>').value = <?=$empsalarywage?>;
}
else if(wage<?=$empnum?> == '4 Weekly'){ 
document.getElementById('gross<?=$empnum?>').value = (<?=$empsalarywage?> / 4);
}
else if(wage<?=$empnum?> == 'Monthly'){ 
document.getElementById('gross<?=$empnum?>').value = ((<?=$empsalarywage?> * 12) / 52);
}
document.getElementById('weeklysheet<?=$empnum?>').submit('save<?=$empnum?>');
}
</script>

这是表格：

<form id="weeklysheet<?=$empnum?>" name="weeklysheet" method="post" action="salary-function.php" >
                <tbody>
                    <tr style="line-height:0px;">
                        <td class="large">
                            <p class="employee_name"><?=$fullname?></p>
                        </td>   
                        <td class="small">
                            <input name="mon" id="mon<?=$empnum?>" type="text" class="days_input" maxlength="1" value="<?php echo $mon?>"onchange="grab<?=$empnum?>()"/>
                        </td>                   
                        <td class="small">
                            <input name="tue" id="tue<?=$empnum?>" type="text" class="days_input" maxlength="1" value="<?php echo $tue?>"onchange="grab<?=$empnum?>()"/>
                        </td>
                        <td class="small">
                            <input name="wed" id="wed<?=$empnum?>" type="text" class="days_input" maxlength="1" value="<?php echo $wed?>"onchange="grab<?=$empnum?>()"/>
                        </td>
                        <td class="small">
                            <input name="thu" id="thu<?=$empnum?>" type="text" class="days_input" maxlength="1" value="<?php echo $thu?>"onchange="grab<?=$empnum?>()"/>
                        </td>
                        <td class="small">
                            <input name="fri" id="fri<?=$empnum?>" type="text" class="days_input" maxlength="1" value="<?php echo $fri?>"onchange="grab<?=$empnum?>()"/>
                        </td>
                        <td class="small">
                            <input name="sat" id="sat<?=$empnum?>" type="text" class="days_input" maxlength="1" value="<?php echo $sat?>"onchange="grab<?=$empnum?>()"/>
                        </td>
                        <td class="small">
                            <input name="sun" id="sun<?=$empnum?>" type="text" class="days_input" maxlength="1" value="<?php echo $sun?>"onchange="grab<?=$empnum?>()"/>
                        </td >
                        <td class="small">
                            <input name="totalhrs" id="totalhrs<?=$empnum?>" type="text" class="cumul_week_input" readonly value="<?php echo $totalhrs?>"/>
                        </td>
                        <td class="small">
                            <input name="holihrs" id="holihrs<?=$empnum?>" type="text" class="cumul_week_input" readonly value="<?php echo $holihrs?>"/>
                        </td>
                        <td class="small">
                            <input name="sickdays" id="sickdays<?=$empnum?>" type="text" class="cumul_week_input" readonly value="<?php echo $sickdays?>"/>
                        </td>
                        <td class="small">
                            <input name="gross" id="gross<?=$empnum?>" type="text" class="cumul_week_input" readonly value="<?php echo $gross?>"/>
                        </td>
                        <td>
                        <input type="submit"name="save" id="save<?=$empnum?>" value="Confirm" style="display:none"/>
                        <input type="hidden"name="enddate" value="<?php echo $data['currentWeekStart']; ?>"/>
                                                <input type="hidden"name="wagefreq"id="wagefreq<?=$empnum?>" value="<?=$wagefreq?>"/>

                        </td>
                    </tr>
                </tbody>
            </form>

这就像我想要的那样工作，但如果有人看到任何可以以更好的方式完成的事情，我真的很感激任何更正......谢谢

php - 自动提交表单js

4 回答 4

Related

Reference