Форум программистов, компьютерный форум, киберфорум
Наши страницы
jQuery
Войти
Регистрация
Восстановить пароль
 
Рейтинг 4.89/9: Рейтинг темы: голосов - 9, средняя оценка - 4.89
Aphinadt
0 / 0 / 0
Регистрация: 14.07.2012
Сообщений: 5
1

Автозаполнение jQuery + AJAX - несколько колонок в подсказке

14.07.2012, 13:20. Просмотров 1627. Ответов 4
Метки нет (Все метки)

Здравствуйте, люди добрые!

Есть такая задача. Сделать автозаполнение на jQuery, но не простое (а золотое).
Есть боксы Район и Код. База с кодами и районами (имена районов могут повторяться, коды уникальны). Нужно, чтобы по мере набора автоматом предлагался список районов по введенным данным. Это работает, написано руками, без плагинов. Проблема в том, чтобы сделать так, чтобы подсказка выдавалась в формате "Район - Код", но при выборе в поле Район шел только Район, а в Код автоматически шел соответствующий код. Серверная часть на Шарпе, ее приводить не буду, там и так все понятно.

Вот скрипт:
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
$(document).ready(function () {
    PasteSuburb();
});
function PasteSuburb() {
    $(".auto").autocomplete({
        source: function (request, response) {
            $.ajax({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                url: "Default.aspx/GetSuburbFromDB",
                data: "{'inputSuburb':'" + document.getElementById('suburbControl').value + "'}",
                dataType: "json",
                success: function (data) {
                    response(data.d);
                },
                error: function (result) {
                    alert("Seems like error occured. Please reload page and try again.");
                }
            });
        }
    });
}
Код рабочий, но сейчас он вставляет всю строку из базы - "Район + Код".
В jQuery я начинающая, гуглила до посинения, но такой проблемы нигде не нашла.

Пожалуйста, помогите-помогите)
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
Similar
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
14.07.2012, 13:20
Ответы с готовыми решениями:

JQuery.ajax. Как получить от сервера несколько ответов
Здравствуйте Возможно ли послав запрос на сервер получить от него несколько...

JQuery и автозаполнение
Привет, гуру по jquery. Помогите или дайте ссылку, где прочитать, как...

Не работает автозаполнение полей JQuery
Здравствуйте не работает скрипт автозаполнение полей, подскажите пожалуйста в...

JQuery, Ajax и LIVE!? Возможно ли повесить ajax запрос на live?
все делаю правильно, но у меня даже onSubmit alert("ok!"); выводить не хочет? ...

JQuery ajax
Всем привет. Помогите разобраться с такой штукой. Есть код: function...

4
ostgals
882 / 677 / 101
Регистрация: 23.01.2009
Сообщений: 1,582
14.07.2012, 23:32 2
Цитата Сообщение от Aphinadt Посмотреть сообщение
Серверная часть на Шарпе, ее приводить не буду, там и так все понятно.
Однако без нее не обойтись. Или предоставьте описание возвращаемого json.
0
Aphinadt
0 / 0 / 0
Регистрация: 14.07.2012
Сообщений: 5
15.07.2012, 00:47  [ТС] 3
Цитата Сообщение от ostgals Посмотреть сообщение
Однако без нее не обойтись. Или предоставьте описание возвращаемого json.
Да легко, если как-то повлияет на ход решения проблемы.

C#
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
 [WebMethod]
 
    public static List<string> GetSuburbFromDB(string inputSuburb)
    {
        List<string> result = new List<string>();
 
        using (SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["DatabaseConnectionString1"].ToString()))
        {
            using (SqlCommand cmd = new SqlCommand("select suburb,postcode from postcode_db where suburb LIKE '%'+@suburbText+'%'", con))
            {
                con.Open();
                cmd.Parameters.AddWithValue("@suburbText", inputSuburb);
                SqlDataReader myDataReader = cmd.ExecuteReader();
                while (myDataReader.Read())
                {
                    result.Add(myDataReader["suburb"].ToString()  + " - " + myDataReader["postcode"].ToString());
                }
                return result;
            }
        }
    }
0
Schtrich
weboman
210 / 195 / 63
Регистрация: 13.08.2010
Сообщений: 1,531
Записей в блоге: 6
16.07.2012, 10:10 4
кусочек json pls., без него не разобьем.
0
ostgals
882 / 677 / 101
Регистрация: 23.01.2009
Сообщений: 1,582
16.07.2012, 10:52 5
Aphinadt, тогда ваша задача сводится к тому, чтобы немного модифицировать поведение autocomplete.

Для этого нужно в код инициализации autocomplete добавить обработчик для события select. Например, так:
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
var regions = [
    "Aaa - 12",
    "Bbb - 13",
    "Ccc - 14",
    "Ddd - 15",
    "Eee - 16"
    ];
 
$('#name').autocomplete({
    source: regions,
    select: function(e, ui){
        var item = ui.item.label.split(' - ');
        $('#name').val(item[0]);
        $('#code').val(item[1]);
        return false;
    }
});
Естественно, параметр source вы оставляете свой, и селекторы $('#name') и $('#code') меняете на свои.

Рабочий пример (без ajax): http://jsfiddle.net/pWTkG/
0
16.07.2012, 10:52
MoreAnswers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
16.07.2012, 10:52

Jquery+ajax
Всем здрасте. Возниклатакая проблема, по двум параметрам формирую выпадающий...

JQuery, Ajax
Добрый день.Я не знаю как JQuery так и аякса...На джейквери когда-то что-то...

jQuery + ajax
в общем есть 4 файла: mainMenu.html в нём вот такой код : &lt;!DOCTYPE html&gt;...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
5
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2018, vBulletin Solutions, Inc.
Рейтинг@Mail.ru