將變量通過php傳遞到JavaScript，同時處於從數據庫獲取信息的循環中

Question

在這段代碼中，我使用PHP從mysql數據庫中獲取信息。它在一個循環中，以便數據庫中的所有行將顯示在頁面上。每一行都有一個價格，我將這些（循環中）加起來並顯示爲一個總數。我想添加一些功能，這些功能允許爲了將價格添加到總量中而需要檢查的複選框，但我無法弄清楚在什麼地方以及我應該使用什麼技術來執行此操作。

這裏是代碼段：

$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"; 
} 

所以不是$ sum_total2 + = $行[ 「UsedPrice」];被用於總計價格，在名爲'apply'的echo'd javascript函數中將會出現類似的行。

這似乎是一個好的方式來總數？我如何從循環中獲得增加，這樣我可以拉動價格變量？

感謝您的幫助:)如果需要，我可以發佈完整的代碼頁。

編輯：

我我的主要目標是使用，而內環路，但只有當複選框被選中，以總價格一路上揚。

例如

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

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

，但不能工作，可以像這樣，因爲在循環按時間checkbutton事件發生已經完成..

編輯3：

的代碼片斷是基本顯示下面的圖像（減去一些自舉）

Example image

http://pastie.org/10790551（鏈接到上面圖片中的代碼）

當按下複選框時，總數將被更新。這似乎是我的技術不會爲此工作，因爲我需要在循環內部捕獲bookprice變量？

Answer 1

我不完全確定我明白你要做什麼，但爲什麼不讓javascript做總結，如果你處理checkbox點擊javascript呢？您可以在複選框元素中包含行的價格。無論是作爲一個標籤或作爲變量通過應用...

然後，你從總和中加上/減去它（我猜這總是在某個元素中）。 或者，您可以讓javascript循環遍歷所有複選框元素，以便從標記中提取價格（如果選中並顯示總和）。

---

答案更新：

好了，你的複選框看起來像這樣：

所有的

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

首先，你不應該使用相同的ID爲一個以上的元素。如果你需要給它一個ID，它應該是'複選框'+ [一些唯一的ID]。如果是CSS，請使用class。 在另一方面的名稱，你可以利用，如果它是爲所有這些（和你不使用HTML5假設）相同的，因爲這可以讓你做到這一點：

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

複選框現在是所有的複選框命名checkbox123的集合，你可以通過他們:)

---

答到新的更新迭代：

解決這個的

的一種方式，就是你要確保把你的總數爲HTML帶ID標籤的元素。 然後確保給你的複選框這樣的價格信息:(順便說一句，我刪除了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; 
    */ 
} 

顯然做了每一個複選框，單擊一個循環是不這是最有效的解決方案，但考慮到你目前的結構，我認爲這是最簡單的，如果你沒有很多排，我不認爲你會注意到anythi NG。