簡體   English   中英

根據下拉選擇 mysqli 自動填充文本輸入字段

[英]Populate text input field automatically based on dropdown selection mysqli

我創建了一個下拉列表,該列表由我的 mysql 數據庫中的數據填充並使用 php 進行編程。 我需要做的是根據下拉列表中的選擇填充文本字段。 不幸的是,我的問題與本論壇上的其他問題不同,因為大多數人只是將所有選項輸入到 html 表單中。 我的包含在一個表中,我不想將文本字段中的內容保存到我的數據庫中......它僅供用戶參考。

我已經閱讀了本網站和許多其他網站上的大量論壇帖子,並嘗試使用 jquery、javascript 和 ajax 腳本,但出於某種原因,我唯一能成功出現在文本字段中的是 id從下拉列表中選擇的相應項目。 我認為重要的是要知道這兩個字段都來自數據庫中的同一個表,所以我無法弄清楚為什么自動填充該字段如此困難。 我想使用 javascript,因為我想要這個文件中的所有內容。

這是php形式的代碼:

<?php
        '<div id="trxdetailstable">';

        echo '<table align="center" width="750px" cellspacing="0" border=".5px" ! important><tr>
         <th>Movie Title</th><th>Category</th><th>Price</th></tr>'; 
        echo '<td align="left" width="8%" height="25px">';
            $ddlquery4 = "SELECT id, title, categoryname FROM dvd ORDER BY title ASC";
            $ddlresult4 = mysqli_query($dbc, $ddlquery4) or die("Bad SQL: $ddlquery4");

            echo '<select class="dropdown" name="dvdid" id="dvdid" size="1" onchange="updatecat()">';
            while($ddlrow4=mysqli_fetch_array($ddlresult4, MYSQLI_ASSOC)){

                $categoryname = $ddlrow4['categoryname'];

            echo "<option data-categoryname='' value='".$ddlrow4['id']."'>" . $ddlrow4['title'] . "</option>";

            } //End while statement
            echo "</select>";
            echo '</a></td>';
            echo '<td align="left" width="10%">';
            echo '<input required id="categoryname" name="categoryname" type="text" readonly="readonly">';
            echo '</a></td>';

這是我目前在 html 頭中的代碼:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

這是當前未生成任何結果的代碼(選擇下拉項后文本字段留空):

$('#dvdid').change(function(e){
    var optionChange = $('#dvdid option:selected').text();
    $('#categoryname').val(optionChange);
});
</script>

這是實際為我提供下拉列表中所選項目的主鍵 (id) 的代碼(我希望它是類別名稱):

<script>
    function updatecat(id){
    if (id === "") {
        $("input[name=categoryname]").val("");
    } else {
        $("input[name=categoryname]").val(id);            
    }
}
</script>

我嘗試了大約 3 個其他腳本,但它們都將文本(類別)字段留空。

任何意見,將不勝感激。 請記住,我的所有數據都是從非手動輸入的數據庫中生成的。 謝謝。

您有重復的行並且不使用ID屬性,您可以使用這樣的類:

$('select.dropdown').change(function(e){
    var optionChange = $(this).find('option:selected').text();
    $(this).closest("tr").find(".categoryname").val(optionChange);
});

你的 php 代碼應該是這樣的:

<?php
        '<div id="trxdetailstable">';

        echo '<table align="center" width="750px" cellspacing="0" border=".5px" ! important>
        <tr>
          <th>Movie Title</th>
          <th>Category</th>
          <th>Price</th>
        </tr>'; 
        echo '<tr>
        <td align="left" width="8%" height="25px">';
            $ddlquery4 = "SELECT id, title, categoryname FROM dvd ORDER BY title ASC";
            $ddlresult4 = mysqli_query($dbc, $ddlquery4) or die("Bad SQL: $ddlquery4");

            echo '<select class="dropdown" name="dvdid" id="dvdid" size="1" onchange="updatecat()">';
            while($ddlrow4=mysqli_fetch_array($ddlresult4, MYSQLI_ASSOC)){

                $categoryname = $ddlrow4['categoryname'];

            echo "<option data-categoryname='' value='".$ddlrow4['id']."'>" . $ddlrow4['title'] . "</option>";

            } //End while statement
            echo "</select>";
            echo '</a></td>';
            echo '<td align="left" width="10%">';
            echo '<input required class="categoryname" id="categoryname" name="categoryname" type="text" readonly="readonly">';
            echo '</a></td></tr>';

對於其他使用 html/php 並根據從他們的 mysql 數據庫(並且只使用一個文件)中保存的數據提供的下拉列表中所做的選擇來搜索自動填充文本字段的方法,這里是最終對我有用的:

在 html 頭中:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

在 html/php 部分:

echo '<td align="left" width="8%" height="25px">';
            $ddlquery4 = "SELECT id, title, categoryname FROM dvd ORDER BY title ASC";
            $ddlresult4 = mysqli_query($dbc, $ddlquery4) or die("Bad SQL: $ddlquery4");

            echo '<select type="text" class="dropdown" name="dvdid" id="dvdid" size="1" onchange="updatecat()">';
            while($ddlrow4=mysqli_fetch_array($ddlresult4, MYSQLI_ASSOC)){

            echo "<option value='".$ddlrow4['id']."' data-categoryname='".$ddlrow4['categoryname']."'>" . $ddlrow4['title'] . "</option>";

            } //End while statement
            echo "</select>";
            echo '</a></td>';
            echo '<td align="left" width="10%">';
            echo '<input type="text" id="categoryname" name="categoryname" readonly="readonly" value="">';
            echo '</a></td>';

在文件末尾的 HTML 區域中:

<script>
$('#dvdid').change(function() {
    selectedOption = $('option:selected', this);
    $('input[name=categoryname]').val( selectedOption.data('categoryname') );
 });
</script>

我真誠地希望這可以防止其他人不得不經歷我經歷的反復試驗和無休止的搜索和閱讀。

伴侶。 我想問你,你的代碼中的 $dbc 是什么? 我的意思是: $ddlresult4 = mysqli_query($dbc, $ddlquery4) 或 die("Bad SQL: $ddlquery4");

它只在我的屏幕上顯示一件事:Bad SQL: SELECT id, title, categoryname FROM dvd ORDER BY title ASC

沒有下拉菜單,沒有文本輸入,只有這條錯誤的 SQL 消息。

感謝您的回答。 問候:多納特

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM