2015-09-24 146 views
2

選擇期權的價值,我有以下形式:如何更新使用AJAX,PHP和jQuery

$totalhrs = $monhrs + $tueshrs + $wedshrs + $thurshrs + $frihrs + $sathrs + $sunhrs; 
$totalMins = ($monmins + $tuesmins + $wedsmins + $thursmins + $frimins + $satmins + $sunmins) + ($totalhrs * 60); 
$weeklyhrs = floor($totalMins/60); 
?> <option selected value="<?php echo $weeklyhrs; ?>"><?php echo $weeklyhrs ?></option> 

和總:

enter image description here

我使用這個PHP計算總小時分鐘:

$totalMins = ($monmins + $tuesmins + $wedsmins + $thursmins + $frimins + $satmins + $sunmins) + ($totalhrs * 60); 
$weeklymins = $totalMins % 60; 
?> <option selected value="<?php echo $weeklymins; ?>"><?php echo $weeklymins ?></option> 

我想要做的就是使用AJAX自動重新計算如果用戶輸入總分鐘數或小時數。例如星期四已7個小時輸入,所以我需要的標準時間顯示爲17個小時15分鐘

我已經加入一個onchange事件<select name="sathrs" onchange="updateHrs()">

而一個updateHrs功能

<script type="text/javascript"> 

    function updateHrs() { 
     $.ajax({ 
     url:"http://staging.tbc-recruit.com/time-sheet/updateHours.php", //the page containing php script 
     type: "POST", //request type 
     success:function(result){ 
     alert(result); 
     } 
    }); 
} 
</script> 

在updateHours。 PHP我有以下代碼:

<?php 
function weeklyHrs() { 
    $totalhrs = $monhrs + $tueshrs + $wedshrs + $thurshrs + $frihrs + $sathrs + $sunhrs; 
    $totalMins = ($monmins + $tuesmins + $wedsmins + $thursmins + $frimins + $satmins + $sunmins) + ($totalhrs * 60); 
    $weeklyhrs = floor($totalMins/60); 
    //$weeklymins = $totalMins % 60; 
    return $weeklyhrs; 
} 

function weeklyMins() { 
    $totalhrs = $monhrs + $tueshrs + $wedshrs + $thurshrs + $frihrs + $sathrs + $sunhrs; 
    $totalMins = ($monmins + $tuesmins + $wedsmins + $thursmins + $frimins + $satmins + $sunmins) + ($totalhrs * 60); 
    //$weeklyhrs = floor($totalMins/60); 
    $weeklymins = $totalMins % 60; 
    return $weeklymins; 
} 

?> 

下一步有什麼標準的小時更新?

HTML表單

