如何更改名称，而不是动态填充的 select 列表的值？

Question

我有一个 select 列表，其中动态填充了我数据库中的数据。但我不想让用户看到真实的列名，所以我在我的数据库中创建了一个额外的列，名为 column_alias。我想要的是在下拉列表中显示 column_alias 名称，但保留列名称的实际值。

这就是我目前用真实列名填充 select 列表的方式：

function loadTables() {
        $.getJSON("dropdown_code/get_tables.php", success = function(data)
        {
            console.log('inside callback');
            var optionsTables = "";
            for(var i = 0; i < data.length; i++)
                {
                    optionsTables += "<option value='" + data[i] + "'>" + data[i] + "</option>";
                }

        $("#slctTable").append(optionsTables);
        $("#slctTable").change();
    }); 

}

这是从我的数据库中获取数据的代码：

<?PHP

    require "opendb.php";

    $query =    "select table_name 
                from db_tables 
                order by table_name";

    $data = pg_query($conn, $query);

    $table_names = array();

    while ($row = pg_fetch_array($data))
    {
        array_push($table_names, $row["table_name"]);
    }

    echo json_encode($table_names);

    require "closedb.php";
?>

更新

这是我的数据库 table 的样子：

所以我希望 table_alias 在我的 select 列表中可见，但我希望值是 table_name 以便它可以与我的数据库交互。

Answer 1

html

<select id="xoxo_select">
  <option value="foo_value">foo</option>
  <option value="xoxo_value">xoxo</option>
</select>

js

$('#xoxo_select option[value="xoxo_value"]').text('bar'); // change name of option
$('#xoxo_select option[value="xoxo_value"]').attr('value', 'bar_value'); // change value of option

jsfiddle https://jsfiddle.net/tg126u7g/

Answer 2

首先，您还需要从 database.Change 您的服务器端代码获取别名到以下内容。

<?PHP

require "opendb.php";

$query =    "select table_name,table_alias 
            from db_tables 
            order by table_name";

$data = pg_query($conn, $query);
$table_names = array();

while ($row = pg_fetch_array($data))
{
    array_push($table_names, $row);
}
echo json_encode($table_names);
require "closedb.php";
?>

然后在您的客户端代码中简单地输出 table_alias 作为选项名称和 table_name 作为选项值。

function loadTables() {
    $.getJSON("dropdown_code/get_tables.php", success = function(data)
    {
        console.log('inside callback');
        var optionsTables = "";
        for(var i = 0; i < data.length; i++)
            {
                optionsTables += "<option value='" + data[i]['table_name'] + "'>" + data[i]['table_alias'] + "</option>";
            }

    $("#slctTable").append(optionsTables);
    $("#slctTable").change();
}); 
}

Answer 3

从数据库获取数据的变化：

<?PHP

require "opendb.php";

$query =    "select table_name,table_alis 
            from db_tables 
            order by table_name";

$data = pg_query($conn, $query);

$table_names = array();
 $i=0;
while ($row = pg_fetch_array($data))
{

    array_push($table_names[$i], $row["table_name"]);
    $i++;
}

echo json_encode($table_names);

    require "closedb.php";
?>

然后更改 javascript 代码：

optionsTables += "<option value='" + data[i][0] + "'>" + data[i][1] + "</option>";

如何更改名称，而不是动态填充的 select 列表的值？

How to change the name, but not the value of a dynamically filled select list?

javascript

php

jquery

getjson

selectlist