Поправка формы поиска

@MMDance · Регистрация: 27.09.2013

Студворк — интернет-сервис помощи студентам

Ребя, помогите.Вот у меня есть форма поиска

PHP
1
2
3
4
5
6
echo '<div class="wmenu">
           <FORM METHOD=POST ACTION="/search">
    <INPUT TYPE="text" NAME="query">
    <INPUT CLASS="button" TYPE="submit" NAME="but" value="ПОИСК">
            </FORM>
</div>';

я хотел заточить эту форму под TOUCH дизайн...
вот к примеру как я делал с другими ссылками

PHP
1
echo '<div class="alink"><div class="linkt"><a href="/album"><div class="sub"><img src="/style/images/album.png" alt="Статья" /> Все альбомы &rarr; ['.$total_albums.']</div></div></a></div>';

последнйи пример рабоатет, тоесть вся строка кликабельна.А от с поиском не могу, так как там не <a href и не </a> можно что-то сделать?тоесть чтобы вся форма была кликабельной и выполняла функцию поиска?

@gund · 23.10.2013, 00:29

Если я правильно понял, то нужно сделать всю форму кликабельной. Можно повесить событие onClick() на всю форму, но тогда есть вероятность что по нажатию на текстовое поле оно тоже будет срабатывать, поэтому Вам нужно попробовать, если не получиться будем тогда думать =)

@MMDance · 23.10.2013, 08:35 **[ТС]**

Сообщение от gund

Если я правильно понял, то нужно сделать всю форму кликабельной. Можно повесить событие onClick() на всю форму, но тогда есть вероятность что по нажатию на текстовое поле оно тоже будет срабатывать, поэтому Вам нужно попробовать, если не получиться будем тогда думать =)

Да, вы правильно поняли..но я не знаю как это сделать, то чт овы написали.я самоучка..занимаюсь не долго..с этим не сталкивался(если можете то напишите пожалуйста готовый код на моём примере

KOPOJI · 23.10.2013, 09:38

так может лучше использовать "живой" поиск с помощью аякса и onkeyup ?

@MMDance · 23.10.2013, 09:51 **[ТС]**

Сообщение от KOPOJI

так может лучше использовать "живой" поиск с помощью аякса и onkeyup ?

у меня сайт для смартфонов..не знаю удобно ли будет пользователям так, и будет ли нормально всё..не знаю.просто весь сайт адаптирован под смарфтоны,все ссылки тач (TOUCH) вот и хотел поиск сделать тоже под тач.

KOPOJI · 23.10.2013, 09:53

ну я даже не знаю, удобно ли. Вот скажите, гугловский поисковик удобный? А на яндексе подсказка аяксом подгружается, удобно ли это?

@MMDance · 23.10.2013, 12:27 **[ТС]**

Сообщение от KOPOJI

ну я даже не знаю, удобно ли. Вот скажите, гугловский поисковик удобный? А на яндексе подсказка аяксом подгружается, удобно ли это?

Мне бы просто нужно кнопку Найти! преобразовать в ссылку,но чтобы действие осталось конечно же..а из сылки я уже сделаю всё что нужно.

@gund · 23.10.2013, 13:58

Сообщение от MMDance

нужно кнопку Найти! преобразовать в ссылку,но чтобы действие осталось конечно же

Тогда это элементарно, нужно поставить на ссылку событие и вызвать сабмит формы.
Приблизительно так:

HTML5
1
2
3
4
5
6
7
<div class="wmenu">
    <FORM name="search_form" METHOD=POST ACTION="/search">
    <INPUT TYPE="text" NAME="query">
    <INPUT CLASS="button" TYPE="submit" NAME="but" value="ПОИСК">
    <a href="javascript://" onclick="document.forms.search_form.submit()">ПОИСК</a>
            </FORM>
</div>

Таким образом ссылка сама по себе не рабочая, а событие по клику вызовет сабмит формы поиска.
Почитайте об объекте document, много полезного узнаете.
З.Ы. я тоже самоучка, просто уже более 2-ух лет этим занимаюсь =)

@MMDance · 23.10.2013, 14:24 **[ТС]**

Сообщение от gund

Тогда это элементарно, нужно поставить на ссылку событие и вызвать сабмит формы.
Приблизительно так:

HTML5
1
2
3
4
5
6
7
<div class="wmenu">
    <FORM name="search_form" METHOD=POST ACTION="/search">
    <INPUT TYPE="text" NAME="query">
    <INPUT CLASS="button" TYPE="submit" NAME="but" value="ПОИСК">
    <a href="javascript://" onclick="document.forms.search_form.submit()">ПОИСК</a>
            </FORM>
</div>

Таким образом ссылка сама по себе не рабочая, а событие по клику вызовет сабмит формы поиска.
Почитайте об объекте document, много полезного узнаете.
З.Ы. я тоже самоучка, просто уже более 2-ух лет этим занимаюсь =)

