javascript - PHPのJavascript関数が結果を返し、IDの重複の問題

Question

誰かが親切に私を助けてくれるか、これで正しい方向に私を導くことができるかどうか疑問に思っていました...基本的に私はチケット価格（mysqlデータベースから）と数量（ドロップから）の間の合計数を計算するJavascript関数を持っています-ダウンメニュー）。JavascriptとPHPは正常に機能します...ただし、最初の結果についてのみ、機能は動的ではなく、これを修正するための支援が本当に必要です。

私のPHPでは、SQLステートメントからテーブルが返されます。

$postCodeSQL = "SELECT * FROM ticket WHERE locationID IN (SELECT locationID FROM location WHERE postCode LIKE '$pcSearch') ";

$postCoderesult = mysql_query($postCodeSQL) or die(mysql_error());

  while ($pcRow = mysql_fetch_assoc($postCoderesult)) {
                                $ID = $pcRow['ticketID']; //row in ticket table on database
                                $venue = $pcRow['venue'];
                                $ticketPrice = $pcRow['tPrice'];
                                $date = $pcRow['date'];
                                $time= $pcRow['time'];

                        echo "<tr>\n";
                                echo "<td id=\"venuePlace\">$venue <input type='hidden' id='venuePlaceHidden' class='venuePlaceHidden' value='".$venue."'></td>\n";
                                echo "<td id=\"ticketprice\">&pound;$ticketPrice <input type='hidden' id='ticketPriceHidden' class='ticketPriceHidden' value='".$ticketPrice."'></td>\n";
                                echo "<td >
                                        <select name =\"showQuantity\" id=\"showQuantity\" class =\"showQuantity\" onChange=\"calculateCost()\" >
                                                <option value=\"Select\">Select...</option>
                                                <option value=\"1\">1</option>
                                                <option value=\"2\">2</option>
                                                <option value=\"3\">3</option>
                                                <option value=\"4\">4</option>
                                                <option value=\"5\">5</option>
                                        </select>

                                    </td>\n";
                                echo "<td id=\"date\">$date <input type='hidden' id='dateHidden' class='dateHidden' value='".$date."'></td>\n";
                                echo "<td id=\"time\">$time <input type='hidden' id='timeHidden' class='timeHidden' value='".$time."'></td>\n";

                                echo "<td> <input type= \"button\" class= \"buyMe\" value= \"Buy\" name=\"buyMe\" onclick=\"grandTotal()\" > 
                                      </td>\n";


                        echo "</tr>\n";

                        }

非表示のフィールドは、Javascript関数がこれらの値を解析できるように挿入されます。JS関数はこれらの値を解析し、チケットのコスト（$ ticketPrice）を乗算し、それに配信値を乗算します。

function quantityChange() {
//Select the value of the drop down list       
var quantity = $('.showQuantity option:selected').val();
//get the value of the number from the tPrice column in 'ticket' table
var ticket = parseInt(document.getElementById('ticketPriceHidden').value);
//get the venue value
var venue = document.getElementById('venuePlaceHidden').value;
var date = document.getElementById('dateHidden').value;
var time = document.getElementById('timeHidden').value;
//multiply them together
var total = quantity * ticket;

return {
    venue: venue,
    quantity: quantity,
    ticket: ticket,
    date: date,
    time: time,
    total: total
};
}

function calculateCost () {
var data = quantityChange();

$('#summary').html('You have chosen '+ ' '  + data.quantity  + ' ' + 'tickets @' + ' ' + data.venue + ' = '  + ' ' +  '&pound;' + data.total);
}

前に述べたように、この関数はテーブルによって返される最上位の結果に対して機能しますが、私のテーブルでは複数の結果が返され、JSはこれらの値に対して機能しません。返される各結果のIDが同じであるため、私の問題はIDの重複に関連しています。

