jquery関数からphp関数を呼び出す方法

Question

jquery関数からphp関数を呼び出して、いくつかの値を計算し、その値をセッションに格納し、セッションに格納されている値をリストしています。私はマウスクリックイベントのhtmlフォームからjquery関数に値を渡しています。そして私はこれを達成するために休暇中のコードを使用しています。

これは1 PHPファイル名totalprice.phpでHTMLフォームのコードです：

<table width="100%" > 
<tr> 
      <td >type</td> 
      <td><select name="costtype" id="costype"> 
     <option>one time</option>\n<option>multi</option>\n 
     </select></td></tr> 

     <tr> 
      <td align="right">destination </td> 
      <td> <select name="destination" id ="destination"><option>Lagos</option>\n<option>Oyo</option>\n<option>Kano</option>\n<option>Rivers</option>\n<option>Edo</option>\n<option>Ogun</option>\n<option>Kaduna</option>\n<option>Plateau</option>\n<option>Anambra</option>\n<option>Delta</option></select></td> 
     </tr> 

     <tr> 
      <td align="right">Total eight (Kg) </td> 
      <td><input type="text" size="10" name="weight" id="weight"></td> 
     </tr> 

     <tr> 
      <td>&nbsp;</td> 
      <td><input type="submit" value="Submit"  onclick="javascript:calculate()" name="caliculate" class="button"></td> 
     </tr> 
     </tbody></table> 

     <div id="testtable">cal value will be displayed here.</div> 
</form> 

そして、これは、jQueryの機能

function calculate() { 

    var costtype = $("#costype").val(); 
    var destination = $("#destination").val(); 
    var totalweight = $("#weight").val(); 


    xmlhttp=new XMLHttpRequest(); 

    xmlhttp.onreadystatechange=function() 
     { 
     if (xmlhttp.readyState==4 && xmlhttp.status==0) 
     { 
     document.getElementById("testtable").innerHTML=xmlhttp.responseText; 
     } 
     } 
    xmlhttp.open("POST","caltest.php?item="+escape(costtype)+"&totalweight="+escape(totalweight)+"&destination"+escape(destination),true); 
    xmlhttp.send(); 

    } 

ですこれは私は計算を行うと、ここで私がセッション
にデータを保存するためにいくつかのコードをやってる $ fee_details = $ test_feeテーブルに

$itemtype = urldecode($_POST['item']); 
$destination = urldecode($_POST['destination']); 
$totalweight = urldecode($_POST['totalweight']); 

$sql  = "select price from prices_list where lower(costtype)='".strtolower($itemtype)."' "; 

$price=0; 
$Result   = mysql_query($sql) ; 

while ($row = mysql_fetch_array($Result)) 
{ 
$price  = (isset($row['price'])) ? $row['price'] : ""; 
} 

$price = round($price,2); 

$costcharges = $price*$totalweight; 
$costtcharges = round($costcharges,2); 

を使用することにより、セッションデータを表示するよどこファイルcaltest.php - > storetestfee（$ itemtype、$ totalweight、$ destination、$ costcharges）;

echo "<table width='75%' > 
     <tbody><tr> 
     <th width='2%' class='highlight'><b>#</b></th> 
      <th width='30%' class='highlight'><b>Item </b></th> 
      <th width='23%' class='highlight'><b>Destination</b></th> 
      <th width='5%' class='highlight'><b>weight (Kg) </b></th> 
      <th width='10%' class='highlight'><b>cost Charge</b></th> 
     </tr>"; 
if(count($fee_details)>0) 
{$i=0; 
    foreach($fee_details as $key=>$test_price) 
    {$i++; 
    echo " <tr> "; 
    echo "<td>".$i."</td>"; 
    echo "<td>".$test_price['item_type']."</td>"; 
    echo "<td>".$test_price['destination']."</td>"; 
    echo "<td>".$test_price['totalweight']."</td>"; 
    echo "<td>".$courier_details['weightcharges']."</td>"; 
    echo " </tr> "; 
}} 
echo "</tbody> 
</table>"; 

jqueryを使用して直接作業した場合、このコードは完全に機能しています。私はこれをページをリフレッシュせずに済ませたい。私はどこでコードで間違いをしているのか助けてくれますか？ありがとうございました。

Answer 1

まず、あなたはjqueryのを使用しているときxmlhttp=new XMLHttpRequest();を使用する必要はありませんjqueryにはload、post、またはajaxを使用する機能がありますが、これがあなたに役立つかもしれません。

$(function(){ 
    $("input[type=submit]").click(function(){ 
     var costtype = $("#costype").val(); 
     var destination = $("#destination").val(); 
     var totalweight = $("#weight").val(); 

     $.ajax({ 
      type :'POST', 
      url  :"caltest.php?item="+escape(costtype)+"&totalweight="+escape(totalweight)+"&destination"+escape(destination), 
      success :function(result){ 
       //action where request complete, result come from server 
      } 
     }); 
    )}; 
}); 

Answer 2

あなたはjQueryのを使用したい場合は、jQueryのAjax機能を見てみましょう、私はそれはあなたの問題を解決する必要がありますね：すべてオフhttp://api.jquery.com/jQuery.ajax/