2014-02-01 5 views
0

Я искал онлайн и следил за различными учебниками, но я не могу заставить это работать. Я пытаюсь получить форму Ajax для проверки с помощью плагина validate.jQuery Подтвердить плагин с запросом Ajax

Оба кода работают отдельно, но после изучения онлайн и попытки их комбинирования использовать submitHandler Мне не повезло.

Вот мой код, я новичок в jQuery и JavaScript, поэтому, если нет учебника для того, что именно я хочу, я стараюсь сочетать предыдущие уроки. Это большая контактная форма, но все, что я действительно хочу проверить, - это имя, адрес электронной почты и поля типа сообщения.

Благодаря

Джеймс

$('#arckocontact').validate({ 
rules:{ 
    name: { 
     required:true 
    }, 
    email: { 
     required:true, 
     email: true 
    } 
},// end rules 
messages:{ 
    name: { 
     required: 'You must enter your name.', 
    }, 
    email: { 
     required: 'You must supply an email address.', 
     email: 'You must enter a valid email address.', 
    } 
}, //end messages 
submitHandler: function(){ 

var name = $("input#name").val(); 
var email = $("input#email").val(); 
var phone = $("input#phone").val(); 

var messagetype = $("input[name='messagetype']:checked").val(); 

var trackurl = $("input#trackurl").val(); 
var trackdesc = $("#trackdesc").val(); 

var eventdate = $("input#eventdate").val(); 
var eventdesc = $("#eventdesc").val(); 
var adrsone = $("input#adrsone").val(); 
var adrstwo = $("input#adrstwo").val(); 
var adrsthree = $("input#adrsthree").val(); 
var pcode = $("input#pcode").val(); 

var detail = $("input#subject").val(); 
var note = $("#note").val(); 

var stringone = 'Thank you, '; 
var stringtwo = ' for contacting Arcko Digital, we will be in touch soon.'; 

$.ajax({ 
type: "POST", 
url: "processmail.php", 
data: {'name': name, 
    'email': email, 
    'phone': phone, 
    'messagetype': messagetype, 
    'trackurl': trackurl, 
    'trackdesc': trackdesc, 
    'eventdate': eventdate, 
    'eventdesc': eventdesc, 
    'adrsone': adrsone, 
    'adrstwo': adrstwo, 
    'adrsthree': adrsthree, 
    'pcode': pcode, 
    'detail': detail, 
    'note': note}, 
success: function() { 
$('#form').html("<div id='message'></div>"); 
$('#message').html("<h2>Message Submitted.</h2>") 
.append(stringone, name ,stringtwo) 
.hide() 
.fadeIn(1500); 
} 
}); 
return false; 

} //end form ajax 

});// end validate() 
+0

Включает ли ваша форма входной контроль типа submit? – roland

+0

Стандартная кнопка отправки, форма установлена ​​в 'method = 'post'' без каких-либо действий. Код Ajax работал нормально, пока я не начал добавлять код проверки и не работал вместе. – JamesSeabrook

ответ

0

Я думаю, что это сфера переменной error.Add переменных внутри функции Ajax успеха,

var stringone = 'Thank you, '; 
var stringtwo = ' for contacting Arcko Digital, we will be in touch soon.'; 
var name = $("input#name").val(); 

Убедитесь, что попытаться найти ошибку в разработчике (Браузер)

Попробуйте это,

$('#arckocontact').validate({ 
    rules:{ 
     name: { 
      required:true 
     }, 
     email: { 
      required:true, 
      email: true 
     } 
    },// end rules 
    messages:{ 
     name: { 
      required: 'You must enter your name.', 
     }, 
     email: { 
      required: 'You must supply an email address.', 
      email: 'You must enter a valid email address.', 
     } 
    }, //end messages 
    submitHandler: function(){ 

    var name = $("input#name").val(); 
    var email = $("input#email").val(); 
    var phone = $("input#phone").val(); 

    var messagetype = $("input[name='messagetype']:checked").val(); 

    var trackurl = $("input#trackurl").val(); 
    var trackdesc = $("#trackdesc").val(); 

    var eventdate = $("input#eventdate").val(); 
    var eventdesc = $("#eventdesc").val(); 
    var adrsone = $("input#adrsone").val(); 
    var adrstwo = $("input#adrstwo").val(); 
    var adrsthree = $("input#adrsthree").val(); 
    var pcode = $("input#pcode").val(); 

    var detail = $("input#subject").val(); 
    var note = $("#note").val(); 

    var stringone = 'Thank you, '; 
    var stringtwo = ' for contacting Arcko Digital, we will be in touch soon.'; 

    $.ajax({ 
    type: "POST", 
    url: "processmail.php", 
    data: {'name': name, 
     'email': email, 
     'phone': phone, 
     'messagetype': messagetype, 
     'trackurl': trackurl, 
     'trackdesc': trackdesc, 
     'eventdate': eventdate, 
     'eventdesc': eventdesc, 
     'adrsone': adrsone, 
     'adrstwo': adrstwo, 
     'adrsthree': adrsthree, 
     'pcode': pcode, 
     'detail': detail, 
     'note': note}, 
    success: function() { 
**//Here my change** 
var stringone = 'Thank you, '; 
var stringtwo = ' for contacting Arcko Digital, we will be in touch soon.'; 
var name = $("input#name").val(); 
    $('#form').html("<div id='message'></div>"); 
    $('#message').html("<h2>Message Submitted.</h2>") 
    .append(stringone, name ,stringtwo) 
    .hide() 
    .fadeIn(1500); 
    } 
    }); 
    return false; 

    } //end form ajax 

    });// end validate() 
+0

Отлично, проверено правильно, и теперь все работает нормально. благодаря – JamesSeabrook

Смежные вопросы