Заменил код на ваш..увы не ищет по введённым буквам

@gund · 23.10.2013, 18:38

Сообщение от MMDance

не ищет по введённым буквам

Ну оно и не должно искать по буквам, я просто ссылку, которая может сабмитить форму.
Если Вам нужен живой поиск (как Google, к примеру), то используйте Ajax.

KOPOJI · 23.10.2013, 19:09

я уже говорил, по введенным буквам, т.е., живой поиск, надо делать с помощью аякса и onkeyup.

Не по теме:

2 года уже занимаетесь, но до сих пор пишете теги заглавными буквами?

@MMDance · 23.10.2013, 19:15 **[ТС]**

Сообщение от gund

Ну оно и не должно искать по буквам, я просто ссылку, которая может сабмитить форму.
Если Вам нужен живой поиск (как Google, к примеру), то используйте Ajax.

я в этом не понимаю увы...эту то форму вытащил из другова скрипта..настроил кое как...а вы мне такое предлогаете..если бы мог, я бы здесь не просил)))Вот жду пока помогут чем то...живой поиск для смартфонов не удобно для многих,особенно для тех у кого маленькое разрешение к примеру 320*480 .мне нужен выход...вместо формы кнопки чтобы ссылка была но форма ввода слов оставалась...не раз видел,значит реально сделать.

Добавлено через 1 минуту

Сообщение от KOPOJI

я уже говорил, по введенным буквам, т.е., живой поиск, надо делать с помощью аякса и onkeyup.

Не по теме:

2 года уже занимаетесь, но до сих пор пишете теги заглавными буквами?

попробывать конечно можно было бы, хотя не уверен что это удобно со смартфона старенького...да и попробывать не могу..я не смогу такое сделать(увы(

KOPOJI · 23.10.2013, 19:45

Ну вы тогда определитесь, чего хотите, а то вы хотите использовать "поиск по буквам", но тут же говорите, что это неудобно со смартфонов (кстати, у меня смартфон, но мне удобен живой поиск), а пример с ссылкой-кнопкой вам привели..

@MMDance · 23.10.2013, 20:17 **[ТС]**

Сообщение от KOPOJI

Ну вы тогда определитесь, чего хотите, а то вы хотите использовать "поиск по буквам", но тут же говорите, что это неудобно со смартфонов (кстати, у меня смартфон, но мне удобен живой поиск), а пример с ссылкой-кнопкой вам привели..

Ну х.з. если бы проверил работу наглядно то может и пригодилось бы..но факт остаётся фактом я этого не смогу сделать увы..а атк как вариант конечно подошёл бы наверно

@gund · 23.10.2013, 20:42

Сообщение от KOPOJI

2 года уже занимаетесь, но до сих пор пишете теги заглавными буквами?

Нет, ну Вы что =)
Я просто скопипастил пример топикстартера чтобы не переписывать по несколько раз.

KOPOJI · 23.10.2013, 21:06

Сообщение от MMDance

HTML5
1
<INPUT TYPE="text" NAME="query">

заменяете на

HTML5
1
<input type="text" name="query" id="search_query">

где-то размещаете блок для ответа, например, такой

HTML5
1
<div id="ajax_answer"></div>

Для простоты напишу пример с jquery:
1. подключаете библиотеку jquery

HTML5
1
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>

2. добавляете внутри еще одного <script> в секции head код

JavaScript
1
2
3
4
5
6
7
8
9
$(function() {
    $("#search_query").keyup(function() {
        if( $.trim( $(this).val() ).length < 3 )
            return ;
        $.post("./file.php", {q: $(this).val()}, function(answer) {
            $("#ajax_answer").html(answer)
        })
    })
})

3. создаете отдельный php-файл для обработки полученного запроса, в нем обрабатываете $_POST['q'], ответ выводите через echo.
Как-то так..

@sKotenok · 23.10.2013, 22:56

Вопросу место скорее в разделе JavaScript, если ТС там поищет - уже я только раз 5 на вопросы по ajax-у отвечал

(и с jquery и без).
По теме: зачем делать текстовый инпут кликабельным, если у него есть событие onfocus? (событие срабатывает и при клике с тача в т.ч.).
Если хотите обработать клик по ВСЕМУ диву - что вам мешает? (не забыть добавить stopPropagation в события вложенных элементов, иначе будет реагировать по клику на всём, что внутри дива).

KOPOJI, не всё так хорошо с jquery на мобильных браузерах, но именно данный пример должен работать на современных смартфонах/планшетах. (в opera-mini и многих старых - не заведётся точно).

KOPOJI · 23.10.2013, 23:11

Не по теме:

sKotenok, на чистом js писать больше кода. Да я это и указал, в принципе

Сообщение от KOPOJI

Для простоты напишу пример с jquery

Ну а те, кто хочет на чистом - вперед, благо источников полно. Пожалуй, самый хороший - http://xmlhttprequest.ru

Новые блоги и статьи Все статьи Все блоги /
Уведомление о неверно выбранном значении справочника Maks 06.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "НарядПутевка", разработанного в конфигурации КА2. Задача: уведомлять пользователя, если в документе выбран неверный склад. . .	Установка Qt Creator для C и C++: ставим среду, CMake и MinGW без фреймворка Qt 8Observer8 05.04.2026 Среду разработки Qt Creator можно установить без фреймворка Qt. Есть отдельный репозиторий для этой среды: https:/ / github. com/ qt-creator/ qt-creator, где можно скачать установщик, на вкладке Releases:. . .	AkelPad-скрипты, структуры, и немного лирики.. testuser2 05.04.2026 Такая программа, как AkelPad существует уже давно, и также давно существуют скрипты под нее. Тем не менее, прога живет, периодически что-то не спеша дополняется, улучшается. Что меня в первую очередь. . .	Отображение реквизитов в документе по условию и контроль их заполнения Maks 04.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеСпецтехники", разработанного в конфигурации КА2. Данный документ берёт данные из другого нетипового документа. . .
Фото всей Земли с борта корабля Orion миссии Artemis II kumehtar 04.04.2026 Это первое подобное фото сделанное человеком за 50 лет. Снимок называют новым вариантом легендарной фотографии «The Blue Marble» 1972 года, сделанной с борта корабля «Аполлон-17». Новое фото. . .	Вывод диалогового окна перед закрытием, если документ не проведён Maks 04.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: реализовать программный контроль на предмет проведения документа. . .	Программный контроль заполнения реквизитов табличной части документа Maks 02.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: 1. Реализовать контроль заполнения реквизита. . .	wmic не является внутренней или внешней командой Maks 02.04.2026 Решение: DISM / Online / Add-Capability / CapabilityName:WMIC~~~~ Отсюда: https:/ / winitpro. ru/ index. php/ 2025/ 02/ 14/ komanda-wmic-ne-naydena/

@gund 18 / 18 / 4 Регистрация: 05.05.2013 Сообщений: 88
	23.10.2013, 00:29
	Если я правильно понял, то нужно сделать всю форму кликабельной. Можно повесить событие onClick() на всю форму, но тогда есть вероятность что по нажатию на текстовое поле оно тоже будет срабатывать, поэтому Вам нужно попробовать, если не получиться будем тогда думать =) 0

