Свой сайт знакомств #13: фильтрация без кнопки, из COOKIE в POST на JavaScript, PHP, HTML, Bootstrap

Добрый день, дорогие подписчики! Рад вас приветствовать на новой серии проекта "Свой сайт знакомств", где мы с вами в режиме реального времени разрабатываем свой дейтинг-сервис. В одной из прошлых серий мы с вами реализовали форму для поиска, сделали футер, и у нас, соответственно, это всё сейчас работает, но работает не так, как хотелось бы. Почему? Да потому что такой формат, в принципе, не очень-то и удобен. То есть для того, чтобы нам найти анкеты по каким-то параметрам, нам, во-первых, нужно задать вот эти параметры, и потом нажать на кнопочку "Поиск". Это всё огорчает. Поэтому что? Поэтому попробуем мы сегодня упростить этот процесс, избавиться от кнопочки "Поиск" и попытаемся привязаться к каждому из пунктов, грубо говоря, чтобы при изменении вот этой вот анкеты, да, у нас с вами появлялись при изменении каждого поля вот этой анкеты, чтобы не анкеты, а фильтров, у нас автоматически происходили изменения вот в этом списке найденных анкет. Давайте попробуем это реализовать. Так, это у нас... Что это у нас? Страничка "Поиск", да? Насколько я понимаю, для того чтобы это реализовать, нам, скорее всего, придётся сейчас избавиться от POST-запросов и передавать всю информацию при помощи куков, либо же мы попробуем наши вот эти вот куки в POST-запросы, что, в принципе, то... Ну, поскольку код есть, он рабочий. Вот, давайте попробуем это сделать так, посмотрим, как оно получится вообще, что-нибудь получится ли. Скажу честно, это вот экспериментальное, наверное, видео, что я ни разу не перекидывал данные из куков в POST-запросы. Вот интересно, даже что получится и получится ли. Ну, если не получится, мы просто можем что сделать? Просто можем всё переделать на куки. Ну честно скажу, код переписывать не хочется один и тот же по несколько раз, поэтому попробуем пойти более простым способом и перекинуть всё в куки. Так, хорошо, отступ мы поставили. Так, давайте займёмся, наверное, сначала первым переключателем. Где он у нас есть? Вот, у нас есть поиск. Так, поиск. Я что хочу? Я сейчас хочу передать некую информацию в куки и чтобы она, соответственно, отображалась уже у нас на страничке. Так, где у нас первый фильтр? Первый фильтр, пам-пам-пам, где же он? Вот, у нас первый фильтр, вот он тут. Это у нас возраст. Сюда что мы попробуем сделать? Давайте мы попробуем с вами прописать onChange, наверное, так, onChange и попробуем вызвать какую-то функцию на JavaScript. Вот, например, я написал alert, посмотрим при изменении вот возраста будет ли что-то происходить. Да, то есть я, видите, передвинул наш указатель, у нас появляется, значит, вот как раз-таки единичка. Дальше что? Угу. Значит, нам можно написать сейчас функцию, которая бы вызывалась при нажатии... ой, при изменении вот этого нашего пункта. Так, скрипт идём дальше. Давайте вот этот наш alert... Так, что я сделал? Я сейчас напишу function, function. Ага, всё. И давайте напишем название функции. Это у нас что? Функция будет у нас с вами задавать возраст. Пускай пока называется "возраст". Возраст я какой-то параметр, конечно же, должен внутри передать. Но давайте мы просто закинем туда alert 1 и посмотрим, как это всё будет отрабатывать. onChange alert. Ага, тут я должен вызвать функцию возраст, возраст. Угу. Так, сохраняем. Давайте я обновлю страничку. А ничего не происходит. Почему? Неужели функция не вызывается? Я же возраст вызываю. Да. Очень... ещё раз сохранились, обновляю страничку. Да, alert не вызывается. А до этого он вызывался. Может быть, в одинарных кавычках попробуем сделать тоже. Не отрабатывает. Так, где может быть ошибка? У нас же точно где-то есть. Ещё раз, не вызывается. Посмотрим, как описываются функции на JavaScript вообще. В принципе, такая функция должна вызываться. Тут ничего такого сверхъестественного нету. Точка с запятой поставил. Давайте я готовый пример функцию возьму и пропишу просто showMess. Соответственно, при изменении. Где ошибаюсь, непонятно. Да, всем привет пишется. Окей. Так, а нам нужно что? Нам нужен возраст. Также указываю возраст. Ага. Так, обновляю страничку. А возраст не отрабатывает. Неужели проблема в нейминге? Давайте возрастGS попробуем. Обновляю страничку. Да, так она вызывается. А в идеале что? В идеале у нас вот эта функция должна получить значение из вот этого вот поля возраст и передать его, а соответственно в PHP передать в PHP и, наверное, трансформировать в POST-запрос. Вот, давайте мы с вами это попробуем сделать. То есть для того, чтобы хранить информацию в куках, мы что должны сделать? Давайте document напишем, document. Тут у нас дальше слово cookie должно появиться, cookie. И тут вот мы давайте с вами проще как раз-таки, чтобы мы переменной возраст, угу, задали значение. Так, плюсик ставлю, поскольку по умолчанию это у нас с вами строчки, я буду таким образом писать. Мы что? Мы должны передать какой-то параметр. Так, захватить. Так, поскольку у нас с вами есть... Да, так давайте попробуем получить какое-то значение, например, в это у нас с вами будет возраст. Вот такой вот. Точка... давно на JavaScript ничего не писал, но я думаю, должно получиться. Так, возраст, вами е. Давайте выведем alert вот эту вот нашу при изменении. Всё сохраняем. Се. Обновляю страничку. Нет, ничего не происходит. Где-то допустил ошибку. Так, давайте посмотрим. Так, получить значение in по... А, всё. Так, getElementById — это по идентификатору, а нам нужно с вами искать, получается, по классу. Но мы, в принципе, можем и идентификатор же накинуть, правильно? Вот, давайте мы тогда сделаем byId, и у него уже мы соответственно передадим value. Вот, выхватил таким вот образом. Так, getElementById. ID будет в точности такой же. То есть это ID у нас будет возраст. Всё, пробуем таким вот образом. Так, UE на конце ставится, честно не помню. Так, пробуем тогда. Обновляем страничку. Тоже ничего не происходит. Ну как так? Как же так? Так, хорошо, просто мы тогда выведем alert в самом начале и посмотрим, вообще что происходит. Что-то должно происходить. Я прямо уверен в этом. Если ничего не происходит, то это плохо. Так, сохраняем. Обновляем страничку. 44, 95, значение мы с вами получаем. Так, дальше что? Давайте попробуем упростить. То есть можно... Да, давайте также let укажем V, и мы в V записываем значение нашего value вот этого возраста. Дальше что? Дальше я также попрошу вывести нашу V. Угу. Обновляемся. Раз. 40, 91, 22. Замечательно, параметры мы получили. Значит, дальше что? А дальше мы можем с вами записать, а вот в это POST-значение, как раз-таки, тот параметр, который мы с вами уже получили. То есть дальше пойдёт такая смесь PHP-скрипта. Конечно, так лучше, наверное, не делать, если бы мы более логично подходили к проектированию наших структур, да и вообще знали бы, что мы изначально пишем, то, наверное, мы бы использовали... Ну, в общем, не перегоняли бы значение из куков в POST-запрос, но мы это делаем. Поэтому... А нет, я же не записал их ещё. Да, я же не записал это значение. Так, правильно я скопировал? Нет, я не то скопировал. Так, нам, значит, нужно записать вот это вот значение в куки, которое мы с вами получили. До. Замечательно. Дальше что? Дальше мы прописываем куки, куки. Так, в куки у нас что должно быть? У нас должен быть параметр возраст, и он должен равняться... Сейчас скажу, чему он должен равняться. Вот как раз-таки вот этому значению value или просто... В давайте просто сначала запишем, посмотрим, как идёт функционирование всего вот этого. Так, и тут возраст мы уже перегоняем вот таким вот образом. Так, зажимаю. Угу. Сохраняю всё. А, ну нет. И давайте мы на всякий случай выведем на экран значение уже нашего POST-запроса. Вообще будет ли он функционировать? Интересно даже самому стало. Так, обновляю страничку, нажимаю. Нет, ничего не происходит. А почему ничего не происходит? Потому что, наверное, мы что сделали? Мы не обновили с вами саму страницу. Вот, давайте в самом конце напишем location точка, чтобы перезагрузить страничку. Так, подзапрос, кстати, можно вынести чуть выше, он всё равно не будет отрабатывать одновременно. Да, вот то есть мы задали, потом перезагрузись, и только потом у нас отработает вот эта штука. Замечательно. Обновляю страничку. Так, 56. Нет. Ещё раз. 9. А при обновлении страницы она у нас работает. Почему только у нас не запускается, а перезагрузка самой странички всё же автоматически должна задаваться? Так, да посмотрим, перезагрузить страницу JS. Ну вот, мед location, да? Или rel? Неужели неправильно написал? Да, я написал с ошибкой. Так, ни, вот 26, 84, 67, 28, 20 и так далее.

