2

以下は、html、javascript、php、および mysql がどのように相互作用するかを学ぶために取り組んできた注文フォームです。

https://www.dropbox.com/s/7zpok07w1bygu60/Screen%20Shot%202012-08-12%20at%2010.28.41%20AM.png

このテーブルの目的は、ユーザーが数量フィールドに数値を入力することです。変更すると、javascript がその特定の製品の総コストを自動的に更新します。キッカーは、リストに mysql データベース テーブルからデータを入力することです。

これが私が使用しているhtml、javascript、およびphpコードです。

HTML

<table>
<tr>
    <td>
        Product
    </td>
    <td>
        Description
    </td>
    <td>
        Quantity
    </td>
    <td>
        Price
    </td>
    <td>
        Total Cost
    </td>
</tr>

<?php include("pop_prodlist.php"); ?>
<tr>
    <td>Totals</td>
    <td></td>
    <td>TotalQuantity</td>
    <td></td>
    <td>TotalCost</td>
</tr>
</table>

PHP

    while($row = mysql_fetch_array($result))
{
    echo "<tr>";
    echo "<td>" . $row['P_Name'] . "</td>";
    echo "<td>" . $row['P_Description'] . "</td>";
    echo "<td>
    <input type='text' size='3' name='" . $row['P_Name'] . "_Quantity'
      onChange='calcCost()'/>
    </td>";
    echo "<td>" . $row['P_Cost'] . "</td>";
    echo "<td id='" . $row['P_Name'] . "_Cost'>0.00</td>";
    echo "</tr>";

}

Javascript calcCost() 関数

    function calcCost()
    {

      var theForm = document.forms['productform'];

    /*
    COMMENTED OUT FOR TIME BEING
    var pquan = theForm.elements[productname + '_Quantity'].value;
    var costperquan = '15.99';
    var ptotalcost = costperquan * pquan;
    */

     var divobj = document.getElementById('Basketball_Cost');
     divobj.innerHTML = "helloworld";

    }

私が現在抱えている問題は、mysqlクエリから決定された製品名に応じて、phpスクリプトエコーからjavascript関数calcCostに一意の引数を配置する方法がわからないことです。

また、自分自身を教育するために、より良い解決策がどのようになるか/どのように見えるかについて興味があります. これが問題に対する最もエレガントな解決策であるとは思えず、より良い解決策を見つけたいと思っています。

4

1 に答える 1

3

ジェイ、PHP、MySQL、JavaScriptがどのように連携するかを理解しているようです。それは良いことです。

個人的には、jQuery（JavaScript Library）を使用することをお勧めします。これはWeb全体で広く使用されており、非常に一般的で、強力で、理解しやすく、使いやすいものです。言語のライブラリを使用するのは良くないと言う人もいますが、言語を知る前に、jQueryは構文がわかりやすいため、JavaScriptをよりよく理解するのに役立ちました。

したがって、jQueryを使用するには、htmlファイルにソーススクリプトを追加するだけです。なぜjQueryをお勧めするのですか？また、ajax（ページを更新せずにデータベースからコンテンツをロードする）を非常に簡単に使用できるようになります。

jQueryを使用すると、クリックイベントをHTMLから分離することもできます。基本的に、idまたはclass属性をHTML要素に割り当てます。これは、jsでの参照であるため、必須ではありませonclick=""ん。

HTMLについて：テーブルレイアウトを使用しないことを強くお勧めします。HTML5とCSS3の時代には、テーブルの優れた代替品があります。

さらにサポートが必要な場合は、コメントでお知らせください。サポートさせていただきます...

于 2012-08-12T16:23:35.973 に答える