Автозаполнение поля поиска, выбор нескольких значений из результатов - PullRequest
Новая
       1

Автозаполнение поля поиска, выбор нескольких значений из результатов

2 голосов
/ 14 июля 2010

Я создаю свою собственную коробку рецептов, используя php / mysql, и одна часть, на которой я застрял, - это создание рецептов, в частности, выбор ингредиентов.

Вместо этого я хотел иметь окно автозаполнения, в котором я мог бы печатать названия ингредиентов, располагать результаты внизу справа и выбирать те, которые я ищу. После того, как вы щелкнете по ингредиенту, он будет отображаться под окном поиска с вводом для ввода количества и «x» для удаления при необходимости. Это, конечно, будет расти в зависимости от того, сколько ингредиентов требует рецепт. В конце я бы просто взял данные и вставил в свою базу данных.

Я видел много учебников по AJAX по получению функциональности окна автозаполнения, но ничего не связывало его с выбором значений. Лучший пример того, чего я добиваюсь, можно найти по адресу http://supercook.com. У них есть его, чтобы вы могли искать рецепты.

Любые предложения или онлайн-ресурсы?

Спасибо!

1 Ответ

4 голосов
/ 14 июля 2010

Вы задали отличный вопрос.Ниже я написал короткий пример, чтобы вы начали.Просто сохраните его как ингредиенты. Php, и он должен работать.Конечно, вам нужно добавить соединение с базой данных и запросить, чтобы дать ему реальные данные.Я использовал библиотеку jQuery, потому что она делает Javascript-часть намного проще. 

<code><?php

// connect to database here

if (isset($_POST['q'])) {
    if (trim($_POST['q']) === '') die('[]');
    // $q = mysql_real_escape_string($_POST['q']);
    // run a query like: "SELECT id, name FROM ingredients WHERE name LIKE '{$q}%'"
    // and put the result in the $result array.
    // This is sample data:
    $result = array(
        array('id' => 71, 'name' => 'apple'),
        array('id' => 3, 'name' => 'anchovies'),
        array('id' => 230, 'name' => 'artichoke'),
        );

    if (function_exists('json_encode')) die(json_encode($result));
    else {
        $escaped = array();
        foreach ($result as $r) $escaped[] = str_replace(array('\\', '"'), array('\\\\', '\"'), $r);
        die('["'.join('","', $escaped).'"]');
    }
}

$data = array();
if (isset($_POST['ingredients'])) {
    foreach ($_POST['ingredients'] as $i => $ingredient) {
        $data[] = array(
            'ingredient' => $ingredient,
            'quantity' => $_POST['quantities'][$i],
            );
    }
    // save data to the database here (or inside the foreach loop above)
}

?>
<html><head></head><body>
<style>
    #wrap { position: relative }
    #pop {
        position: absolute;
        border: 1px solid black;
        background-color: white;
        display: none;
    }
</style>

<?php if (count($data)): ?>
<h3>Saved:</h3>
<pre><?php print_r($data) ?>
Ингредиенты:Сохранить
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

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

...