соответственно это всё сейчас работает но работает не так как хотелось бы Почему Да потому что такой Фор принципе не очень-то и удобно то есть для того чтобы нам найти анкеты по каким-то параметрам нам во-первых нужно задать вот эти параметры и потом нажать на

кнопочку поиск это всё огорчает поэтому что поэтому попробуем мы сегодня упростить этот процесс избавиться от кнопочки поиск вот и попытаемся привязаться каждому из пунктов грубо говоря чтобы при изменении вот этой вот анкеты Да у нас с вами появлялись

при изменении каждого поля вот этой анкеты чтобы не анкеты а фильтров у нас автоматически происходили изменения вот в этом списке найденных анкет Давайте попробуем это реализовать Так это у нас Что это у нас страничка поиск да насколько я понимаю для того

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

вот Давайте попробуем это сделать так посмотрим как оно получится вообще что-нибудь получится ли скажу честно это вот экспериментальное наверное видео что я ни разу не перекидывать данные из куков в пост запросы вот интересно даже что получится и получится ли Ну если не

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

поставили так Давайте займёмся наверно сначала первым переключателем где он у нас есть вот у нас есть поиск так поиск я что хочу я сейчас хочу передать некую информацию в ки и чтобы она соответственно отображалась уже у нас на страничке Так

