Домашні чоловіки search item php i. Живий пошук на Бітрікс. приклад реалізації. Створюємо базу даних

Головна / Корисне ПЗ
11.1K

Одна з найпопулярніших і найнеобхідніших функцій на будь-якому сайті – це пошук, реалізований за допомогою спеціальної форми. Цей функціонал дозволяє відвідувачам швидко знаходити на сайті контент, що їх цікавить.

Сьогодні ми хочемо розповісти, як зробити пошук по сайту за допомогою спеціальної форми, яка опитуватиме таблиці бази даних та виводитиме інформацію про поточних керівників на сайті. Ви навчитеся створювати таблиці бази даних, яка міститиме інформацію про поточний персонал.

Розробляти форми пошуку при допомоги PHP, а також познайомитеся з SQL ( Structured Query Language) – спеціальною мовою для збору, запису та модифікації інформації, що міститься в базах даних. Перед тим, як почати, рекомендуємо вам завантажити файли проекту.

Що вам знадобиться

  • Інструмент для роботи з базами даних MySQL.
  • Локальний або віддалений сервер з підтримкою PHP.
  • Текстовий редактор.

Створюємо базу даних

Якщо ви не зовсім впевнені, що зможете розібратися з базою даних на вашому хостингу, зв'яжіться з хостером для отримання відповідних інструкцій або допомоги. Після того, як база даних буде створена, вам потрібно буде підключити її, створити таблицю та записати до неї необхідні дані.

Найпопулярнішим інструментом для управління MySQL є PHP My Admin, цього інструменту буде достатньо для нашого сьогоднішнього керівництва.

Створення таблиці

Наша таблиця має бути створена у наступному форматі:

Column Name Data Type Length Null or Not Null Primary key? Auto Increment
ID INT 1 Not Null Yes Yes
FirstName Varchar 50 Not Null No No
LastName Varchar 50 Not Null No No
Email Varchar 50 Not Null No No
PhoneNumber Varchar 15 Not Null No No

Таблиця бази даних складається зі стовпців і рядків, як у Excel. Перший стовпець дозволяє ідентифікувати дані на ім'я. Далі йде колонка Data types (тип даних), яка вказує нам на тип даних, які у колонці. У полі Length (Довжина) вказується максимальний обсяг пам'яті (сховища) для стовпчика таблиці. Ми використовуємо змінні, які дають більшу гнучкість. Іншими словами, якщо довжина ПІБ менше 50 символів, то буде зайнята лише частина відведеного місця.

І серед даних персоналу може бути порожніх значень ( null, empty). Перший рядок виділено жовтим кольором, тому що стовпець ID – наш основний ключ. Основний ключ у базі даних гарантує, що кожен запис буде унікальним. До цієї колонки також застосовано автоінкремент, а це означає, що кожному запису в нашій базі даних присвоюватиметься унікальний номеравтоматично.

Вносимо представників персоналу до таблиці

Як тільки розберетеся з таблицею, почніть заповнювати її даними. 6 записів цілком достатньо, щоб закріпити в думці процедуру. Нижче пропоную вам власний приклад:

Column ID FirstName LastName Email PhoneNumber
2 Ryan Butler [email protected] 417-854-8547
3 Brent Callahan [email protected] 417-854-6587

Розробка форми

Щоб створити форму пошуку по сайту через Google, відкрийте будь-який відповідний текстовий редактор. Я рекомендую скористатися безкоштовним PSPad. Ви можете використовувати будь-який текстовий редактор, де передбачено підсвічування синтаксису. Це значною мірою полегшить процес написання та налагодження PHP-коду. Створюючи сторінку для форми пошуку, не забудьте зберегти її у форматі .php, інакше PHP-код не оброблятиметься належним чином. Як тільки збережіть документ, скопіюйте до нього наступну розмітку:

Пошук контактів:

Детальний пошук контактів

Ви можете шукати на ім'я або прізвище

Якщо ви знайомі з мовою HTML, то тут вам все має бути зрозуміло як мінімум до тега form , що відкриває . Всередині цього тега знаходиться найважливіший елемент коду – атрибут action. Як дія нашої форми ми вказали назву нашого файлу, а потім застосували до нього рядок запиту “ go”.

Перевірка на відповідність критерію

Коли користувач вводить ім'я або прізвище, а потім натискає кнопку підтвердження, форма передає дані собі і додає в кінці рядок запиту “ go”. На цьому етапі ми перевіряємо наявність рядка запиту go . Якщо результат є позитивним, виводимо результати пошуку.

