Как проверить радио кнопку checkbox без перезагрузки страницы ajax php


X

Как проверить радио кнопку checkbox без перезагрузки страницы ajax php

Для начала нужно создать страницу отображения index.php, привожу код чтобы долго не мучились, заметьте input-у сразу дадим свойство disabled = disabled, для того чтобы она была не активной как только поставим чекбокс сразу станет активной:

<form class="form" action="">
     <label><input type="checkbox">Я хочу отправить сообщение</label>
     <input type="hidden" name="valSubFal" class="valSubFal" value="valSubFal_disabled">
     <input type="submit" name="submit" class="button" value="Отправить" disabled="disabled">
</form>

 

Для отслеживания изменения кнопки, будет применять ajax, естественно незабываем, что нужно подключить библиотеку JQuery, для работы ajax, я бы советовал подключать именно с googla. Так как вряд ли что она когда-нибудь станет недоступной. Еще один нюанс посмотрите внимательно, что впереди стоят два слеша – это называется правильным подключением библиотек. Кому интересно прогуглите. Также советую для своих проектов подключать библиотеку напрямую. Это удобно когда нужно повысить скорость открытия сайта.

 <script src="//ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>

 

А вот сам код на ajax, который и будет обрабатывать радио кнопку. Поместите его выше формы, если хотите, можете вынести в отдельный файл. Допустим ajax.js

jQuery(document).ready(function($){
//в этой функции отслеживается изменение чекбокса "я не робот"
                $(document).on('change', '.form input:checkbox', function() {
                               if($(this).is(':checked')){
                                               // Снимаем атрибут disabled
                                               $(".form input[type=submit]").removeAttr('disabled');
                                               $('.form input[type=hidden].valSubFal').val('valSubFal_true');
                               }
                               else {
                                          // Устанавливаем атрибут disabled, если чекбокс отжат
                                               $(".form input[type=submit]").attr('disabled','disabled');
                                               $('.form input[type=hidden].valSubFal').val('valSubFal_disabled');
                                }                
                 });
});

 

Применений может быть масса для проверки форм перед отправкой как один из примеров.

FastFinder Просмотров сегодня +4 25 июня 2017 команда сайта
Ещё пока нет комментариев, будь первым!
Оставить комментарий
   🔔 Отдохните не много, может Вам будет интересно прочитать статьи пользователей нашего сайта.

Как на AJAX передать переменные в PHP с выводом результата в блок с проверкой условий без перезагрузки страницы

Тег base - это базовый адрес

Как создать свою CMS или фреймворк на MVC. Часть Первая

Недостатки раскрутки групп Вконтакте специальными сервисами

Как проверить радио кнопку checkbox без перезагрузки страницы ajax php

Тег acronym - это акроним

Как на MVC с помощью PHP правильно загружать файлы с сервера. Часть Вторая

Тег b - это полужирный шрифт

Подключение к БД и вывод результата на PHP через PDO на MVC

Как на MVC и PHP создать систему восстановления доступа с отправкой пароля на адрес электронной почты

Как узнать ID последней вставленной записи

Основные запросы SQL работа с базой данных PHP

Создание сайтов и мобильных приложений от 5 500 руб. Любой сложности!
Реклама Собственный фреймворк. Большие и сложные проекты. ТОП 100 разработчиков РФ.
Создание сайтов от 5 500 руб.
Мобильные приложения от 50 000 руб.
irogex.ru
Наши проекты Инстаграм от 6 500 руб.
Конструкторы Ugears купить в Иркутске от 690 руб. с Доставкой!
Реклама UGEARS это путешествие в удивительную атмосферу гармонии природы и совершенства конструкторской мысли
Конструктор Навигатор дат - 690 руб.
Конструктор Комбайн - 2990 руб.
ugears-irk.ru
Оплата и Доставка Контакты
Стоматология в Улан-Удэ | ДентаВита | Шок цены от 100 руб!
Реклама От всей нашей семьи хотим выразить огромную благодарность стоматологической клинике
Осмотр, консультация от 150 руб.
Рентгеновский снимок от 100 руб.
dentavita03.ru
Наши цены Отзывы
Реклама помогает поддерживать
и развивать наш сервис.


Подробнее
(ссылка откроется в новой вкладке)
  Реклама