где у нас первый фильтр первый фильтр пам-пам-пам где же он вот у нас первый фильтр вот он тут это у нас возраст сюда что мы попробуем сделать давайте мы попробуем с вами прописать on change наверное так on change и попробуем вызвать какую-то

функцию на Ява скрипте Вот например я написал Alert посмотрим при изменении вот возраста Будет ли что-то происходить да то есть я видите передвинул наш указатель у нас появляется значит вот как раз-таки единичка дальше что угу Значит нам можно написать Сейчас

функцию которая бы вызывалось при нажатии Ой при изменении вот этого нашего пункта так скрипт идём дальше Давайте вот этот наш Арт Так что я сделал Я сейчас напишу ш так tion tion Ага всё и Давайте напишем название функции это у нас что функция

будет у нас с вами задавать возраст Пускай пока называется возраст возраст я какой-то параметр конечно же должен внутри передать Но давайте мы просто закинем туда Alert 1 и посмотрим как это всё будет отрабатывать onchange Alert Ага тут я должен вызвать функцию

возраст возраст Угу Так сохраняем давайте я обновлю страничку а ничего не происходит Почему Неужели функция не вызывается Я же возраст вызываю Да очен ещё раз сохранились обновляю страничку да Арт не вызывается А до этого он вызывался может быть в

одинарных кавычках попробуем сделать тоже Не отрабатывает Так где может быть ошибка у нас же точно где-то есть ещё раз не вызывается посмотрим как описываются функции на Ява скрипте вообще в принципе такая функция должна вызываться Тут ничего такого сверхъестественного нету точку запятую

поставил давайте я готовый пример функцию возьму и пропишу просто Show mess соответственно при изменении где ошибаюсь непонятно Да всем привет пишется О'кей так а нам нужно что нам нужен возраст также указываю возраст Ага Так обновляю страничку а возраст Не отрабатывает Неужели проблема

в нейминг Давайте возраст GS попробуем обновляю страничку да Так она вызывается А в идеале что в идеале У нас вот эта функция должна получить значение из вот этого вот э поля возраст и передать его а соответственно в PHP

передать в PHP и наверное трансформировать в пост запрос Вот давайте мы с вами это попробуем сделать То есть для того чтобы хранить информацию в Кука мы что должны сделал Давайте документ напишем документ тут у нас Дальше слово ки

должно появиться ки и тут вот мы Давайте с вами проше как раз-таки чтобы мы переменный возраст Угу задали значение так плюсик ставлю поскольку по умолчанию это у нас с вами строчки я буду таким образом писать мы что мы должны передать

какой-то параметр так захватить так поскольку у нас с вами есть да так Давайте попробуем получить какое-то значение например в это у нас с вами будет возраст вот такой вот точка давно на яво скрипте ничего не писал Но я думаю должно

получиться так возраст вами е Давайте выведем Арт Вот эту вот нашу в при изменении всё сохраняем се обновляю страничку нет ничего не происходит где-то допустил ошибку Так давайте посмотрим так получить значение in по А всё так Get Element by ID это по

идентификатору а нам нужно с вами искать получается по классу но мы в принципе можем и идентификатор же накинуть правильно Вот давайте мы тогда сделаем by ID и у него уже Мы соответственно передадим value вот выхватил таким вот образом так

Get Element by ID ID будет в точности такой же То есть это ID у нас будет возраст всё пробуем таким вот образом так UE на конце ставится честно не помню так пробуем тогда обновляем страничку тоже ничего не происходит Ну

как так как же так так хорошо просто мы тогда выведем Арт в самом начале и посмотрим вообще что происходит что-то должно происходить Я прямо уверен в этом если ничего не происходит то это плохо так сохраняем обновляем страничку 44

95 значение мы с вами получаем так дальше что Давайте попробуем упростить То есть можно да давайте также LED укажем V И мы в V записываем значение нашего value вот этого возраста дальше Что Дальше я также попрошу вывести нашу