До висновку запитуваних результатів нам потрібно перевірити ще раз: (1) чи була підтверджена форма, (2) чи містить рядок запиту значення go, (3) був чи пошуковий запитвведений у нижньому чи верхньому регістрі? Якщо жодна з перевірок не дає позитивного результату ( true), то від нас не потрібно виконувати будь-які дії.

Для початку додамо невеликий блок коду PHP пошук по сайту після тега, що закриває:

Спершу ми відкриваємо блок PHP-коду тегом ””.

Будь-який PHP-код у цій парі тегів буде виконуватися сервером. Потім ми перевіряємо, чи була підтверджена форма:

Введіть пошуковий запит

"; } ?>

Ми скористаємося вбудованою функцією isset, яка повертає значення типу bool, і помістимо до неї масив $_POST. Логічне вираження у програмуванні дозволяє отримати нам або true, або false.

Отже, якщо функція повертає значення true, то форма була підтверджена, і нам потрібно продовжити виконання коду далі. Якщо ж функція повертає значення false , ми виведемо повідомлення про помилку. Збережіть весь набраний код у файлі search_submit.php.

Введіть пошуковий запит

"; } } } ?>

Ми вкладаємо ще одне умовне логічний виразвсередину основного, але цього разу ми використовуємо масив $_GET разом із значенням “ go”. Збережіть зміни у файлі search_go.php.

Тепер нам потрібно переконатися, що відвідувачі можуть вводити першу літеру в рядок запиту лише у верхньому або лише у нижньому регістрі. Нам також потрібно передбачити спосіб урахування критеріїв пошуку, запроваджених відвідувачем. Найкраще перевіряти введені відвідувачем дані за допомогою регулярного виразу:

Ми вкладаємо ще один умовний логічний вислів усередину наших двох. На цей раз ми використовуємо регулярний вираз для перевірки введення. Ми використовуємо вбудовану функцію preg_match з двома параметрами: регулярний вираз і поле форми, до якого повинна застосовуватися перевірка.

У нашому випадку це буде поле «Ім'я» ( name). Щоб отримати параметри пошуку, вказані відвідувачем, ми створюємо змінну $name, і прив'язуємо до неї значення POST з назвою поля форми, яке буде використовуватися в SQL-запиті . Зараз ми реалізували: (1) відправлення даних форми, (2) рядок запиту включає значення go і (3) відвідувач ввів або заголовну, або малу першу букву. І всі ці перевірки відбуваються ще до внесення змін до бази даних. Збережіть усі зміни.

Результати Connect, Select, Query та Return з таблиці бази даних

Щоб отримати дані з таблиці, спочатку у скрипті пошуку сайту потрібно підключитися до сервера. Для цього ми використовуємо наступний код:

", "") or die (" Я не можу підключитися до бази даних, оскільки: " . mysql_error()); else( echo "

Будь ласка, введіть пошуковий запит

"; } } }?>

Ми створюємо змінну $db і прив'язуємо її до вбудованої функції MySQL mysql_connect , яка приймає три параметри: сервер з базою даних ( localhost, якщо ви працюєте локально), логін та пароль.

Після цього ми запускаємо вбудовану PHP-функцію die, яка зупиняє подальше виконання коду, якщо немає з'єднання з базою даних. І виводимо інформацію про помилку, запускаючи вбудовану функцію MySQL mysql_error, яка поверне причину помилки. Збережіть файл search_connectdb.php.

Будь ласка, введіть пошуковий запит

"; } } } ?>

Створюємо змінну під назвою mydb і прив'язуємо її до вбудованої MySQL-функції mysql_select_db, а потім вказуємо назву бази даних, яку створили раніше. Далі ми опитуємо таблицю бази даних за допомогою SQL-запиту зі змінною name, де містяться параметри пошуку, введені відвідувачем:

Будь ласка, введіть пошуковий запит

"; } } } ?>

При опитуванні таблиці бази даних ми створюємо змінну $sql і прив'язуємо її до рядка, що містить SQL-запит . Ми використовуємо оператор SELECT для отримання значень зі стовпців id , а також імені та прізвища з таблиці contacts . Потім ми використовуємо інструкцію WHERE разом зі значеннями імені та прізвища, щоб звузити пошук.

