$(function(){
	$('.name_error').hide();
	$('.email_error').hide();
	$('.resume_error').hide();
	$('input.text-input').css({backgroundColor:"#eee"});
	$('input.text-input').focus(function(){
		$(this).css({backgroundColor:"#dff4ff"});
	});
	$('input.text-input').blur(function(){
		$(this).css({backgroundColor:"#eee"});
	});
	$('textarea.text-input').css({backgroundColor:"#eee"});
	$('textarea.text-input').focus(function(){
	    $(this).css({backgroundColor:"#dff4ff"});
  	});
	$('textarea.text-input').blur(function(){
		$(this).css({backgroundColor:"#eee"});
	});
	
	$('.button-grey').click(function() {
		var i = $(this).attr('id');
		//console.log(i);
		//FORM
		$('#submit-btn' + i).click(function(){
			$('span#formError').hide();
			var to = $('#to' + i).val();
			//console.log(to);
			
			var name = $('#name' + i).val();
			//console.log(name);
			
			if (name == '') {
				$('<span style="margin-left:20px; color:red" id="formError"><- This field is require</span>').appendTo('.name_form[for$='+ i + ']');
				$('input#name' + i).focus();
				return false;
			}
			
			var email = $('input#email' + i).val();
			//console.log(email);
			
			if (email == '') {
				$('<span style="margin-left:20px; color:red" id="formError"><- This field is require</span>').appendTo('.email_form[for$=' + i + ']');
				$('input#email' + i).focus();
				return	false;
			}
			var resume = $('textarea#resume' + i).val();
			if (resume == '') {
				$('<span style="margin-left:20px; color:red" id="formError"><- This field is require</span>').appendTo('.resume_form[for$=' + i + ']');
				$('textarea#resume' + i).focus();
				return false;
			}
			
			var dataString = 'to=' + to + '&name=' + name + '&email= ' + email + '&resume=' + resume;
			
			$.ajax({
				type : "POST",
				url : "bin/process_working.php",
				data : dataString,
				success : function() {
					$('#job_form' + i).html("<div id='message'></div>");
					$('#message').html('<h2>Your information have been submitted successfully!</h2>')
					.append("<p>We will be in touch soon.</p>")
					.hide()
					.fadeIn(1500);
				}
			});
			return false;
		});
		// FORM END
	});
	
});