V Угу обновляемся раз 40 91 22 замечательно параметры мы получили значит дальше что А дальше Мы можем с вами записать А вот в это пост значения как раз-таки тот параметр который мы с вами уже получили то есть дальше пойдёт такая смесь PHP скрипта

Конечно так лучше наверное не делать если бы мы более логично подходили к проектированию наши структуры Да и вообще знали бы что мы изначально пишем то наверное мы бы использовали Ну в общем не перегоняли бы значение из кук в пост запрос но мы это делаем

поэтому А нет я же не записал их ещё Да я же не записал это значение так правильно я скопировал Нет я не то скопировал Так нам Значит нужно записать вот это вот значение в пуке которое мы с вами получили

до замечательно дальше Что Дальше мы прописываем ки ки так в Кука у нас что должно быть у нас должен быть параметр возраст и он должен равняться сейчас скажу чему он должен равняться Вот как раз-таки вот этому значению value

или просто в Давайте просто в сначала запишем посмотрим как идёт функционирование всего вот этого так и тут возраст мы уже перегоняем вот таким вот образом так зажимаю Угу сохраняю всё А ну нет И давайте мы на всякий случай выведем на экран значение

уже нашего пост запроса вообще будет ли он функционировать Интересно даже самому стало так обновляю страничку нажимаю Нет ничего не происходит А почему ничего не происходит потому что наверное мы что сделали мы не Обновили с вами саму страницу Вот давайте в самом конце

напишем Location точка Чтобы перезагрузить страничку Так подзапрос кстати можно вынести чуть выше он всё равно не будет отрабатывать одновременно Да вот то есть мы задали потом перезагрузись и только потом у нас отработает вот эта штука замечательно обновляю страничку так

56 Нет ещё раз 9 а при обновлении страницы она у нас работает почему только у нас не запускается а перезагрузка самой странички всё же автоматически должно задаваться так да посмотрим перезагрузить страницу JS Ну вот мед Location да Или

rel Неужели неправильно написал Да я написал с ошибкой так ни вот 26 84 67 28 20 и так далее Всё супер вот то что нужно то есть у нас перезагружается страничка и мы не потеряли значение фильтрации плюс появился появилась Какая

фишка появилась Фишка в том что у нас сохраняются вот эти вот значения которые у нас уже были выше вот таким образом давайте мы с вами сейчас напишем наверное какую-нибудь одну функцию в которую просто будем а-а передавать значени Да в которых будем передавать

значение того что мы хотим получить так или же сделаем Просто много маленьких Вот таких вот функций на Ява скрипте где это всё и оформим Так давайте сейчас что сейчас Мне вот этот возраст хотелось бы выводить напротив соответственно возраста Вот где-то вот здесь вот это же

логично сделать да то есть вот таким вот хитрым велосипедом Ну по-другому я это назвать никак не могу мы с вами избежали изначальные ошибки в проектировании сразу например вот без временной переменной попробую записывать значение Будет ли работать Ну по идее

должно Вопрос только как оно будет работать Да так обновляю страничку Раз 2 3 вроде работает девочки появляются вопрос Только почему у нас одна девочка появляется Остальные же параметры у нас пустые или нет так возраст 25 25 а у нас Маша стала мужским

полом кто-то уже лазил в базу данных и хулиганил ничего страшного так женский всё так во То что нужно переключение работает супер сейчас нам нужно сделать соответственно такой же То есть как вы видите то есть вот эта кнопочка поиск

нам уже не нужна чтобы отправить пост запрос Вот соответственно Нам сейчас нужно переделать вот это вот всё что мы с вами делали ранее Хорошо вы же видите что у нас переменные везде называются одинаково А что если что если нам просто передавать вот

этот вот параметр возраст например да и передавать название вот этой функции Мы же можем это сделать да давайте назовём функцию например и передадим внутри возра я про что чу ше кода мне правда не хочется внедрять вот очень много функций

размножать на Ява скрипте вот вообще не хочется абсолютно поэтому мне кажется проще какой-то параметр передавать вот тут вот внутри так возраст Ага возраст мы передаём его сюда дальше Что Дальше У нас тут это всё попадет в переменную в

Да у нас это должно быть внутри в Давайте на всякий случай Арт напишем посмотрим как оно выведется так сохраняю обновляю страничку возраст Да мы передали этот параметр супер значит что знат вот сюда я правильно Нет я просто ставлю

в тут мы поставим плюсик вот таким образом у нас с вами уже вот в Кука Так а в Кука в Кука в Да это всё будет так ещё раз ки а возраст в хорошо Арт допустим вот тут мы же тоже можем V

