2010-11-06 3 views
1

Пытается провести валидацию по форме без <form> тег.jquery .submit()

Его структура плагина cms, который использует ajax, не знает, почему входы не обернуты <form></form>.

Html:

<div class="feedback"> 
    <input id="name" type="text" name="ajax-name" value="Your name" /> 
    <input id="mail" type="text" name="ajax-mail" value="Your e-mail" /> 
    <button type="submit" id="done">Send</button> 
</div> 

JS:

$(".feedback #done").click(function() { 
    var flag = true; 
    if (!$("#name").val()){ 
     $("#name").addClass('error'); 
     flag = false; 
    } 
    if (flag == true) 
     $(".feedback").submit(); 
}); 

Этот код не работает.

Как сделать валидацию по форме без знака <form>?

Ajax не знает об этом подтверждении.

Спасибо.

ответ

2

Вместо

if (flag == true) 
    $(".feedback").submit(); 

сделать

return flag; 

Вы не можете представить без <form>, но вы можете запретить или разрешить щелчок() даже для завершения. Вот полный код:

$(".feedback #done").click(function() { 
    var flag = true; 
    if (!$("#name").val()){ 
     $("#name").addClass('error'); 
     flag = false; 
    } 

    //return the value of flag instead of working with submit() 
    return flag; 
}); 

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

+0

извините, я не понимаю. Пожалуйста, дайте более подробный ответ. – James

+0

Разве это более ясно? Надеюсь, это все, что я получил :) –

+0

ОК, теперь его ясно. Благодаря! – James

0

альтернативный способ получения работу, завернуть все дочерние узлы .feedback с <form > тега, а затем выполнить .submit() на <form id="someid">

$(function() { 
    $('.feedback').children().wrapAll('<form id="form" />'); 
    $('.feedback #done').click(function() { 
     var flag = true; 
     if (!$("#name").val()) { 
      $("#name").addClass('error'); 
      flag = false; 
     } 
     if (flag) { 
      $("#form").submit(); 
      return false; 
     } 
    }); 
}); 
0

@edit так я на самом деле читать вопрос и даже если он старый это все еще кажется актуальным ...

Просто используйте кнопку отправки с помощью .change() или .bind() или .on(), если используете jQuery 1.7. e.preventDefault() может работать с обработчиком ajax? цепочка кутерьмы ослепить UNBIND функцию, например, так:

var some_flag_bool = false; 
$('#done').click(function (e) { 
    e.preventDefault(); 
    some_flag_bool = true; 
    $(this).unbind('#done').submit(); 
    //return might be considered optional 
    return this.some_flag_bool; 
}); 

или что-то подобное в JQuery 1.7, чтобы попытаться поймать вещи рано:

function validation() { if (!foo) { throw new Error("oh noz!"); } 
$('body').on('change', 'input', function() { validation(); }); 

мог $ .attr ('инвалиды', 'инвалиды') кнопку, когда документ готов, а затем $ .removeAttr ('disabled') в методе проверки

, но если бы это был я, я бы просто вызвал методы проверки из моего обработчика ajax или использовал плагин jQuery.validation.