<form id="edit" class="edit" name="candidateupdate" action="candidate-submitted.php?id=<?php echo "$_GET[id]"; ?>" method="post"> 
     <div class="grid-100 mar-bot-20 mar-top-20"> 
     <label>Temporary Worker Name</label> 
     <input readonly value="<?php echo $name; ?>" /><br /> 
     <label>Client Compamy</label> 
     <input readonly value="<?php echo $clientquery[0]['company']; ?>" /><br /> 
     <label>Week Ending</label> 
     <input readonly value="<?php echo $tsquery[0]['weekending']; ?>" /><br /> 
     <label>Department</label> 
     <input readonly value="<?php echo $tsquery[0]['department']; ?>" /><br /> 
     <label>Basic Pay Rate</label> 
     <input readonly value="£ <?php echo $tsquery[0]['basicpay']; ?>" /><br /> 
     </div> 
     <p class="grid-100 bold">Please do not complete hours for time that has been booked as holiday.</p> 
     <p class="grid-100 bold">These days need to be left blank on the timesheet.</p> 

     <div class="grid-100 mar-top-20"> 
     <table> 
     <thead> 
      <tr> 
      <th>Day</th> 
      <th style="padding-left:5px">Hrs</th> 
      <th style="padding-left:5px">Mins</th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr> 
      <td><label>Monday</label></td> 
      <td> 
       <select name="monhrs" onchange="updateHrs()"> 
       <?php 
       $monhrs = $tsquery[0]['monhrs']; 
       displayHours($monhrs); 
       ?> 
       </select> 
      </td> 
      <td> 
       <select name="monmins" onchange="updateHrs()"> 
       <?php 
       displayMinutes($monhrs); 
       ?> 
       </select> 
      </td> 
      </tr> 
      <tr> 
      <td><label>Tuesday</label></td> 
      <td> 
       <select name="tueshrs" onchange="updateHrs()"> 
       <?php 
       $tueshrs = $tsquery[0]['tueshrs']; 
       displayHours($tueshrs); 
       ?> 
       </select> 
      </td> 
      <td> 
       <select name="tuesmins" onchange="updateHrs()"> 
       <?php 
       displayMinutes($tueshrs); 
       ?> 
       </select> 
      </td> 
      </tr> 
      <tr> 
      <td><label>Wednesday</label></td> 
      <td> 
       <select name="wedshrs" onchange="updateHrs()"> 
       <?php 
       $wedshrs = $tsquery[0]['wedshrs']; 
       displayHours($wedshrs); 
       ?> 
       </select> 
      </td> 
      <td> 
       <select name="wedsmins" onchange="updateHrs()"> 
       <?php 
       displayMinutes($wedshrs); 
       ?> 
       </select> 
      </td> 
      </tr> 
      <tr> 
      <td><label>Thursday</label></td> 
      <td> 
       <select name="thurshrs" onchange="updateHrs()"> 
       <?php 
       $thurshrs = $tsquery[0]['thurshrs']; 
       displayHours($thurshrs); 
       ?> 
       </select> 
      </td> 
      <td> 
       <select name="thursmins" onchange="updateHrs()"> 
       <?php 
       displayMinutes($thurshrs); 
       ?> 
       </select> 
      </td> 
      </tr> 
      <tr> 
      <td><label>Friday</label></td> 
      <td> 
       <select name="frihrs" onchange="updateHrs()"> 
       <?php 
       $frihrs = $tsquery[0]['frihrs']; 
       displayHours($frihrs); 
       ?> 
       </select> 
      </td> 
      <td> 
       <select name="frimins" onchange="updateHrs()"> 
       <?php 
       displayMinutes($frihrs); 
       ?> 
       </select> 
      </td> 
      </tr> 
      <tr> 
      <td><label>Saturday</label></td> 
      <td> 
       <select name="sathrs" onchange="updateHrs()"> 
       <?php 
       $sathrs = $tsquery[0]['sathrs']; 
       displayHours($sathrs); 
       ?> 
       </select> 
      </td> 
      <td> 
       <select name="satmins" onchange="updateHrs()"> 
       <?php 
       displayMinutes($sathrs); 
       ?> 
       </select> 
      </td> 
      </tr> 
      <tr> 
      <td><label>Sunday</label></td> 
      <td> 
       <select name="sunhrs" onchange="updateHrs()"> 
       <?php 
       $sunhrs = $tsquery[0]['sunhrs']; 
       displayHours($sunhrs); 
       ?> 
       </select> 
      </td> 
      <td> 
       <select name="sunmins" onchange="updateHrs()"> 
       <?php 
       displayMinutes($sunhrs); 
       ?> 
       </select> 
      </td> 
      </tr> 
      <?php if(($tsquery[0]['otpay'] == "") && ($tsquery[0]['ot2pay'] == "")) { ?> 
      <tr><td colspan="2"><p class="bold">Total Hours.</p></td></tr> 
      <?php } else { ?> 
      <tr><td colspan="2"><p class="bold">Please indicate the breakdown of your hours in the boxes below.</p></td></tr> 
      <?php } ?> 
      <tr> 
      <td><label>Standard Time</label></td> 
      <td> 
       <select name="basichrs"> 
       <?php 
        $totalhrs = $monhrs + $tueshrs + $wedshrs + $thurshrs + $frihrs + $sathrs + $sunhrs; 
        $totalMins = ($monmins + $tuesmins + $wedsmins + $thursmins + $frimins + $satmins + $sunmins) + ($totalhrs * 60); 
        $weeklyhrs = floor($totalMins/60); 
        ?> <option selected value="<?php echo $weeklyhrs; ?>"><?php echo $weeklyhrs ?></option> 

       </select> 
      </td> 
      <td> 
       <select name="basicmins"> 
       <?php 
        $totalMins = ($monmins + $tuesmins + $wedsmins + $thursmins + $frimins + $satmins + $sunmins) + ($totalhrs * 60); 
        $weeklymins = $totalMins % 60; 
        ?> <option selected value="<?php echo $weeklymins; ?>"><?php echo $weeklymins ?></option> 

       </select> 
      </td> 
      </tr> 
      <?php 
       if($tsquery[0]['otpay'] != "") { ?> 

      <tr> 
      <td><label>Overtime x 1.5</label></td> 
      <td> 
       <select name="othrs"> 
       <?php 
        $othrs = $tsquery[0]['othrs']; 
        standardHours($othrs); 
       ?> 
       </select> 
      </td> 
      <td> 
       <select name="otmins"> 
       <?php 
        standardMinutes($othrs); 
       ?> 
       </select> 
      </td> 
      </tr> 
      <?php } 
      if($tsquery[0]['ot2pay'] != "") { ?> 
      <tr> 
      <td><label>Overtime x 2</label></td> 
      <td> 
       <select name="ot2hrs"> 
       <?php 
        $ot2hrs = $tsquery[0]['ot2hrs']; 
        standardHours($ot2hrs); 
       ?> 
       </select> 
      </td> 
      <td> 
       <select name="ot2mins"> 
       <?php 
        standardMinutes($ot2hrs); 
       ?> 
       </select> 
      </td> 
      </tr> 
      <?php } ?> 
     </tbody> 
     </table> 
     </div> 
     <input name="submit" value="Submit Timesheet to Supervisor" type="submit"> 
    </form> 

