Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #11 (permalink)  
Старый 14.03.2014, 02:22
Профессор
Отправить личное сообщение для Faab Посмотреть профиль Найти все сообщения от Faab
 
Регистрация: 16.04.2012
Сообщений: 310

Ну url правильный, он должен на сервер отправить через POST данные.. там у меня роутер смотрит что идёт через post по этому url. Но проблема в том что срабатывает GET, а не POST.

Если я задам форме метод POST, то у меня сработает роут (данные отлавливаются на сервере - я читаю их в логах), но потом просто выходит OK. Я думаю что данные отправились не через ajax() а тупо POST и все эти колбэки в ajax внасмарку. Я могу закомментировать тогда просто ajax и мне точно так же придёт ответ OK

Последний раз редактировалось Faab, 14.03.2014 в 02:26.
Ответить с цитированием
  #12 (permalink)  
Старый 14.03.2014, 02:26
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,105

Faab,
нормально всё уходит post
для примера
<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <title> - jsFiddle demo</title>
  <script type='text/javascript' src='http://code.jquery.com/jquery-1.9.1.js'></script>
</head>
<body>  <form class="form-horizontal login-form" name="login-form">
  <div class="form-group">
    <label for="input-username" class="col-lg-2 control-label">Имя</label>

    <div class="col-lg-10">
      <input name="username" value="name" type="text" class="form-control" id="input-username" placeholder="Имя">
    </div>
  </div>
  <div class="form-group">
    <label for="input-password" class="col-lg-2 control-label">Пароль</label>

    <div class="col-lg-10">
      <input name="password" value="pass" type="password" class="form-control" id="input-password" placeholder="Пароль">
    </div>
  </div>
  <div class="form-group">
    <div class="col-lg-offset-2 col-lg-10">
      <button type="submit" class="btn btn-primary" data-loading-text="Отправляю...">Войти</button>
      <span class="help-block error"></span>
    </div>
  </div>
</form>

<script>
  $(document.forms['login-form']).on('submit', function() {
    var form = $(this);

    $('.error', form).html('');
    $(":submit", form).text("loading");

    $.ajax({
      url: "http://javascript.ru/forum/login.php?do=login",
      method: "POST",
      data: form.serialize(),
      complete: function() {
        $(":submit", form).text("reset");
      },
      statusCode: {
        200: function() {
          form.html("Вы вошли в сайт").addClass('alert-success');
          //window.location.href = "/chat";
        },
        403: function(jqXHR) {
          var error = JSON.parse(jqXHR.responseText);
          $('.error', form).html(error.message);
        },
        404:function(){
      alert('Страница не найдена');
    }
      }
    });
    return false;
  });

</script>
</body>
</html>
Ответить с цитированием
  #13 (permalink)  
Старый 14.03.2014, 02:29
Профессор
Отправить личное сообщение для Faab Посмотреть профиль Найти все сообщения от Faab
 
Регистрация: 16.04.2012
Сообщений: 310

Я хотел сделать обход вот так

<div class="form-group">
    <div class="col-lg-offset-2 col-lg-10">
      <!-- <button type="submit"  class="btn btn-primary" data-loading-text="Отправляю..." > Войти</button> -->
       
      <span class="help-block error"></span>
    </div>
  </div>
</form>


</form>
-
<input type="button" id="e_sub" value="send" />

<script>
window.onload = function(){
  var e_sub = document.getElementById("e_sub");
  e_sub.onclick = function(){
    console.log("event click");
    
    var form = document.getElementById("login-form");
    
    console.log("start ajax()");
    $.ajax({
        url: "/login",
        method: "POST",
        data: form.serialize(),
        complete: function() {
          $(":submit", form).text("reset");
        },
        statusCode: {
          200: function() {
            console.log("200");
            form.html("Вы вошли в сайт").addClass('alert-success');
            window.location.href = "/chat";
          },
          403: function(jqXHR) {
            console.log("403");
            var error = JSON.parse(jqXHR.responseText);
            $('.error', form).html(error.message);
          }
        }
    });
  };
};<script>


НО кажется эта строка не совсем то, что надо поместить в переменную форм:
var form = document.getElementById("login-form");
Ответить с цитированием
  #14 (permalink)  
Старый 14.03.2014, 02:44
Профессор
Отправить личное сообщение для Faab Посмотреть профиль Найти все сообщения от Faab
 
Регистрация: 16.04.2012
Сообщений: 310

Ладно... залезу в исходники следующего урока, сравню с тем что есть на данный момент. Может и я что то начебучил и не вижу.

Воспользуюсь советом насчёт консоли, я не знал про такую опцию.
Ответить с цитированием
  #15 (permalink)  
Старый 14.03.2014, 03:01
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Сообщение от Faab
проблема в том что срабатывает GET, а не POST
Да ты ведь сам говоришь что происходит перезагрузка. Следовательно твой скрпипт не тормозит событие (не отменяет действие по умолчанию - отправку формы).
Причиной может быть либо ошибка в обработчике submit, либо ты вовсе не навешиваешь обработчик. Проверить можно перед навешиванием console.log($(document.forms['login-form']).length)

Кстати, в твоем последнем огрызке HTML два закрывающих </form>/ Может и открывающих у тебя тоже два? Так то в HTML не разрешаются вложенные формы. Они тупо игнорируются если не ошибаюсь.
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #16 (permalink)  
Старый 14.03.2014, 15:13
Профессор
Отправить личное сообщение для Faab Посмотреть профиль Найти все сообщения от Faab
 
Регистрация: 16.04.2012
Сообщений: 310

Короче весь косяк вышел, как всегда, по моей вине.

- я недавно перешёл на Яндекс, и сам не обратил внимание на то, в консоле не выводились ошибки. Хром выдал мне все ошибки скопом.

- а сам косяк был в bower. Сам npm пакет Bower был установлен нормально, но Хром всё равно показывает что не может найти JQuery-файл. ( как я сам не догадался проверить работоспособность jq?) Ну и отсда весь косяк. При подключении внешнего jq , скрипт срабатывает нормально. Будут искать что не так с bower-jq, хотя bootstrap работает через bower вроде нормально.

Рони и Даник, спасибо за помощь и советы.

PS да и в логах мне сервер писал что при обращении к jq идёт 404..

Последний раз редактировалось Faab, 14.03.2014 в 15:16.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
При AJAX-запросе не посылается кнопка 'submit' hrundel Events/DOM/Window 17 31.05.2016 22:43
Нужно сделать проверку при нажати на submit ? ilyas-> Элементы интерфейса 4 09.10.2013 15:09
Метод submit() не передает массив $_POST ZaValera Общие вопросы Javascript 15 21.06.2012 16:02
привязать событие к submit flyingspook Общие вопросы Javascript 12 19.08.2011 14:35
submit в iframe по событию change vovasvv jQuery 1 21.05.2010 09:37