簡體   English   中英

jQuery級聯與PHP和催化劑的下拉列表

[英]Jquery cascading dropdowns with php and catalyst

我正在嘗試在催化劑Web應用程序中實現級聯下拉菜單。 目的是在第一個菜單中選擇一個數據庫表,並使該表中的列出現在第二個菜單中。 我的策略是將Jquery與PHP幫助程序腳本一起使用,以對數據庫運行查詢。

jQuery代碼:

$("#db_table").change(function() {
    console.log("dbtable changed");
    $("#db_field").load("[% c.uri_for('/field_get.php')%]?choice=" + $("#db_table").val());
});

PHP:

<?php
    $username = "webuser";
    $password = "webuser";
    $hostname = "localhost";

    $dbhandle = mysql_connect($hostname, $username, $password) or die("Unable to connect to MySQL");
    $selected = mysql_select_db("mousesom", $dbhandle) or die("Could not load database");
    $choice = mysql_real_escape_string($_GET['choice']);

    $query = "SELECT column_name FROM information_schema.columns WHERE table_name = '$choice';";

    $result = mysql_query($query);

    while ($row = mysql_fetch_array($result)) {
        echo "<option>" . $row{'dd_val'} . "</option>";
    }
?>

HTML:

Table:<select id="db_table">
   <option selected value="base">Choose a Table</option>
   <option value="neurons">Neurons</option>
   <option value="peaks_factors">Transcription Factors</option>
   <option value="peaks">Peaks</option>
   <option value="peaks_selection">Selection</option>
   <option value="peaks_histmods">Histone Modification</option>
</select>
Field:<select id="db_field">
   <option value="Placeholder">Please Select a Table</option>
</select>

到目前為止,我已經驗證了javascript請求正在觸發,但是沒有得到預期的響應。 根據Catalyst測試服務器的日志輸出,似乎很有可能沒有將所需的參數傳遞給PHP幫助程序腳本,而是由Catalyst拆分為查詢參數。

[info] *** Request 8 (0.013/s) [17122] [Fri Jun 26 19:22:50 2015] ***
[debug] Path is "/"
[debug] Arguments are "field_get.php"
[debug] "GET" request for "field_get.php" from "10.21.136.40"
[debug] Query Parameters are:
.-------------------------------------+--------------------------------------.
| Parameter                           | Value                                |
+-------------------------------------+--------------------------------------+
| choice                              | peaks_histmods                       |
'-------------------------------------+--------------------------------------'

顯然,這不是我想要發生的事情,並且我想知道Catalyst是否具有將這些參數傳遞給輔助腳本或其他解決方法的另一種方法。 我一直在搜索各種文檔,到目前為止,都是空手而歸。 任何幫助,將不勝感激!

您的請求就像是Catalyst操作一樣被處理,因為您是在告訴您何時使用模板代碼[% c.uri_for() %] 如果您要調用PHP腳本,則該腳本必須位於Catalyst URI命名空間之外,可能是通過將其放在您的root/static資源中,或者您的網絡服務器希望在其他地方找到PHP資源。

話雖這么說,但我不明白為什么要將PHP引入此組合。 返回列名列表的Catalyst控制器應該很容易實現。 以下未經測試的代碼假定您在Catalyst應用程序中有一個名為$dbh的數據庫句柄。 無論您使用的是什么數據庫抽象層(DBIC?),都有一種直接的方法來實現。 您可能還選擇為此創建適當的模型代碼。

sub get_fields :Args(1) {
    my ($self, $c, $table) = @_;
    my $qry = "SELECT column_name FROM information_schema.columns WHERE table_name = ?";
              # we'll have none of that nasty SQL injection-vulnerable code here...
    my $result = "";
    my @res = $dbh->selectall_arrayref($qry, { Slice=>{} }, $table );
    map { $result .= sprintf("<option>%s</option>", $_->{column_name} } @res;
    $c->res->body($result);
}

我將是第一個指出這種方法不是最佳實踐的人,但是它可能會給您一些有關如何進行的想法。 (提示:更好的做法是將列名稱返回為JSON,並處理在jQuery中創建<option>標記,而不是在Catalyst Action中創建HTML代碼段。因為您可能會找到一個接受表名並返回的方法其列可能通常有用。)


更新資料

您可以使用Catalyst :: View :: JSON,然后將列列表放入$c->stash->{json} ,即使使用情況過大,它也會做正確的事。 您也可以只轉換為JSON並在$c->res->body()返回它:如果不為空,則將跳過所有模板處理。 因此,您所需要的可能很簡單:

use JSON;

sub get_fields :Args(1) {
    my ($self, $c, $table) = @_;
    my @rows = $c->model('InformationSchema')->result_set('Columns')->search({table_name => $table});
    my $columnlist = [ map { $_->column_name } @rows ];
    $c->res->body(to_json($columnlist));
}

...但是更多的錯誤檢查將不是一件壞事。

從jQuery的訪問歸結為類似(再次未經測試):

$("#db_table").change(function() {
    $.ajax({
        type: "GET",
        url: "[% c.uri_for('/__your_module__/get_fields/') %]" + $("#db_table").val(),
        success: function(json){
            $.each(json, function(i, val) {
                $('#db_field').append($('<option>').text(val).attr('value', val));
            });
        }
    });
});

暫無
暫無

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

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