感謝

+0

staging.tbc-recruit.com的頁面顯示: –

+0

你沒有發送數據,你只是請求php頁面 –

+0

所以我需要在updateHrs()函數中發送數據? –

回答

1

使用JavaScript做計算的一個小例子, 試試這個:

更換

<tr><td colspan="2"><p class="bold">Total Hours.</p></td></tr> 

 <tr><td colspan="2"><p class="bold">Total Hours.</p><p id="totalhrs"></p></td></tr> 

,然後用這個

更換的JavaScript updateHrs()功能
<script> 
function updateHrs() { 
    var totalhrs = parseInt($("select[name=monhrs]")[0].value) + parseInt($("select[name=tueshrs]")[0].value) + parseInt($("select[name=wedshrs]")[0].value) + parseInt($("select[name=thurshrs]")[0].value) + parseInt($("select[name=frihrs]")[0].value) + parseInt($("select[name=sathrs]")[0].value) + parseInt($("select[name=sunhrs]")[0].value); 
    var totalmins = (parseInt($("select[name=monmins]")[0].value) + parseInt($("select[name=tuesmins]")[0].value) + parseInt($("select[name=wedsmins]")[0].value) + parseInt($("select[name=thursmins]")[0].value) + parseInt($("select[name=frimins]")[0].value) + parseInt($("select[name=satmins]")[0].value) + parseInt($("select[name=sunmins]")[0].value)) + (totalhrs * 60); 
    var weeklyhrs = Math.floor(totalmins/60); 
    var weeklymins = totalmins % 60; 
    $("#totalhrs").html(weeklyhrs); 
    $("#totalhrs").val(weeklyhrs); 
    $("#totalmins").html(weeklymins); 
    $("#totalmins").val(weeklymins); 
} 
</script> 
1
function updateHrs() { 
     $.ajax({ 
     url:"http://staging.tbc-recruit.com/time-sheet/updateHours.php", //the page containing php script 
     type: "POST", //request type 
     data:$("yourform").serialize(), 
     success:function(result){ 
     alert(result); 
     } 
    }); 
} 

這樣你會得到updateHours.php數據並獲得appropirate結果響應,那麼相應地更新你的總。