подставить Да Element by V идём дальше обновляем страничку а нет всё работает хорошо замечательно так убираем так как же тут нам поступить мы отправили через JavaScript параметр потом у нас есть пост запрос полностью А что если например Мы из кук

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

for получается I или запустить перебор по массиву кук Так давайте выведем сначала всё содержимое массива так вывести содержимое массива PHP Да притом усложняется это чем усложняется это тем что Так подождите А что если сделать проще Вот например у меня

есть ки и я в них попробую просто перегнать все все пост элементы Будет ли такая штука работать Это же массив у нас с вами Вот правда стало интересно никогда так не делал такой велосипед не писал Если эта штука

работает то замечательно Ну ожидаем эта штука не работает так хорошо Значит нам всё-таки нужно пройтись по массиву с куками и задать Вот это значение цикл пост так тут у нас есть пример прохода по массиву как раз-таки массив кото у нас

используется Да с выводом параметров и так далее тут усложняется ситуация с чем что массив у нас с вами не числовой а внутри прописано значение так массив Как называется массив называется ки и дальше Что Дальше Мы в пост уже с вами будем

закидывать вот эти вот параметры Ага Так так так Нет давайте другой пример посмотрим вывода массива есть конечно замечательный чит-код так р возвращает строковое представление переменной в виде полноценного PHP кода и что нам это даст Давайте попробуем загуглить Вот эту

вот конструкцию а нет подождите Мы же обратную цель преследуем то есть нам в ке нужно передать то есть мы в пост записываем все ку интересно работает ли такая штука обновляемся абалдеть эта штука работает как было всё просто то есть

понимаете да насколько PHP классный язык что мы буквально в пару строчек можем решить практически все проблемы которые у нас с вами возникают Обалдеть не ломая функционал Ничего мы Вот решаем это всё сейчас что я сделаю я сейчас просто

пропишу вот эти вот параметры да те которые хочу передавать следующее поле у нас какое следующее поле у нас с детьми то есть вот оно я также дою вот сюда уже не воз а у нас как называется дети дети я не помню Какое значение

должно У нас тут возвращаться так лл где он А у нас нету да такого хорошо сохраняем смотрим раз ничего не происходит Ну можно попробовать да онклик может быть так отработает у нас этот параметр Давайте всё-таки выведем содержимое массива вот этого

дети и посмотрим как он себя проявляет Так нет я что хочу я вывести массива Дети так давайте я пишу Арт Да дальше вот э вот конструкция у нас с вами есть просто я внутри [музыка] хочу нет Или давайте сразу элемент

выведем вот тут вот что мы передали в пост запрос так доллар пост как что вот именно правда что там передаётся дети что выводится Пока непонятно так сохраняем се обновляем страничку так а вот этот параметр мы где-то теряем ничего не

происходит так хорошо возраст мы с вами запрограммировали Лучше наверное Вот это убрать да Вопрос только э как нам передавать так если получается дети равняются единички то нет Если э дети э есть то будет значение нолик передаваться Вот хорошо этот параметр мы

пока с вами опустим идём дальше так тут у нас с вами есть переключение Угу ещё один тип так так так не всё так просто Но мы же можем сделать допустим Три разных функции Да кото отвечать за каждый параметр Например у

нас есть один вот такой вот скрипт который обрабатывает что обрабатывает Range Range JS Вот именно он будет нацелен на возраст проверим Да работоспособность не потеряна это меня уже радует дальше у нас будет также скрипти функция которая будет что делать

которая будет обрабатывать чекбоксы так чекбокс GS мы её назовём так и я хочу выводить параметр А ну хотя бы чтобы единичку он у нас вернул хотя бы что-то чтобы вот эта наша функция хоть что-то напечатала что если она не будет

печатать это прям печаль хоть что-то же она может печатать Так давайте уже наверх вынести Нет пока ничего не будем делать хорошо так сохраняем дальше я обновляю страничку ставлю галочку нет ничего не происходит так надо гуглить что у нас есть Range А я же

передал возраст подождите Да нет там Я передал возраст дети и не JS А как он называется у нас кбо вот кбо JS Проверяем так единичка вернулась хорошо сечас нам нужно получи у нас возвращает вот э наша конструкция если там возвращается нолик

или единичка это то что нужно ничего не возвращается плохо так а мы ID не задали Да да мы не задали ID так напишем ID значит дети сохраняем обновляю страничку а если уберу Ага То есть я поставил галочку и

всё она сейчас не убирается Так подождите то есть в любом случае что-то у нас функция возвращает Угу до этого же не было галочки галочки не было может быть не онклик тогда а on change попробовать Ну что я как кликаю

такое ощущение что он не успевает смениться он CH правильно написал нужно выбрать Вот как раз-таки Да блин что не так-то не так срабатывает как нужно так давайте чекбокс JS или кбо JS что нам нужно EV события Да посмотреть состояние чекбокса нам нужно

