データベースから情報を取得するループ中にphpでjavascriptに変数を渡す

Question

このセクションでは、PHPを使用してmysqlデータベースから情報を取得しています。そのループでは、データベースのすべての行がページに表示されます。各行に価格があり、それらを（ループ内で）合計し、それらを合計して1つの合計として表示します。私は価格が合計に追加されるためにチェックする必要があるチェックボックスを可能にする機能を追加したいが、私はこれを行うためにどこの技術を使うべきかを理解することはできない。ここ

は、コードのスニペットですので、代わりに$ sum_total2 + = $行[ "UsedPrice"]の

$sql = "SELECT CourseNum, CourseName, CreditNum, InstructorName, BookName, NewPrice, UsedPrice, Section_Name, BookLink FROM BookInfo"; //  echo"<a href='$row["BookLink"].'>$row["BookName"].</a>"; 
$test = "test"; 
$result = $conn->query($sql); 

echo"<h2>CIT Course requirements <hr></h2>"; 
echo"<h2><small>Math & Science</small></h2>"; 
if ($result->num_rows > 0) { 
    echo "$tableHeaderInfo"; 
    // output data of each row 
    while($row = $result->fetch_assoc()) { 
     if($row["Section_Name"] == mth_sci){  

       echo "<tr><td class='col-xs-.3'><input type='checkbox' ID='checbox123' name='checkbox123' value='1' onClick='apply(this);' /> </td><td class='col-xs-1'>" . $row["CourseNum"]. "</td><td class='col-xs-3'>" . $row["CourseName"]. " </td><td class='col-xs-2'>" . $row["InstructorName"]." </td><td><a href='" . $row["BookLink"] . "'>" . $row["BookName"] . "</a></td><td class='col-xs-1'>$" . money_format('%(#10n', $row["NewPrice"]). " </td><td class='col-xs-1'>$" . money_format('%(#10n', $row["UsedPrice"]). " </td></tr>"; 

       $test = "test"; 

       echo " 

         <script> 

         apply = function (obj) 
         { 
          if(obj.checked){ 
           obj.parentNode.parentNode.style.backgroundColor='lightgreen' 


          } 
          else 
          obj.parentNode.parentNode.style.backgroundColor='' 
         } 
         </script>      

       "; 

       $sum_total1 += $row["NewPrice"]; //This totals the prices right now 
       $sum_total2 += $row["UsedPrice"]; 



     } 
    } 
    echo "</table>"; 
} else { 
    echo "0 results"; 
} 

。価格を合計するために使用されている場合、echo'd javascript関数内に 'apply'という同様の行があります。

数字を合計するのは大丈夫ですか？どのようにループ内からその追加が行われるようにすれば、価格変数を引き出すことができますか？

助けてくれてありがとう：私は必要に応じてコードの全ページを投稿することができます。

編集：

I私の主な目標は、ループ内で、唯一のチェックボックスがチェックされている場合ながら価格を合計するために使用することです。

編集3 ..

      if(obj.checked){ 
          obj.parentNode.parentNode.style.backgroundColor='lightgreen' 

          //does the total here ie total += $NewPrice 
         } 

しかし、ループが既にチェックボタンのイベントが発生した時点で終了しているので、このようにそれを仕事カントができ、例えば：コードのスニペットがある

基本的に下の画像を表示します（一部のブートストラップを除いたもの）

Example image

http://pastie.org/10790551（上の画像のコードへのリンク）

チェックボックスをオンにすると、合計が更新されます。ループの中でbookprice変数をキャッチする必要があるので、私のテクニックはこれでうまくいかないようです。

Answer 1

私はあなたが何をしているのか分かりませんが、どうしてもjavascriptを使ってみてください。 checkbox要素内に行の価格を含めることができます。タグまたは変数として渡して適用する...

次に、合計からそれを加算/減算します（これは常に特定の要素にあると思います）。 またはチェックボックスをオンにするとタグから価格を取得して総額を表示するために、すべてのチェックボックス要素をJavascriptでループさせることができます。

---

更新する回答：すべての

<input type='checkbox' ID='checbox123' name='checkbox123' value='1' onClick='apply(this);' /> 

まず、あなたが複数の要素に同じIDを使用しないでください：あなたのチェックボックスは次のようになりよう

オーケー、。 IDを付ける必要がある場合は、「チェックボックス」+「ある固有のID」でなければなりません。 CSSの場合は、クラスを使用します。 名前一方、それはあなたがこれを行うことができますので、それは、それらのすべてに同じ（とあなたがHTML5を使用していないと仮定）だ場合、あなたはを活用することができます。

var checkboxes = document.getElementsByName("checkbox123"); 

チェックボックスは今ありますcheckbox123という名前のすべてのチェックボックスのコレクション、そしてあなたがそれらを反復処理することができます:)新しい更新に

---

回答：これを解決する

一つの方法は、あなたがHTMLにあなたの合計を置くようにしてくださいということですIDタグを持つ要素。 次に、チェックボックスに次のような価格情報を入力してください：（btw、IDタグを削除しました。本当に、いくつかの要素に同じIDを再使用しないでください。

<input type='checkbox' style='width:40px; height:40px;' name='checkbox123' value='1' price1='" . [insert new price here] . "' price2=' . [insert used price here] . ' onClick='apply(this);' /> 

してから適用する機能は次のようなものになります：（また、JavaScriptでセミコロンを忘れないように！）

apply = function (obj) 
{ 
    if(obj.checked){ 
     obj.parentNode.parentNode.style.backgroundColor='#99ff99'; 
    } 
    else { 
     obj.parentNode.parentNode.style.backgroundColor=''; //what is this for?? 
    } 

    var checkboxes = document.getElementsByName("checkbox123"); 
    var price1sum = 0; 
    var price2sum = 0; 
    for (var i=0; i<checkboxes.length; i++) { 
     if (checkboxes[i].checked) { 
      price1sum += checkboxes[i].getAttribute("price1"); 
      price2sum += checkboxes[i].getAttribute("price2"); 
     } 
    } 
    /* 
    display price1sum and price2sum in html elements using something like this: 
    document.getElementById("ID for total of new price").innerText = price1sum; 
    */ 
} 

明らかにひとつひとつチェックボックスクリックするループをやってすることはできませんが最も効果的な解決法ですが、あなたの現在の構造を考えれば、それは最も簡単だと思うし、たくさんの行がなければ、あなたは気づかないでしょうng。