Форма автозаполнения, заполненная базой данных? - PullRequest
Новая
       2

Форма автозаполнения, заполненная базой данных?

2 голосов
/ 18 мая 2011

В настоящее время я работаю над проектом, в котором мне нужно, чтобы форма автозаполнения вызывала информацию из файла базы данных.Я видел много учебников по формам автозаполнения jquery, но я не знаю, как вызвать файл db для заполнения списка.

Я работаю в PHP.В настоящее время код представляет собой простой выпадающий список, который вызывает файл базы данных для заполнения. 

    <?php
    global $wpdb;
    $depts = $wpdb->get_results( "SELECT * FROM departments ORDER BY department_name ASC" );
    echo '<select>';

    foreach($depts as $row) {
        echo '<option name="select_dept" value="'.$row->department_id.'">'.$row->department_name.'</option>';
    }
    echo '</select>';
?>

Любая помощь будет потрясающей!

Ответы [ 3 ]

2 голосов
/ 18 мая 2011

Я недавно использовал эту библиотеку для автозаполнения - http://www.devbridge.com/projects/autocomplete/jquery/ Итак, вот краткий сценарий, основанный на вашем: 

<?php

$query = isset($_GET['query']) ? $_GET['query'] : FALSE;

if ($query) {
    global $wpdb;
    // escape values passed to db to avoid sql-injection
    $depts = $wpdb->get_results( "SELECT * FROM departments WHERE department_name LIKE '".$query."%' ORDER BY department_name ASC" );

    $suggestions = array();
    $data = array();
    foreach($depts as $row) {
        $suggestions[] = $row->department_name;
        $data[] = $row->department_id;
    }
    $response = array(
        'query' => $query,
        'suggestions' => $suggestions,
        'data' => $data,
    );
    echo json_encode($response);
} else {
?>
<html>
<body>
<input type="text" name="" id="box" />

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script src="http://www.devbridge.com/projects/autocomplete/jquery/local/scripts/jquery.autocomplete.js"></script>

<script type="text/javascript">

$(document).ready(function(){
    $('#box').autocomplete({ 
        serviceUrl:'/',
        // callback function:
        onSelect: function(value, data){ alert('You selected: ' + value + ', ' + data); },
    }); 
});
</script>
</body>
<html>
<?}?>
2 голосов
/ 18 мая 2011

Пожалуйста, следуйте этому очень хорошо написанному учебнику

http://www.nodstrum.com/2007/09/19/autocompleter/

1 голос
/ 18 мая 2011

JQuery UI включает автозаполнение, хотя вам все еще нужно написать PHP-скрипт для возврата информации, которая будет добавлена ​​в элемент управления, как это делается через AJAX. Если в PHP вы знаете, как подключиться к базе данных, запросить ее и вернуть список результатов - у вас не возникнет проблем с этим. JQuery делает AJAX чрезвычайно простым.

В зависимости от того, насколько сложным является ваше поле / набор данных - и, если предположить, что оно не миллионы на миллионы неиндексированных записей, я буду доволен автозаполнением из: 

SELECT thing WHERE thing LIKE '".$query."%'

Так что, если бы вы искали, скажем, еду ... запрос "CA" вытащил бы CArrot и CAbbage и CAuliflower. Если вы добавили% в начало LIKE, вы можете получить результаты, содержащие ваш запрос, а не только начинать с него.

Страница, на которую попадает ваш пользователь, будет содержать часть JQuery, которая одновременно отправляет запрос и создает эффект автозаполнения на основе результатов, и очень простой отдельный скрипт PHP, который при обращении к запросу AJAX возвращает потенциальные «совпадения».

Взгляните на демонстрации автозаполнения в JQuery UI

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...