получить нам предлагат чтом либо получается оклик либо on CH но так CH флажок не выбран дальше а просто чек поставить можно Кстати да это же чекбокс то есть что возможно обработка идёт неправильная Я хочу сейчас написать Давайте КТ

напишем так КТ и посмотрим что у нас вы видит fse fse то есть лож Ага а True и fse это как раз-таки есть единичка или нолик замечательно Так значит что значит мы сюда прописываем КТ раз Надеюсь не придётся ничего

менять fse И опять дописывается хорошо так всё в принципе мы значение получили Да так КТ А мы же можем Что сделать можем Дописать сюда Давайте дом условие есть если вот эта вот штука возвращает Да равняется то мы Давайте в Z запишем что запишем

нолик в запишем едини и тут мы соответственно уже буде в будем размещать внутри нашу Z Вот например вот таким вот образом Так давайте aler Z ещё напишем на всякий случай Так посмотреть как оно всё вообще работает не работает обновляю страничку нажимаю

но так Не отрабатывает Как нужно так так так идём дальше а если равняется fse то в Z записали это иначе вывели Вот это так Где же может быть ошибка Вот кстати в одном месте наверное вот этот пост нам достаточно оставить его не

должно быть много потому что мы все параметры в принципе передаём Да а вот у нас ещё тут где-то дети взялись вот так раз интересное решение Конечно перегонять все значения из кук в пост Ну кстати смотрите Можно же потом реализовать ещё

что если допустим у пользователя у нас не будет включён JavaScript Мы же можем отобразить кнопочку правильно вот ту и соответственно получать от него чисто пост запросы так осталось отловить вот этот параметр да fse иначе Z записываем единичку Ну можно наверное вот так вот

размножить Да True Давайте сюда пропишет а подождите не ну вроде всё правильно хорошо сохраняем смотрим Неужели из-за этого убираю галочку нолик А почему ты не убираешься А так или у нас какие-то другие параметры там сидят что переда в

запросе То есть если пост запрос стоит единичка то мы возвращаем нет иначе есть то есть если отмечено Ну давайте Вот вот так вот поменяем Ну это как менять дело ничего не происходит убираю галочку ВС равно почему-то улочка не

работает так как нужно хорошо пока оставим таким образом перейдём к следующей реализации но я думаю мы добьём то есть тут Тут очевидно что конструкция в принципе Рабочая просто где-то где-то происходит ошибочка непонятно даже где Пока Так а в в мы что передали Мы же

детей передали да чекбокс JS Дети да ID дети идут всё чётко так идём дальше А дальше у нас что дальше у нас образование угу так в образование нам нужно соответственно передать уже будет два параметра во-первых это то что у нас

образование и во-вторых сред обще сред об А сам параметр Так это что это у нас сек с вами Давайте заведём соответственно новую новую функцию Select JS мы её назовём для того чтобы обрабатывать селекты так селе и перем и V2 например вот так V1 - это у

нас Мы просто получили так то есть это название не название этого А как он Ну да само значение и дальше V2 Ага да давайте просто V2 передадим V2 всё так Select J мы сейчас её вызовем и будем передавать все параметры

внутри Так это у нас Что это у нас с вами образование так тут Наверное пропишет двойные кавычки SS и внутри прописываем нам нужно прописать вот как раз-таки образование это Первый параметр и второй параметр среднее общее также в двойных

кавычках понятно что наверное можно каким-то образом это и поиз Но поскольку мы с вами программируем можно сказать в режиме реального времени То есть вы наблюдаете полней импровизацию вот и полностью погружены в работу над проектом как будто сидите рядом со мной или что-то даже

подсказывает мне вот поэтому таким образом пока пытаемся сделать так дальше что selects вызвали записали значение передали сейчас попробуем будем смотреть как оно вообще работает не работает вот эта штука наша так средняя профессионально замечательно высшая образование тоже но страница

перезагружается или нет Вот это Меня смущает пугает даже я бы даже так сказал дава попросим вывести на экран вообще что происходит вот V1 и V2 обновляемся А на экране ничего не происходит потому что похоже что вот этот он change у нас не

работает хорошо тогда не on change а оклик попробуем именно вот на Первом параметре тоже ничего не происходит Хорошо Так Select Select JS value что нам предлагают на форуме Как получить это значение так так так Get элемен by ID опять я

идентификатор не прописал через val Ага мы его получаем хорошо А так можно же проще так сект что Селект какой у нас так а вызывать его Каким образом так тогда мы с вами используем ID какой будет ID образование обязательно

так ID образование не onclick on CH будем использовать да тем более val у нас с вами уже есть так образование тут прописываем onchange то есть при изменении мы с вами что будем вызывать сейчас пропишет JS мы с вами