KOPOJI Почетный модератор 16844 / 6724 / 880 Регистрация: 12.06.2012 Сообщений: 19,967
	23.10.2013, 09:38
	так может лучше использовать "живой" поиск с помощью аякса и onkeyup ? 0

KOPOJI Почетный модератор 16844 / 6724 / 880 Регистрация: 12.06.2012 Сообщений: 19,967
	23.10.2013, 09:53
	ну я даже не знаю, удобно ли. Вот скажите, гугловский поисковик удобный? А на яндексе подсказка аяксом подгружается, удобно ли это? 0

KOPOJI Почетный модератор 16844 / 6724 / 880 Регистрация: 12.06.2012 Сообщений: 19,967
	23.10.2013, 19:09
	я уже говорил, по введенным буквам, т.е., живой поиск, надо делать с помощью аякса и onkeyup. Не по теме: 2 года уже занимаетесь, но до сих пор пишете теги заглавными буквами? 0

KOPOJI Почетный модератор 16844 / 6724 / 880 Регистрация: 12.06.2012 Сообщений: 19,967
	23.10.2013, 19:45
	Ну вы тогда определитесь, чего хотите, а то вы хотите использовать "поиск по буквам", но тут же говорите, что это неудобно со смартфонов (кстати, у меня смартфон, но мне удобен живой поиск), а пример с ссылкой-кнопкой вам привели.. 0

@sKotenok 363 / 334 / 38 Регистрация: 29.03.2011 Сообщений: 838
	23.10.2013, 22:56
	Вопросу место скорее в разделе JavaScript, если ТС там поищет - уже я только раз 5 на вопросы по ajax-у отвечал (и с jquery и без). По теме: зачем делать текстовый инпут кликабельным, если у него есть событие onfocus? (событие срабатывает и при клике с тача в т.ч.). Если хотите обработать клик по ВСЕМУ диву - что вам мешает? (не забыть добавить stopPropagation в события вложенных элементов, иначе будет реагировать по клику на всём, что внутри дива). KOPOJI, не всё так хорошо с jquery на мобильных браузерах, но именно данный пример должен работать на современных смартфонах/планшетах. (в opera-mini и многих старых - не заведётся точно). 0