Листинг 20.20

function searchData() {

var sKeyword = Ext.get("keyword"). getValue(false);

if (sKeyword!= "") {

var iSearchMode = Ext.getDom("search_in"). selectedIndex;

var aResult = [];

searchInArray(sKeyword, aHTML, aResult, iSearchMode); searchInArray(sKeyword, aCSS, aResult, iSearchMode); searchInArray(sKeyword, aSamples, aResult, iSearchMode); if (aResult.length > 0) {

var s = "";

for (var i = 0; i < aResult.length; i++) {

s += "<LI><A HREF=\"" + aResult[i].url + "\">" +

aResult[i].name + "</A></LI>";

}

var htelResult = Ext.get("cmain"). insertHtml("beforeEnd", "<P>Результаты поиска:</P><UL>" + s + "</UL>"); Ext.fly(htelResult). select("A"). on("click", function(e, t) {

var href = Ext.fly(this). getAttribute("href");

var elA = Ext.get("navbar"). child("A[href=" + href + "]");

var elItem = elA.parent("LI");

loadFragment(elItem, e);

});

}

}

}

Рассмотрим его построчно.

Получаем искомое слово, введенное посетителем в поле ввода keyword:

var sKeyword = Ext.get("keyword"). getValue(false);

Проверяем, ввел ли посетитель вообще что-либо в это поле ввода:

if (sKeyword!= "") {

Если ввел, получаем номер пункта, выбранного в раскрывающемся

search_in:

var iSearchMode = Ext.getDom("search_in"). selectedIndex;

Объявляем массив, который будет хранить набор элементов массивов aHTML, aCSS и aSamples, имеющих название или одно из ключевых слов, начало которого совпадает с введенным посетителем словом:

var aResult = [];

Фактически этот массив будет хранить результаты поиска.

Для каждого из массивов aHTML, aCSS и aSamples вызываем функцию searchInArray, которую объявим потом:

searchInArray(sKeyword, aHTML, aResult, iSearchMode); searchInArray(sKeyword, aCSS, aResult, iSearchMode); searchInArray(sKeyword, aSamples, aResult, iSearchMode);

Эта функция будет искать элементы в массиве, переданном ей вторым параметром, имеющие название или одно из ключевых слов, начало которого совпадает со словом, переданным первым параметром, и помещать их в массив с результатами поиска, переданный третьим параметром. Четвертым параметром этой функции передается номер пункта, выбранного в раскрывающемся списке search_in, — режим поиска.

Проверяем, есть ли в массиве с результатами поиска хоть один элемент, т. е. увенчался ли поиск успехом:

if (aResult.length > 0) {

Если так, объявляем переменную, которая будет хранить строку с HTML-кодом, формирующим пункты списка с результатами поиска:

var s = "";

(Ранее мы договорились, что будем выводить результаты поиска на Web-страницу в виде списка HTML; каждый пункт этого списка будет содержать гиперссылку на соответствующую Web-страницу.)

Запускаем цикл со счетчиком, который будет просматривать все элементы массива с результатами поиска:

for (var i = 0; i < aResult.length; i++) {

Тело этого цикла на основе каждого элемента массива с результатами поиска сформирует HTML-код, создающий пункт списка с гиперссылкой:

s += "<LI><A HREF=\"" + aResult[i].url + "\">" +

aResult[i].name + "</A></LI>";

}

На основе полученного таким образом HTML-кода создаем список с результатами поиска и помещаем его в самом конце контейнера cmain:

var htelResult = Ext.get("cmain"). insertHtml("beforeEnd",

"<P>Результаты поиска:</P><UL>" + s + "</UL>");

Выбираем из этого списка все гиперссылки и привязываем к ним обработчик события click, который будет обрабатывать щелчки на этих гиперссылках и выполнять загрузку соответствующей Web-страницы:

Ext.fly(htelResult). select("A"). on("click", function(e, t) {

var href = Ext.fly(this). getAttribute("href");

var elA = Ext.get("navbar"). child("A[href=" + href + "]");

var elItem = elA.parent("LI");

loadFragment(elItem, e);

});

}

}

Этот фрагмент кода без изменений перекочевал сюда из функции generateRelated, объявленной в главе 19 . (В принципе, будет лучше оформить его в виде отдельной функции, но это вы можете сделать сами, в качестве домашнего задания.)

На этом выполнение функции searchData заканчивается.

Осталось объявить функцию searchInArray, которая, собственно, будет выполнять поиск в массивах, составляющих базу данных. Объявляющий код (листинг 20.21) мы поместим где-либо перед объявлением функции searchData.