Problema ao enviar com ajax dois formulário na mesma pagina.

[Williams Duarte 431]

O problema que tenho que enviar por ajax, 04 formulários que abrem em abas, e ainda estou no segundo, quanto o primeiro envia normalmente só que segundo não,

 

quando retiro o code do primeiro o segundo vai, quando ambas ficam junto no code, não vai de jeito nenhum.

 

.js

$(document).ready(function() {

	$('form #response').hide();

	$('#login').submit(function(e) {

		// prevent forms default action until
		// error check has been performed
		e.preventDefault();

		// grab form field values
		var valid = '';
		var email = $('#email').val();
		var password = $('#password').val();
	
		if( email == '' ){
			valid += '<p>Digite o seu endereço de e-mail.</p>';
		} else if ( !email.match(/^([a-z0-9._-]+@[a-z0-9._-]+\.[a-z]{2,4}$)/i)) {
			valid += '<p>Endereço de e-mail inválido.</p>';
		}

		if( password == '' ){
			valid += '<p>Digite a sua senha.</p>';
		} else if( password.length < 6) {
			valid += '<p>A senha deve conter no miníno 6 caracteres.</p>';
		} else if ( password.search( /\s/g ) != -1 ) {
			valid += '<p>Não é permitido espaço em branco na senha.</p>';
		}
		
		// let the user know if there are erros with the form
		if ( valid != '' ) {

			$('#response').removeClass().addClass('error')
				.html('<strong>Por favor, verifique o(s) erro(s) abaixo.</strong>' +valid).fadeIn('fast');
		}
		// let the user know something is happening behind the scenes
		// serialize the form data and send to our ajax function
		else {

			$('#response').removeClass().html('<img src="/img/ajax-loader.gif" />').fadeIn('fast');

			var formData = $('form').serialize();

			submitForm(formData);
		}
		
		
		// make our ajax request to the server
		function submitForm(formData) {

			$.ajax({
				type: 'POST',
				url: '/serviceLogin/ajaxLogin/',
				data: formData,
				dataType: 'json',
				cache: false,
				timeout: 7000,
				success: function(data) {

					$('#response').removeClass().addClass((data.error === true) ? 'error' : 'success')
								.html(data.msg).fadeIn('fast');

					if ($('#response').hasClass('success')) {

						setTimeout("$('#response').fadeOut('fast')", 5000);
					}

					if (data.error !== true) {
						window.location=data.url;
					} else {
						$('#password').val('');
					}

				},
				error: function(XMLHttpRequest, textStatus, errorThrown) {

					$('#response').removeClass().addClass('error')
								.html('<p>Houve<strong> ' + errorThrown +
									  '</strong> erro devido a um<strong> ' + textStatus +
									  '</strong> condição.</p>').fadeIn('fast');
				},
				complete: function(XMLHttpRequest, status) {
					if (data.error !== true) {
						$('form')[0].reset();
					}
				}
			});
		};

		
		

	});
	
	
	$('#usuario').submit(function(e) {

		// prevent forms default action until
		// error check has been performed
		e.preventDefault();

		// grab form field values
		var valid = '';
		var email_add = $('#email_add').val();
		var password_add = $('#password_add').val();
	
		if( email_add == '' ){
			valid += '<p>Digite o seu endereço de e-mail.</p>';
		} else if ( !email_add.match(/^([a-z0-9._-]+@[a-z0-9._-]+\.[a-z]{2,4}$)/i)) {
			valid += '<p>Endereço de e-mail inválido.</p>';
		}

		if( password_add == '' ){
			valid += '<p>Digite a sua senha.</p>';
		} else if( password_add.length < 6) {
			valid += '<p>A senha deve conter no miníno 6 caracteres.</p>';
		} else if ( password_add.search( /\s/g ) != -1 ) {
			valid += '<p>Não é permitido espaço em branco na senha.</p>';
		}
		
		// let the user know if there are erros with the form
		if ( valid != '' ) {

			$('#response').removeClass().addClass('error')
				.html('<strong>Por favor, verifique o(s) erro(s) abaixo.</strong>' +valid).fadeIn('fast');
		}
		// let the user know something is happening behind the scenes
		// serialize the form data and send to our ajax function
		else {

			$('#response').removeClass().html('<img src="/img/ajax-loader.gif" />').fadeIn('fast');

			var formData = $('form').serialize();

			submitForm(formData2);
		}
		
		
		
		// make our ajax request to the server
		function submitForm(formData2) {

			$.ajax({
				type: 'POST',
				url: '/usuario/ajaxUsuarioAdd/',
				data: formData2,
				dataType: 'json',
				cache: false,
				timeout: 7000,
				success: function(data) {

					$('#response').removeClass().addClass((data.error === true) ? 'error' : 'success')
								.html(data.msg).fadeIn('fast');

					if ($('#response').hasClass('success')) {

						setTimeout("$('#response').fadeOut('fast')", 5000);
					}

					if (data.error !== true) {
						window.location=data.url;
					} else {
						$('#password_add').val('');
					}

				},
				error: function(XMLHttpRequest, textStatus, errorThrown) {

					$('#response').removeClass().addClass('error')
								.html('<p>Houve<strong> ' + errorThrown +
									  '</strong> erro devido a um<strong> ' + textStatus +
									  '</strong> condição.</p>').fadeIn('fast');
				},
				complete: function(XMLHttpRequest, status) {
					if (data.error !== true) {
						$('form')[0].reset();
					}
				}
			});
		};
		

	});
	
	
});

form1

<form id="login" method="post">
                                         <div id="response"><!--This will hold our error messages and the response from the server. --></div>
                                        
                                        <label>E-mail</label>
                                        <input type="email" id="email" name="email" class="input-block-level" />
                                        <label>Senha<a href="#panel3" data-toggle="tab" class="pull-right"><i class="icon-question-sign"></i> Recuperar senha</a> </label>
                                        <input type="password" id="password" name="password" class="input-block-level" />
                                        <label>
                                            <button type="button" data-toggle="button" class="btn btn-mini custom-checkbox active"><i class="icon-ok"></i></button>
                                               Lembrar-me
                                        </label>
                                        <br />

                                        <button type="submit" class=" btn ">Fazer login   <i class="icon-chevron-sign-right"></i></button>

                                    </form>

form2

<form id="usuario" method="post">
                                         <div id="response"><!--This will hold our error messages and the response from the server. --></div>
                                        
                                        <label>E-mail</label>
                                        <input type="email" id="email_add" name="email_add" class="input-block-level" />
                                        <label>Senha<a href="#panel3" data-toggle="tab" class="pull-right"><i class="icon-question-sign"></i> Recuperar senha</a> </label>
                                        <input type="password" id="password_add" name="password_add" class="input-block-level" />
                                        <label>
                                            <button type="button" data-toggle="button" class="btn btn-mini custom-checkbox active"><i class="icon-ok"></i></button>
                                               Lembrar-me
                                        </label>
                                        <br />

                                        <button type="submit" class=" btn ">Fazer login   <i class="icon-chevron-sign-right"></i></button>



                                    </form>

[Williams Duarte 431]

Resolvido, estava duplicando a id abaixo

<div id="response"><!--Mensagen. --></div>