вызываем замечательно где она так Select JS дальше И мы Давайте никакой параметр пока не передаём кстати нет можно передать сразу образование внутри вот образование передаём а само значение выбранное мы получим уже из формы вот таким вот образом то есть что

тут мы с вами получаем параметр V дальше Вот в точности таким же образом как у нас оно было ранее реализовано Get элемент в пам-пам-пам обновляем страничку так Смотрим среднее общее средняя работает ура эта штука работает значит что значит нам не нужна

функци мы можем просто использовать тот же самый Range GS и для второго вида функции вот с чекбоксов Так значит также будем использовать Range JS замечательно все параметры у нас отрабатывают так вызываем JS сохраняем обновляем страничку заходим средняя общее Я ставлю работает средняя

профессионально пропадает а Давайте попробуем другую девушку найти то есть у нас а Маша с вами отображается Маша отображается А вот нет Маша как раз-таки или ещё раз обновляю страничку Давайте вот скинем до образования Марина есть Ай не работает вот эта

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

проше соответственно идентификатор религия и параметр который мы передадим в Range JS всё обновляю страничку религиозное убеждение пропало пропало У нас у Марины православие если сейчас православие поставим и она появится Да она появилась супер дальше Что Дальше у нас идт

рост ну с ростом также как получается и с возрастом да то есть мы берм просто будем использовать события Так давайте я мещ вот сюда вот для того чтобы удобно было скопировать так получается ID г мы нашли с вами решение Ну нет

конечно нелегко Конечно мы посидели поковыряться изящное Да с точки зрения минимум кода максимум результата Это я вам скажу действительно круто И тут я что тут я хочу Дописать сразу же Давайте на PHP мы напишем у нас же всё в пост запросе хранится

пост тут мы Добавим что рост Да конечно рост выведем рядом Ага и Аналогично Наверное мы сейчас поступим из другим параметрам с весом угу вот сюда вот так у нас тут будет вес тут мы передаём вес так и сюда Мы также вставим

вес Радует да радует что в принципе всё получается на ходу так Смотрим рост получили вес тоже Ну у нас просто таких весовых категорий нету да мощных так лишний вывод где у нас тут был вот внизу мы уберём Давайте вот этот вывод так тут

мы тоже убираем вывод Угу ненужные то есть пытаемся делать ещё не только функциональную часть нашего сайта но делать ещё и красивую Ну всё параметр отрабатывает Давайте попробуем вот ту нашу девушку найти А где она у нас Марина у неё что у неё

рост 150 150 Я так понимаю да где-то Ну где-то вот здесь вот 152 а вес у неё 90 всё Мариночка отображается дальше Что Дальше добавляем медицинских ой дальше мы добавляем профессию точно также [музыка] так Шикарно что ВС работает Вот

правда А ну нет у нас Марина же кто Марина у нас с вами православная так православие Ага Ой как хорошо что мы не стали переписывать весь код а просто заменили Один массив другим это это вот супер Я доволен что

получилось это реализовать так дальше Что Дальше у нас внизу с вами так идентификатор Точно также мы получим сейчас профессия профессия профессия тут у нас что тут у нас это всё есть так соответственно Давайте в начале селекта мы что подставим мы подставим профессия

соответственно Да в идентификатор и передавать уже будем в нашу функцию Range JS профессия оттуда мы подхватит параметр так и у нас останется два вот этих вот а самое классное смотрите поскольку мы все параметры храним в Кука то есть человек

может перейти на другую страницу и вс вот это вот что у него сохранятся Марина у нас кто вот где она так Мариночка она юрист Да посмотрим поставим юриста Нет не туда нажал так юрист Да тоже отображается замечательно осталось

обработать Вот вот этот вот ужасный наш чекбокс который почему-то не хохочет отрабатывать просто отвратительно так если получается дети равняются единички А что если мы избавимся от единички например и попробуем что-то другое туда прописать То есть хорошо то есть если у

то это нет если в любом другом случае А неужели чекбокс всегда единичку возвращает так надо исправлять Давайте смотреть думать как это можно сделать так чекбокс хорошо получили идентификатор сюда то есть если он не отмечен записали единичку иначе э так в

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

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

иначе возвращаем есть То есть у нас вот этот пост запрос всегда возвращает единичку А так не должно быть давайте просто выведем на экран вот тут вот что мы выведем мы наверное выведем сначала пост запрос дети и ки увидим и

посмотрим что они вообще из себя В каком виде сохраняются эти данные хорошо Дети так и ки Да я выведу так ки дети Угу Просто интересно почему он не работает так как должен обновляем страничку нажимаем Посмотрите А у нас сейчас происходит

отжатие Почему Потому что скорее всего так скрипт написан с ошибкой Да где-то и он просто Не отрабатывает Как нужно Ну хорошо мы ниже напишем Угу сохраняем обновляем страничку две единички убираю тоже две единички Да что ж такое-то почему две

