За последние 24 часа нас посетили 70539 программистов и 10298 роботов. Сейчас ищут 2595 программистов ...

Как при помощи js обработать правильно форму?

Тема в разделе "PHP для новичков", создана пользователем _ne_scaju_, 24 авг 2017.

  1. _ne_scaju_

    _ne_scaju_ Старожил

    С нами с:
    25 ноя 2016
    Сообщения:
    2.149
    Симпатии:
    118
    Как можно создать кнопку выход из сообщения, то-есть выскакивает подсказка например, вы уже подали заявку, и с боку кнопочку закрытия сделать, + чтобы это сообщение исчезло через пару секунд, и все это на js
     
  2. mkramer

    mkramer Суперстар
    Команда форума Модератор

    С нами с:
    20 июн 2012
    Сообщения:
    8.497
    Симпатии:
    1.726
    Закрыть через пару секунд: https://learn.javascript.ru/settimeout-setinterval
    Выскакивает сообщение - ну либо самому наверстать, display: none, а потом из JS отображать и скрывать
    Код (Javascript):
    1. document.getElementById("message").style.display = "block";
    2. setTimeout(function () { document.getElementById("message").style.display = "none";}, 2000);
    --- Добавлено ---
    P.S. Что бы не говорил @Fell-x27, но
    Код (Javascript):
    1. $("#message").show()
    мне больше по душе (это с jQuery). Тут просто как-то смотрю, в этой теме все VanillaJS пишут, ну ладно.
     
    _ne_scaju_ нравится это.
  3. Danil005

    Danil005 Активный пользователь

    С нами с:
    2 янв 2015
    Сообщения:
    528
    Симпатии:
    30
    согласен.
     
  4. _ne_scaju_

    _ne_scaju_ Старожил

    С нами с:
    25 ноя 2016
    Сообщения:
    2.149
    Симпатии:
    118
    @mkramer
    Спасибо огромное, в принципе в коде все понял)
     
  5. _ne_scaju_

    _ne_scaju_ Старожил

    С нами с:
    25 ноя 2016
    Сообщения:
    2.149
    Симпатии:
    118
    Чет не получается(
    Код (Javascript):
    1. /* Добавляем юзера методом js */
    2. var add = document.querySelectorAll('.addFriend');
    3. // var message = document.querySelectorAll('.msg');
    4. var message = document.querySelectorAll('.msg').style.display = 'block';
    5. setTimeout(function () { document.querySelectorAll('.msg').style.display = 'none';}, 2000);
    6.  
    7.  
    8. add.forEach(function(item, i) {
    9.     add[i].addEventListener('click', function(e) {
    10.     e.preventDefault();
    11.  
    12.     userId = e.target.parentElement.elements.uid.value;
    13.  
    14.     xmlhttp = new XMLHttpRequest();
    15.  
    16.     xmlhttp.onreadystatechange=function() {
    17.  
    18.  
    19.     if (this.readyState==4 && this.status==200) {
    20.       message[i].innerHTML=this.responseText;
    21.     }
    22.   }
    23.  
    24.     xmlhttp.open("POST", "friends?act=add&uid="+userId, true);
    25.     xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    26.     xmlhttp.send();
    27.  
    28.     })
    29. })
    И страница users.php код:
    PHP:
    1. $button_add_friend = '
    2. <form method="POST" action="" class="addFriend">
    3. <input type="hidden" name="uid" value="'.$uid.'">
    4. <button type="submit" value="">Добавить</button>
    5. </form> <span class="msg"></span>';
     
  6. mkramer

    mkramer Суперстар
    Команда форума Модератор

    С нами с:
    20 июн 2012
    Сообщения:
    8.497
    Симпатии:
    1.726
    И что эта строка делает, по твоему? Ты вообще читаешь о функциях, которые используешь? querySelectorAll вернёт NodeList, у NodeList нету свойства style, надо каждый узел в нём перебрать руками и у него уже поставить. У меня-то было getElementById, которая возвращает конкретный элемент. Включай голову, прекращай бездумно копипастить
    --- Добавлено ---
    https://developer.mozilla.org/ru/docs/Web/API/NodeList
     
  7. _ne_scaju_

    _ne_scaju_ Старожил

    С нами с:
    25 ноя 2016
    Сообщения:
    2.149
    Симпатии:
    118
    @mkramer
    querySelectorAll я подумал что эта функция вытягивает class а та что у тебя вытягивает id из форм, вроде не так подумал)
     
  8. mkramer

    mkramer Суперстар
    Команда форума Модератор

    С нами с:
    20 июн 2012
    Сообщения:
    8.497
    Симпатии:
    1.726
    Надо было прочитать. https://developer.mozilla.org/ru/docs/Web/API/Document/querySelectorAll
    Или по названию догадаться. Я, к примеру, эту функцию до недавнего времени только в примерах здесь на форуме видел, поскольку свои скрипты не пишу на VanillaJS, но в названии All, переводится "все", и сразу подозреваешь какой-то списочный тип, а не одиночный элемент.
     
  9. _ne_scaju_

    _ne_scaju_ Старожил

    С нами с:
    25 ноя 2016
    Сообщения:
    2.149
    Симпатии:
    118
    @mkramer
    Согласен, я же о этом даже не задумался, вот например в запросе fetchall() вытащить все, вот так и сейчас ситуация)
     
  10. _ne_scaju_

    _ne_scaju_ Старожил

    С нами с:
    25 ноя 2016
    Сообщения:
    2.149
    Симпатии:
    118
    А
    как же путь указать в url: если он имеет вид такой:
    PHP:
    1. "friends?act=add&uid="+userId
     
  11. MouseZver

    MouseZver Суперстар

    С нами с:
    1 апр 2013
    Сообщения:
    7.843
    Симпатии:
    1.338
    Адрес:
    Лень
    < form action = "..." ...
     
  12. mkramer

    mkramer Суперстар
    Команда форума Модератор

    С нами с:
    20 июн 2012
    Сообщения:
    8.497
    Симпатии:
    1.726
    Можно в скрытое поле формы засунуть, если get-форма
     
  13. _ne_scaju_

    _ne_scaju_ Старожил

    С нами с:
    25 ноя 2016
    Сообщения:
    2.149
    Симпатии:
    118
    @MouseZver
    Давай без приколов? я знаю что в фореме нужно указывать скрипт action="myscipt.php" а если еще и get параметры и с базы вытягиваю id что в таких случаях делают?
     
  14. MouseZver

    MouseZver Суперстар

    С нами с:
    1 апр 2013
    Сообщения:
    7.843
    Симпатии:
    1.338
    Адрес:
    Лень
    PHP:
    1. printf ( '<form action="/pricol.porno.php?cicbki=%s">', $result['id'] );
    --- Добавлено ---
    вызывают скорую
    прыгают с бордюров
    забегают в ларек и кричат БОМБА АЛАХ БАБАХ
     
  15. _ne_scaju_

    _ne_scaju_ Старожил

    С нами с:
    25 ноя 2016
    Сообщения:
    2.149
    Симпатии:
    118
    @MouseZver
    Дак это будет считаться что это GET запрос
     
  16. MouseZver

    MouseZver Суперстар

    С нами с:
    1 апр 2013
    Сообщения:
    7.843
    Симпатии:
    1.338
    Адрес:
    Лень
    никто не тестирует, но нужно написать годный код
    --- Добавлено ---
    он отправит POST запрос по урл /pricol.porno.php?cicbki=123
     
  17. _ne_scaju_

    _ne_scaju_ Старожил

    С нами с:
    25 ноя 2016
    Сообщения:
    2.149
    Симпатии:
    118
  18. _ne_scaju_

    _ne_scaju_ Старожил

    С нами с:
    25 ноя 2016
    Сообщения:
    2.149
    Симпатии:
    118
    Можешь мне свитч убрать и гет параметр, так будет легче создать post запрос на js ajax.
    А то-есть код добавления это один скрипт, код удаления это другой скрипт, ну и так далее.
     
  19. mkramer

    mkramer Суперстар
    Команда форума Модератор

    С нами с:
    20 июн 2012
    Сообщения:
    8.497
    Симпатии:
    1.726
    Во ты наглый
     
  20. NerdRage

    NerdRage Активный пользователь

    С нами с:
    6 июл 2016
    Сообщения:
    439
    Симпатии:
    42
    Аматоры... Учитесь у тимлида как красоту писать.

    Код (Javascript):
    1. $(document).on('submit', '.jsPaySubm', function(event) {
    2.     event.preventDefault();
    3.     var d = "my data";
    4.  
    5.     $.ajax({
    6.         type: 'POST',
    7.         cache: false,
    8.         url: '/assets/ajax.php',
    9.         dataType: 'json',
    10.         data: {
    11.             'ajaxing': 'test',
    12.             'data': encodeURIComponent(d)
    13.         },
    14.         success: function(result){
    15.             switch (result['error']) {
    16.                 default:
    17.                 case 1: // простая ошибка
    18.                     alert(result['message']);
    19.                 break;
    20.                 case 2: // ошибка с подсветкой полей
    21.                     if (result['fields']) {
    22.                         for (var i in result['fields']) {
    23.                             $('select[name="'+result['fields'][i]+'"]').addClass('red-border');
    24.                             $('textarea[name="'+result['fields'][i]+'"]').addClass('red-border');
    25.                             var Obj = $('input[name="'+result['fields'][i]+'"]');
    26.                             Obj.addClass('red-border');
    27.                             Obj.each(function() {
    28.                                 var Id = $(this).attr('id');
    29.                                 $('label[for="'+Id+'"]').addClass('text-red');
    30.                             });
    31.                         }
    32.                     }
    33.                     alert(result['message']);
    34.                 break;
    35.             }
    36.             alert(result['success']);
    37.         },
    38.         error: function(result){
    39.             if ((result['status']) || (result['responseText'])) {
    40.                 alert('Error: '+result['status']+': '+result['responseText']);
    41.             }
    42.         }
    43.     });
    44. });
     
  21. MouseZver

    MouseZver Суперстар

    С нами с:
    1 апр 2013
    Сообщения:
    7.843
    Симпатии:
    1.338
    Адрес:
    Лень
    @_ne_scaju_ если тебе это надо, то почему не пойдешь узнавать в гугл синтаксис правописания switch в ДЖАВАскрипт , чтобы после взять, уделить внимание тестам и примерам в инете и поиграть на что получится.
     
  22. _ne_scaju_

    _ne_scaju_ Старожил

    С нами с:
    25 ноя 2016
    Сообщения:
    2.149
    Симпатии:
    118
    Ай да опять не правильно меня поняли, свитч убрать там где у меня скрипт друзей а не скрипт js
    --- Добавлено ---
    @NerdRage
    А при чем тут свитч в js я не пойму)
     
  23. Dimon2x

    Dimon2x Старожил

    С нами с:
    26 фев 2012
    Сообщения:
    2.199
    Симпатии:
    183
    Что бы отправлять для PHP нужные данные
     
  24. _ne_scaju_

    _ne_scaju_ Старожил

    С нами с:
    25 ноя 2016
    Сообщения:
    2.149
    Симпатии:
    118
    Так народ переделываю скрипт js на чистый ajax:
    Код (Javascript):
    1. // Добавления в друзья
    2. $(function(){
    3.  
    4.     $('#friends_add').submit(function(e){ // отправка формы с ид=friends_add
    5.         e.preventDefault(); // отменяем действие по умолчанию
    6.         //userId = e.target.parentElement.elements.uid.value;
    7.         $.ajax({ // начинается ajax
    8.             type: 'post', // метод отправки данных
    9.             url: 'add_to_friends', // обработчик формы
    10.             data: $(this).serialize(), // собираем данные с формы
    11.             cache: false,
    12.             success: function(data){ // функция вывода инфы
    13.                 $('#friends_add_error').html(data); // выводим сообщение в блок с ид=friends_add_error
    14.             }
    15.         });
    16.     });
    17. });
    На странице users.php
    PHP:
    1. $button_add_friend = '
    2. <form method="POST" action="" id="friends_add">
    3. <input type="hidden" name="uid" value="'.$uid.'">
    4. <button type="submit" value="">Добавить</button>
    5. </form> <span id="friends_add_error"></span>';

    Не могу передать id юзера кому кидаю заявку в друзья(
     
  25. Dimon2x

    Dimon2x Старожил

    С нами с:
    26 фев 2012
    Сообщения:
    2.199
    Симпатии:
    183
    :D:D:D