各結果にクラスを指定しましたが、「getElementByClass」メソッドを実行できません。返される他の結果に対してJS関数が機能するように、このコードを編集する方法を知っている人はいますか？'返される値ごとにforeach（）ループを記述して、JS関数を適用する必要があるかもしれないと感じています...'またはそれらの線に沿った何か？

どんな助けでも本当にありがたいです、そして私は私の受け入れ率を改善することに取り組んでいます！

score 1 · Accepted Answer

動的IDでこのコードを試してください......

<script>
function quantityChange(id) {
//Select the value of the drop down list       
var quantity = $('.showQuantity_'+id+'option:selected').val();
//get the value of the number from the tPrice column in 'ticket' table
var ticket = parseInt(document.getElementById('ticketPriceHidden_'+id).value);
//get the venue value
var venue = document.getElementById('venuePlaceHidden_'+id).value;
var date = document.getElementById('dateHidden_'+id).value;
var time = document.getElementById('timeHidden_'+id).value;
//multiply them together
var total = quantity * ticket;

    $('#summary_'+id).html('You have chosen '+ ' '  + quantity  + ' ' + 'tickets @' + ' ' + venue + ' = '  + ' ' +  '&pound;' + total);
}


</script>

<?php 

$postCodeSQL = "SELECT * FROM ticket WHERE locationID IN (SELECT locationID FROM location WHERE postCode LIKE '$pcSearch') ";
$postCoderesult = mysql_query($postCodeSQL) or die(mysql_error());

$i=0;
while ($pcRow = mysql_fetch_assoc($postCoderesult)) {
    $ID = $pcRow['ticketID']; //row in ticket table on database
    $venue = $pcRow['venue'];
    $ticketPrice = $pcRow['tPrice'];
    $date = $pcRow['date'];
    $time= $pcRow['time'];

echo "<tr>\n";
echo "<td id=\"venuePlace\">$venue <input type='hidden' id='venuePlaceHidden_$i' class='venuePlaceHidden' value='".$venue."'></td>\n";
echo "<td id=\"ticketprice\">&pound;$ticketPrice <input type='hidden' id='ticketPriceHidden_$i' class='ticketPriceHidden' value='".$ticketPrice."'></td>\n";
echo "<td >
<select name =\"showQuantity\" id=\"showQuantity_$i\" class =\"showQuantity\" onChange=\"quantityChange($i)\" >
<option value=\"Select\">Select...</option>
<option value=\"1\">1</option>
<option value=\"2\">2</option>
<option value=\"3\">3</option>
<option value=\"4\">4</option>
<option value=\"5\">5</option>
</select>

</td>\n";
echo "<td id=\"date\">$date <input type='hidden' id='dateHidden_$i' class='dateHidden' value='".$date."'></td>\n";
echo "<td id=\"time\">$time <input type='hidden' id='timeHidden_$i' class='timeHidden' value='".$time."'></td>\n";

echo "<td> <input type= \"button\" class= \"buyMe\" value= \"Buy\" name=\"buyMe\" onclick=\"grandTotal()\" > 
</td>\n";


echo "</tr>\n";
$i++;
echo "<div id = 'summary_$i'></div>";
}
?>

説明

<script>
function abc(id){
  alert('#ticketPriceHidden_'+id);
  var tph =  document.getElementById('ticketPriceHidden_'+id).value;

 if(tph == ''){
     alert('this field is required......');
 }

}
</script>


<a href="javascript:;" onclick="abc(1);">1</a>
<a href="javascript:;" onclick="abc(2);">2</a>

score 0 · Accepted Answer

同じ ID のセットが複数ある場合 (結果が異なる場合)、それらを数値と共に使用することをお勧めします。venuePlaceHidden_01, venuePlaceHidden_02

$numしたがって、テーブルを作成するためのコードと、JS で値を分析するコードの両方に、円とインクリメント変数を追加する必要があります。

javascript - PHPのJavascript関数が結果を返し、IDの重複の問題

2 に答える 2

Related

Reference