如何自動填充<input >在取決於<select >來自 MySQL？

Question

我沒有 PHP、HTML 或 JavaScript 方面的經驗，我尋求幫助。

我有顯示一個選擇的 php 代碼（這個選擇的字符串來自 MySQL 數據庫）和兩個輸入字段。 MySQL 表“g_achievement”格式：

id;     achievement;        craft_1_points;     craft_2_points;  
0;      Medal Gold;         5;                  8;  
1;      Medal Silver;       10;                 15;

選擇和輸入

當我在選擇字段中選擇時，我需要通過來自“craft_1_points”和“craft_2_points”的數據自動填充輸入。

我的代碼：

echo "<label for=\"achievement_id\">Achievement</label><br/>";
    $sql2 = "SELECT * FROM g_achievement";
    $result_select2 = mysql_query($sql2);
    /*drop-down list*/
    echo "<select name = 'achievement'>";
    while($object2 = mysql_fetch_object($result_select2)){
        echo "<option value = '$object2->achievement'>$object2->achievement</option>";
    }
    echo "</select>";
//============================
    echo "<label for=\"craft_1\">Craft 1</label><br/>";
    echo "<input type=\"number\" name=\"craft_1\" size=\"30\"><br/>";
    echo "<label for=\"craft_2\">Craft 2</label><br/>";
    echo "<input type=\"number\" name=\"craft_2\" size=\"30\"><br/>";

我需要使用什么語言？ JavaScript？ 我需要什么代碼？

請幫幫我。 謝謝你。

Answer 1

為此，您必須以兩種方式使用 Javascript。

您可以將所有這些數據從表中提取到客戶端，然后通過 Javascript 從下拉列表中選擇任何選項，您可以在 INPUT 框中填充相關值。
從下拉列表中選擇任何選項，您可以對服務器端進行 Ajax 調用並從服務器獲取數據並通過 Javascript 填充客戶端中的數據。

以下是我上面描述的第一種方式的示例。

<?php
    // Following is a sample data. You can replace this data by getting it from your DB
    $dataSource = array(
            0 => array(
                    'achievement' => 'Medal Gold',
                    'craft_1_points' => 5,
                    'craft_2_points' => 8,
                ),
            1 => array(
                    'achievement' => 'Medal Silver',
                    'craft_1_points' => 10,
                    'craft_2_points' => 15,
                )
        );

    $dataSourceInJson = json_encode($dataSource);
?>

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
    <script type="text/javascript">
        $( document ).ready(function() {
            var dataSource = '<?php echo $dataSourceInJson; ?>';

            $( "#achievements" ).click(function() {
                var achievementSelected = $(this).val();

                $.each(JSON.parse(dataSource), function( index, value ) {
                    var achievementType = value.achievement;

                    if(achievementSelected == achievementType){
                        // Extract related Craft values from JSON object
                        var craft_1_points = value.craft_1_points;
                        var craft_2_points = value.craft_2_points;

                        // Place craft value in respective INPUT box
                        $('#craft_1_points').val(craft_1_points);
                        $('#craft_2_points').val(craft_2_points);
                    }

                });
            });
        });
    </script>
</head>
<body>
    <select id='achievements' name="achievements">
        <option value="">Select Achivements</option>
        <?php
            foreach ($dataSource as $key => $value)
            {
                echo "<option value='$value[achievement]'>$value[achievement]</option>";
            }
        ?>
    </select>

    <br>Craft 1<br>
    <input type="text" id="craft_1_points" name="craft_1_points" value="">

    <br>Craft 2<br>
    <input type="text" id="craft_2_points" name="craft_2_points" value="">
</body>
</html>

Answer 2

set dbConn=Server.CreateObject("ADODB.Connection")
dbConn.Open strProvider
rowCount=0
sqlTable = "select id, name from [sysobjects] where type in ('U','V','P') and category<>2 Order By Name "
set rsSchema=dbConn.execute(sqlTable)
%>
<select  name="getTable" class="selectpicker form-control show-tick" data-live-search="true">
<%
do until rsSchema.EOF %>
 <option value='<%=rsSchema(0)%>'><%= rsSchema(1)%>
<% rsSchema.MoveNext
loop
rsSchema.Close
set rsSchema = Nothing %></option>
</select>

如何自動填充<input >在取決於<select >來自 MySQL？

問題描述

2 個解決方案

解決方案1
1 已采納 2017-02-03 07:36:49

解決方案2
0 2017-02-03 09:56:24

如何自動填充<input >在取決於<select >來自 MySQL？

問題描述

2 個解決方案

解決方案1 1 已采納 2017-02-03 07:36:49

解決方案2 0 2017-02-03 09:56:24

解決方案1
1 已采納 2017-02-03 07:36:49

解決方案2
0 2017-02-03 09:56:24