единички хорошо ставлю нолик тоже будет две единички два нуля Ага То есть всё-таки присваивание идёт Хорошо если fse Ну почему галочка то стоит так два нуля Хорошо какой параметр мы передаём в пост Хорошо если пост так пост запрос в переменную дети

записываем другое Так если существует то ставим единичку может быть просто записывать Да и нет я уж сейчас так думаю Вот правда Ну вот Давайте писать Да нет тогда или есть или нет Что у нас там где дети дети Нет ну просто вот нет напишем

русскими буквами нет иначе да иначе да Или есть у нас там нет нет Дада так нужно разобраться что мы храним в пост запросе Дети так если он существует и равняется единички Ну вот же у нас идёт обработка Значит

детей нету да как будто бы Ага если дети нет а под запрос у нас всегда так сейчас всегда такой существует Значит надо смотреть на саму суть вот этого пост запроса Давайте просто поставим наверное единицу Мы кстати можем сделать и нет

например да тут нет так обновляем страничку ставлю галочку всё равно Не отрабатывает так хорошо Если э пост запрос равняется нет то тогда это же вот вот тут решается вся логика как раз-таки А чем мы заполнили мы заполнили точно

также да нет да нет Хорошо давайте поставим единичку а сюда поставим нолик и тут уже проверяем То есть если равняется единички то нет а иначе есть не так так Дети нет Хорошо давайте нолик поставим почему-то не могу я

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

будто до этого вроде что-то работало так ещё раз единичка и Нолик сохраняем обновляю страничку Ага Так нет детей у Маши нет детей у Маши нет детей то сейчас нет у Марины нет детей А вот у Маши де и

давайте мы выставим какие-то другие параметры чтобы попасть под Машу так то есть если Маша отобразится то всё работает смотрим инженеры так инженеры раз всё пропало дальше вес 45 поставим так А рост 190 ну Маша здоровая конечно так 191 идём дальше

так образование высшее а выше и религия ислам ЕС Маша работает ура Да наша фильтрация отрабатывает Как нужно Ура Ура Ура Фух значит что значит мы вот этот Арт можем убирать Ага всё Арт убираем вывод данных этот убираем сбоку фильтрация готова осталось только

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

а подождите Я же ничего не нарушил правильно у Маши есть дети у Маши есть дети она пропадает всё всё замечательно Всё работает как и должно работать так идём дальше и то есть мы решили вопрос при помощи нуликов и

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

так давайте я сразу загуглю наверное как вытащить значение чтобы использовать правильный вот этот формат Так где он вот тут вот так checkbox value пишу так checko JS как его получить его нам предлагают получать через чек То есть тоже самое что мы делали и с

этим с вот как как фильтр у нас назывался фильтр назывался у нас с вами нет детей то есть тоже самое мы делаем вот с с этой штукой А где он так пролистывать до него так Дети так так так

чекбокс всё сейчас вот этот One CH давайте я размещу вот сюда вот нет после идентификатора укажу его всё так беру раз и бегу вниз соответственно прописывать ссылочки на курит не курит и так далее на вредные привычки так не получается у нас тут

курит так идентификатор не скопировал К сожалению Ну ладно пропишет вручную так тут у нас что тут у нас должен быть ID ID дальше Вот это я всё Опять копирую и размещаю вот тут пиет у нас он называется Угу Так

разместил разместил дальше что насколько я помню у нас пост запрос Всегда существует вот поэтому мы сравниваем его с единий Т тоже Я сравниваю с единий и сейчас попробуем уже воспользоваться нашим функционалом кнопку я уберу она не нужна абсолютно Так

сохраняем обновляем страничку вот тоже самое вот что не так А что не так равняется может быть с ноликом сравнивать Я как как я Там сверху сравнивал с ноликом сравнивал конечно да При том в кавычках То есть если нолик

то нет иначе Да значит если нолик то нет иначе да сохраняем се обновляем страничку раз два работает а у нас есть вот вот Маша точно не курит да А есть Пример например с курит так Маша а она и пьёт и

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

сразу можете задать нужные вам параметры яво сегодняшней серии для себя я сделал открытие что можно оказывается передавать параметры допустим из куков сразу в пост запрос Я так подозреваю и обратно тоже можно перекидывать Но с другой стороны это же

логично и там и там массивы Вот в общем серия получилась суперская большое спасибо что смотрели это видео обязательно ставьте лайки подписывайтесь на канал пишите комментарии и я Напоминаю что у меня есть страница на бусте Где вы можете поддержать работу этого

канала я там обязательно выложу все исходники к этому видео то есть дам базы данных плюс все внутренние скрипты ну супер сши прощаюсь на сегодня с вами завтра будет новое видео уже по другому проекту Вот жду ваши комментарии и да Дальше

будет только интересней