Метка «asp.net mvc» - 9

Введение

В сети существует огромное количество плагинов для реализации какого рода расширений. К сожалению (к счастью ?) все они (возможно я плохо искал ?), предлагают некое законченное решение в разметкой и стилями. Если Вам нужен только функционал, то этот плагин для Вас.

Идея

Расширить функциональность элемента до автокомплит. Только функционал без разметки и стилей. Организовать взаимодействие стандартными способом.
Для запросов к серверу использовать get ajax запрос, передавая на вход значение элемента.
Настраивать элемент через атрибуты:

<input id="comboBox" data-options='{"url":"Home/Load","lengthText": 4,"timeWait":300 }' type="text" />
или
<input id="comboBox1" data-url="Home/Load" type="text" />

Где:
url – адрес сервиса
lengthText –минимальное количество символов после которого производится запрос (умолчание 3)
timeWait – время в мсек по истечении которого производится запрос (умолчание 300)

Оповещения разработчика о состоянии запроса организовать через систему событий.

query_start – старт запроса
query_end – окончание запроса
query_data – получение результата запроса
query_reset – сброс результатов
query_error – ошибка запроса

Обернуть все в плагин jQuery (v 1.7) — query()

$().ready(function () {
    $("#comboBox")
    .query()
    .bind("query_data", function (e, data) {
	// вывести куда то результат – например в <div id=”panel”/>
    })
    .bind("query_error", function (e, data) {
	// сообщить об ошибке
    })
    .bind("query_reset", function () {
	// очистить <div id=”panel”/>
    })
    .bind('query_start query_end', function (e) {
        //  как то показать что идет запрос – здесь меняем фон элемента
        $(this).css({ backgroundColor: e.type == "query_start" ? "#fdf5e6" : "#FFF" });
    });
});

Читать полностью »