Разом з оператором LIKEми використовуємо знак відсотка (%) – спецсимвол, який повертає 0 і більше символів, а також змінну назву з рядка пошуку. В результаті LIKE ( у поєднанні зі спецсимволом) знаходить будь-яке відповідне ім'я у таблиці бази даних. Можна описати весь процес так: « Ми вибираємо ім'я та прізвище з таблиці contacts, які відповідають введеним відвідувачем». Збережіть файл search_query.php.

Будь ласка, введіть пошуковий запит

"; } } } ?>

Ми створюємо змінну $result, і присвоюємо їй значення функції mysql_query(), вносячи її до $query. Тепер наш запит зберігається у змінній result. Щоб вивести результат у PHP, ми створюємо цикл, а потім виводимо дані в неупорядкованому списку:

n"; echo "

  • " . "
    • n"; echo "";)) else (echo"

    Будь ласка, введіть пошуковий запит

    "; } } } ?>

    Спочатку ми створюємо цикл while , всередині нього створюємо змінну під назвою row , і ініціалізуємо її значенням функції mysql_fetch_array , яка приймає змінну result , в якій знаходиться наш SQL-запит . Всередині циклу while ми присвоюємо кожному значення стовпця значення змінної з ідентичною назвою. Потім ми виводимо значення всередину неупорядкованого списку.

    Тут важливо звернути увагу на два моменти: (1) всередині циклу while не потрібно надавати значення змінним масиву row, так як значення можна брати безпосередньо з масиву row; (2) тег anchor , який ми використовуємо в назві нашого файлу разом із id та основним ключем. Причина цього полягає в тому, що багато пошукових елементів спочатку нічого не відображається.

    Так як ми показуємо тільки ім'я та прізвище, приписуючи ID в кінці нашого тега anchor , ми можемо використовувати ID для додаткового запиту, який дозволить вивести додаткову інформаціюпро персонал. Збережіть файл та протестуйте форму PHP пошуку по сайту ( search_display.php).

    Забираємо табуляцію

    Результати виводяться у вигляді невпорядкованого списку, але суть у тому, що нам не потрібна табуляція. Щоб позбутися від неї, додайте наступне CSS-правило на початок вашого файлу в head :

    Пошук за буквами

    Для пошуку по літерах знадобиться лише кілька додаткових рядків коду. Додамо цей зручний функціонал для відвідувачів. Таким чином, вони зможуть знаходити представників персоналу за літерами, що містяться у імені чи прізвищі.

    Додайте наступний рядок коду після тега form :

    A | B | K

    Ми прив'язуємо тег до рядка запиту з by за допомогою анкору, та встановлюємо його рівним певній літері. Щоб реалізувати функціонал пошуку за літерами, нам потрібно додати наступний код прямо після закривання фігурної дужки у вихідному скрипті, як показано нижче:

    )//Закінчення скрипту пошукової форми if(isset($_GET["by"]))( $letter=$_GET["by"]; //Підключення до бази даних $db=mysql_connect ("servername", "username") , "password") or die ("Я не можу підключитися до бази даних, тому що: " . mysql_error()); //-Виберіть базу даних $mydb=mysql_select_db("yourDatabase"); //-Запит до таблиці бази $sql="SELECT ID, FirstName, LastName FROM Contacts WHERE FirstName LIKE "%" . $letter . "%" OR LastName LIKE "%" . $letter ."%""; result=mysql_query($sql); //-Результати підрахунку $numrows=mysql_num_rows($result); echo "

    " .$numrows . " results found for " . $letter . "

    "; //-Запуск циклу та сортування результатів while($row=mysql_fetch_array($result))( $FirstName =$row["FirstName"]; $LastName=$row["LastName"]; $ID=$row[ "ID"]; //- Вивести результат у масиві echo "
      n"; echo "
    • " . "" .$FirstName . " " . $LastName . "
      • n"; echo "
    "; } }

    Тут ми змінили чотири фрагменти коду скрипту пошуку на сайті:

    • Ми використовуємо функцію isset(), і вносимо до неї масив $_GET, а потім перевіряємо значення by;
    • Створюємо змінну $letter та ініціалізуємо її значення масивом $_GET;
    • Додаємо змінну letter в SQL-запит;
    • Вказуємо змінну letter усередині виразу, в якому отримуємо підраховану кількість рядків.

    Збережіть файл search_byletter.php та перевірте результат.

    Пошук певного співробітника

    Щоб відобразити інформацію про решту персоналу, яка передається через унікальний id всередині нашого посилання, потрібно додати наступний код прямо після закривання фігурної дужки у скрипті letter , як показано нижче:

    )//Закінчення скрипту if(isset($_GET["id"]))( $contactid=$_GET["id"]; //Підключення до бази даних $db=mysql_connect ("servername", "username", " password") or die ("Я не можу підключитися до бази даних, тому що: " . mysql_error()); //-select the database to use $mydb=mysql_select_db("yourDatabase"); //- Запит до таблиці бази даних $sql="SELECT * FROM Contacts WHERE ID=" . $contactid; //- Запустити запит до функції mysql_query() $result=mysql_query($sql); //- Запуск циклу та сортування результатів while($row=mysql_fetch_array ($result))( $FirstName =$row["FirstName"]; $LastName=$row["LastName"]; $PhoneNumber=$row["PhoneNumber"]; $Email=$row["Email"]; //- Вивести результат у масиві echo "

    "; } }

    Тут ми змінили чотири фрагменти коду:

    • Ми використовуємо функцію isset(), і з її допомогою перевіряємо значення ID в масиві $_GET;
    • Створюємо змінну $contactid та ініціалізуємо її масивом $_GET;
    • У таблиці виділяємо все, що зазначено зірочкою *. Зірочка - це скорочене позначення в SQL, яке означає « дайте мені всі стовпці та рядки з таблиці». Щоб визначити, яку інформацію виводити, ми згадуємо змінну contactid в кінці SQL-виразу;
    • Виводимо додаткову інформацію про кожного представника персоналу.

    Збережіть файл search_byid.php та перевірте результат.

    Зверніть увагу, що наш функціонал працює так, як і належить. При введенні імені або прізвища в поле або при виборі літери як гіперпосилання відображаються лише імена представників персоналу. Якщо навести курсор на посилання, у рядку статусу можна побачити унікальний ID . Якщо натиснути на конкретну людину, то адресний рядок зміниться, і з'явиться додаткова інформація про цього співробітника.

    SQL-ін'єкція

    Причина, через яку ми додали в наше поле пошуку регулярне вираження, полягає в тому, щоб ніхто не зміг втрутитися в наш SQL-запит. Раніше ця проблема була поширена, і хакери примудрялися проводити власні SQL-запити, маніпулюючи при цьому додатком. Наприклад, якби ми дозволили використовувати апостроф у нашому полі, то хакер міг би просто видалити базу даних, використовуючи запит:

    "DROP TABLE

    Як вже було зазначено, регулярне вираження гарантує, що як перший символ відвідувач може вводити лише літери в нижньому або верхньому регістрі.

    На завершення

    У сьогоднішній статті ми розглянули, як зробити пошук по сайту, а також:

    • Створювати бази даних та відповідні таблиці;
    • використовувати інструменти для управління базами даних, створювати стовпці та вводити дані;
    • Розробляти форми пошуку на основі PHP, яка вміє здійснювати перевірку даних, наявність змінних у запиті, а також з'єднуватися з базою даних і виводити результати з таблиці;
    • Як захистити програму та базу даних від SQL-ін'єкцій.

    Використовуючи знання, отримані з цієї статті, ви зможете легко модифікувати чужий код, а також при необхідності розширювати функціонал форми пошуку.

    Дана публікація є перекладом статті « How to Create a Search Feature with PHP and MySQL» , підготовленою дружною командою проекту

    Від автора:вітаю вас друзі. У цій статті ми продовжимо реалізацію живого пошуку для сайту. Що таке живий пошук? Ви з ним стикаєтесь постійно, коли щось шукаєте у Гуглі чи Яндексі. Як тільки ви починаєте набирати пошуковий запит, пошуковик відразу починає пропонувати вам варіанти, з яких вам залишається лише вибрати найбільш підходящий. Зручна штука, чи не так? Спробуємо і ми продати щось подібне.

    Вихідні файли поточної статті ви можете завантажити на . Першу частину статті ви можете знайти за .

    Отже, в першій частині ми підготували базу даних, яка буде використана для живого пошуку, а також прикрутили віджет бібліотеки jQuery UI Autocomplete до поля пошуку на нашій сторінці. Поки що віджет працює із тестовими даними, але зараз ми з вами це виправимо.

    Насамперед вкажемо для віджету інше джерело даних, це буде, скажімо, файл search.php, який нам необхідно також створити.

    $(function()( $("#search").autocomplete(( source: "search.php", )); ));

    Тепер наберу будь-який символ у полі пошуку та подивлюся, що відбувається при цьому в консолі браузера.

    Як бачимо, відправляється GET запит із параметром term, значенням якого є рядок, набраний у полі пошуку. У цьому відбувається асинхронно, без перезавантаження сторінки, тобто. використовується AJAX.

    Відмінно, тепер залишається лише прийняти пошуковий запит і видати відповідь на нього. Для цього потрібно організувати підключення до сервера БД та написати нескладний код, який отримує дані з БД на запит. Код файлу search.php буде приблизно таким:

    $db = mysqli_connect("localhost", "root", "", "world") or die("Немає з'єднання з БД"); mysqli_set_charset($db, "utf8") or die("Не встановлено кодування з'єднання"); /** * пошук автокомпліт **/ function search_autocomplete()( global $db; $search = trim(mysqli_real_escape_string($db, $_GET["term"]))); %($search)%" LIMIT 10"; $res = mysqli_query($db, $query); $result_search = array(); => $row["Name"]); ) return $result_search; ) if(!empty($_GET["term"]))( $search = search_autocomplete(); exit(json_encode($search)); )

    $ db = mysqli_connect ("localhost", "root", "", "world") or die ( "Немає з'єднання з БД") ;

    mysqli_set_charset ($ db, "utf8") or die ( "Не встановлено кодування з'єднання") ;

    * пошук автокомпліт

    function search_autocomplete () (

    global $db;

    $ search = trim ( mysqli_real_escape_string ( $ db , $ _GET [ " term " ] ) ) ;

    $res = mysqli_query ($db, $query);

    $result_search = array();

    while ($ row = mysqli_fetch_assoc ($ res)) (

    $result_search = array ("label" => $row["Name"]);

    return $result_search;

    if (! empty ($ _GET [ "term" ] ) ) (

    $search = search_autocomplete();

    exit (json_encode ($search));

    Зверніть увагу, функція search_autocomplete, яка і отримує дані на запит, повинна повертати ці дані у певному форматі, це має бути масив з ключами label та значеннями знайдених міст. Після виклику функції дані необхідно перетворити на формат JSON.

    Залишається перевірити роботу нашого живого пошуку. Для цього, як і минулого разу, наберемо лише одну літеру — a:

    Чудово! У відповідь ми отримали десяток міст, у назві яких трапляється введена літера. Якщо продовжимо набирати назву, список варіантів буде змінюватися, тобто. з кожною літерою надсилатиметься новий запит AJAX.

    Основні завдання:

    • реалізувати пошук таким чином, щоб після введення пошукового запиту в рядок нижче цього рядка з'явилися результати пошуку
    • запит на отримання результату має відбуватися лише після закінчення введення пошукового запиту

    Окей, поїхали!

    Зразкова верстка самого блоку з пошуковим рядком і div-ником, куди додаватимемо результати пошуку:

    Т.к. пошук доступний у шапці сайту, додамо відповідні скрипти пошуку та стилізації результатів:

    //Підрубуємо пошук: $APPLICATION->AddHeadScript("/search/ajax_search.js"); $APPLICATION->AddHeadScript("/search/jquery.mCustomScrollbar.js"); $APPLICATION->SetAdditionalCSS(SITE_TEMPLATE_PATH . "/css/ajax_search.css"); $APPLICATION->SetAdditionalCSS(SITE_TEMPLATE_PATH . "/css/jquery.mCustomScrollbar.min.css");

    Тепер подивимося, що лежить у нашому ajax_search.js:

    Function get_result ()( //очищаємо результати пошуку $("#search_result").html(""); //поки не отримали результати пошуку - відобразимо прелоадер $("#search_result").append("

    "); $.ajax(( type: "POST", url: "/search/ajax_search.php", data: "q="+q, dataType: "json", success: function(json)( //очистимо прелоадер $("#search_result").html(""); $("#search_result").append("
    "); //додаємо кожен елемент масиву json всередину div-ника з class="live-search" (верстку можете використовувати свою) $.each(json, function(index, element) ( $("#search_result").find (".live-search").append(" "+element.TITLE+""+element.BODY_FORMATED+""); //console.log (element.BODY_FORMATED); )); //стилізуємо скролінг $(".live-search").mCustomScrollbar(( scrollInertia: 500 )); ) )); ) var timer = 0; var q = ""; $(document).ready(function() ( $("#q").keyup(function() ( q = this.value; clearTimeout(timer)); ; ));$("#reset_live_search").click(function() ( $("#search_result").html(""); )); ));

    keyup функція здійснюємо виклик функції get_result(), яка власне і заповнює div-нік з id="search_result" за аяксом.

    mCustomScrollbar – це просто виклик стилізації (можете вимкнути).

    Дані /search/ajax_search.php ми отримуємо у форматі JSON.

    З JS складовою все зрозуміло, тепер подивимося, що відбувається в ajax_search.php:

    Search(array("QUERY" => $q, "SITE_ID" => LANG, "MODULE_ID" => "iblock", "CHECK_DATES" => "Y", "PARAM2" => "8")); $result = array(); while ($res = $obSearch->GetNext())( $id = $res["ITEM_ID"]; //якщо знайшли розділ: if (strripos($id, "S")!==false)( $result_item ["TITLE"] = $res["TITLE"]; $result_item["URL"] = $res["URL"]; $result_item["BODY_FORMATED"] = $res["TITLE_FORMATED"]; $result = $ result_item; ) //якщо S-ки немає, то else( $result_item["TITLE"] = $res["TITLE"]; $result_item["URL"] = $res["URL"]; $result_item[" BODY_FORMATED"] = $res["BODY_FORMATED"]; $result = $result_item; ) ) echo json_encode($result); ) ?>

    У разі пошук здійснюється методом Search Бітриксового класу CSearch. У PARAM2 пишемо у якому інфоблоці шукаємо. Результати пошуку запихаємо в масив $result. Зверніть увагу, що $res['ITEM_ID'] може бути як елемент, так і розділ. Залежно від того, що знайшли, $result_item['BODY_FORMATED'] пишаємо або назву розділу, або шматок тексту зі знайденого елемента інфоблоку.

    Найкращий спосіб утримати користувача на сайті, це дозволити йому знайти те, що він шукає. Якщо ви робите для цього зручну систему, то рівень переваги вашого сайту зростатиме і користувач обов'язково повернеться для того, щоб знайти те, що його цікавить.

    Я вам покажу як створити просту, але ефективну за функціоналом пошукову форму, яка буде використовуватися для пошуку статей на сайті. Результати будуть з'являтися на сторінці без жодних перезавантажень, що, безперечно, є найкращим способом подачі інформації.

    Я створю 2 файли: search.php, який буде містити HTML і JavaScript. Другий файл do_search.php буде містити PHP код. Приступимо до створення першого файлу:

    PHP, jQuery search demo

    Спробуйте ввести слово ajax


    Результати для

    У цьому файлі ми створили звичайну HTML форму, яка посилає POST запит у бек енд – файлу do_search.php.

    select_list($sql); if(count($row)) ( $end_result = ""; foreach($row as $r) ( $result = $r["title"]; $bold = " " . $word . "$end_result .= "

  • " . str_ireplace($word, $bold, $result) . "
    • "; ) echo $end_result; ) else ( echo "
  • На ваш запит нічого не знайдено
    • "; } } ?>

    PHP-код містить коментарі, за якими ви з легкістю зможете зрозуміти роботу скрипта. Якщо базі даних знайшлися збіги, ви показуєте їх вашому користувачеві, виділяючи жирним ті слова, які шукав користувач.

    Надамо цьому трохи CSS:

    Body( font-family:Arial, Helvetica, sans-serif; ) *( margin:0;padding:0; ) #container ( margin: 0 auto; width: 600px; ) a ( color:#DF3D82; text-decoration: none ) a:hover ( color:#DF3D82; text-decoration:underline; ) ul.update ( list-style:none;font-size:1.1em; margin-top:10px ) ul.update li( height:30px; border-bottom:#dedede solid 1px;text-align:left;) top:20px;text-align:left; ) #searchresults ( text-align:left; margin-top:20px; display:none; #000; ) .word ( font-weight:bold; color:#000000; ) #search_box ( padding:4px; border:solid 1px #666666; border-radius: 6px;-webkit-border-radius: 6px; ) .search_button ( border:#000000 solid 1px; padding: 6px; color:#000; border-radius: 6px;-webkit-border-radius: 6px;) .found ( font-weight: bold; font-style: italic; color: #ff0000; ) h2 ( margin-right: 70px; )

    Ось ви й навчилися створювати найпростішу пошукову форму, яка працює без перезавантаження сторінки. Сподіваюся, урок вам сподобався.

    Вибір редакції

    © 2023 androidas.ru - Все про Android