Finish registerform validation

Prepare data for submit

js/app.js

@@ -18,47 +18,15 @@ function showmsg(msgTxt,ok){
 	}
 	$("#statusmsg").show();
 }
-function limpiarFormRegistro(){
-	$("#registerform input").val("");
-	$("#registerform textara").val("");
-	$("#registerform #btntipodoc").html('Tipo <span class="caret"></span>');
-	$("#registerform #btnpais").html('Pais <span class="caret"></span>');
-	$("#registerform #btntrabaja").html('Seleccione <span class="caret"></span>');
-	$('#registerform input[name="financiacion"]').prop("checked",false);
-	grecaptcha.reset();
-	//$("#statusmsg").hide();
-}
 
-function inputvalidate(){
+
-	var parent = $(this).parents("div.form-group");
-	if($(this).is(":invalid"))
-		parent.addClass("has-error");		
-	else{
-		parent.removeClass("has-error");
-		//parent.removeClass("has-warning");
-		parent.addClass("has-success");
-	}
-}
 function onReturnCallback(response){
 	if(response != ""){		
 		$("div.g-recaptcha").tooltip("hide");
 		$("div.g-recaptcha").tooltip("destroy");		
 	}
 }
-function validateTextarea(){
+
-	if($(this).val() == ""){
-		//$('#detallefinan').removeClass("has-warning");
-		$('#detallefinan').addClass("has-error");
-		$("#detallefinan textarea").tooltip("hide");
-		$("#detallefinan textarea").tooltip("destroy");
-	}
-	else{
-		//$('#detallefinan').removeClass("has-warning");
-		$('#detallefinan').removeClass("has-error");
-		$('#detallefinan').addClass("has-success");
-		
-	}
-}
 function loadFragments(){
 	$("#header").load("snippets/header.html",routeMenu); 
 	$("#footer").load("snippets/footer.html"); 
@@ -99,15 +67,10 @@ $(document).ready(function(){
     	parallax();
 	});
 	
-	//loadFragments();
+	
 	routeMenu();
-	$("#statusmsg").hide();
+	
-	/*$('input').focusin(inputvalidate);
+	
-	$('input').focusout(inputvalidate);
-	$('input').keyup(inputvalidate);
-	$("#detallefinan textarea").focusin(validateTextarea);
-	$("#detallefinan textarea").focusout(validateTextarea);
-	$("#detallefinan textarea").keyup(validateTextarea);	*/
 	
 	$('#contactform').submit(function(event){
         var fail=false;
@@ -143,105 +106,5 @@ $(document).ready(function(){
 	});	
 	
 	
-	/*$("#detallefinan").hide();	
-	$("#detallefinan textarea").val("");*/
-
 	
-	/*$('#registerform').submit(function(event){
-		var fail = false;
-		$("#statusmsg").hide();		
-		event.preventDefault();
-		if(tipodoc == null){			
-			$('#btntipodoc').tooltip({
-				"title":"Seleccione Tipo de Documento",
-				"html":true,
-				"pacement":"auto left",
-				"trigger":"manual",
-				"delay":{"show":100,"hide":2000}
-				
-			});
-			$('#btntipodoc').tooltip("show");
-			fail=true;
-			
-		}
-		if(pais == null){
-			$('#btnpais').tooltip({
-				"title":"Seleccione País",
-				"html":true,
-				"pacement":"auto left",
-				"trigger":"manual",
-				"delay":{"show":100,"hide":2000}
-				
-			});
-			$('#btnpais').tooltip("show");
-			fail=true;
-		}
-		if(trabaja == null){
-			$('#btntrabaja').tooltip({
-				"title":"Especifique donde trabaja",
-				"html":true,
-				"pacement":"auto left",
-				"trigger":"manual",
-				"delay":{"show":100,"hide":2000}
-				
-			});
-			$('#btntrabaja').tooltip("show");
-			fail=true;
-		}
-		if(!finan){
-			$('#sifinan').tooltip({
-				"title":"Especifique si precisa financiación",
-				"pacement":"auto right",
-				"trigger":"manual"				
-			});
-			$('#sifinan').tooltip("show");	
-			fail=true;
-		}
-		if($("#detallefinan textarea").val()=="" && 
-			$('input:radio[name="financiacion"]:checked').val()=="si"){
-			$("#detallefinan textarea").tooltip({
-				"title":"Escriba el detalle",
-				"html":true,
-				"pacement":"auto left",
-				"trigger":"manual"
-				});
-			$("#detallefinan textarea").tooltip("show");
-			fail=true;
-		}
-		if($('#g-recaptcha-response').val() == ""){			
-			$("div.g-recaptcha").tooltip({
-				"title":'Marque "No soy un robot"',
-				"pacement":"right",
-				"trigger":"manual"
-			});
-			$("div.g-recaptcha").tooltip("show");
-			fail=true;
-		}
-		
-		if(!fail){
-			$("#txtpais").val(pais);	
-			$("#txttipodoc").val(tipodoc);
-			$("#txttrabaja").val(trabaja);
-			console.log($(this).serialize());
-
-			var post = $.post('register', $(this).serialize());
-			post.done(function(data){
-				console.log(data);
-			data = $.parseJSON(data);
-			if(data.success){
-				showmsg("Registro Exitoso. <br/>Usted recibirá un e-mail con la confirmación de su registro",true);
-				limpiarFormRegistro();
-			}
-			else{
-				showmsg(data.errors,false);
-			}
-			console.log(data)
-
-			});
-			post.fail(function(error){
-				console.log(error)
-		
-			});
-		}
-	});*/
 });

js/registerform.js

@@ -1,3 +1,5 @@
+
+
 $().ready(function(){
 	$("#statusmsg").hide();
 	
@@ -22,7 +24,9 @@ $().ready(function(){
 	});
 	
 
-	
+	$('#registerform').on('submit',function(e) {
+		e.preventDefault();
+	});
 	$('#registerform').validate({
 		ignore: '',
 		rules: {
@@ -57,10 +61,16 @@ $().ready(function(){
 			invited: "Select one option please",
 			financiacion: "Select one option please",
 			letterinvited: "Select one option please"
-			
 
 				
 		},
+		submitHandler: function(form){
+			var formdata = $(form).serializeArray();
+			formdata.find(item => item.name === "pais").value = $("#pais").select2("data")[0].text;
+			formdata.find(item => item.name === "roomtype").value = $("#roomtype").select2("data")[0].text;
+			var parameters = $.param(formdata);
+			console.log(parameters);			
+		},		
 		errorElement: "em",
 		errorPlacement: function ( error, element ) {
 			// Add the `help-block` class to the error element
@@ -72,6 +82,7 @@ $().ready(function(){
 				pariente = element.parents(".form-group").children(".radioerror");
 				
 				pariente.append(error);
+				error.css("color", "#a94442")
 				//element.parents(".form-group").children(".radioerror").append(error);
 				//element.parents(".radios").append(error);
 				
@@ -82,7 +93,7 @@ $().ready(function(){
 			if ( !element.next( "span" )[ 0 ] && !esradio ) 
 				$( "<span class='glyphicon glyphicon-remove form-control-feedback'></span>" ).insertAfter( element );
 			if(esradio)
-				element.parents(".form-group").children(".radioerror").prepend("<span class='glyphicon glyphicon-remove'></span>");
+				element.parents(".form-group").children(".radioerror").prepend("<span style='color:#a94442;' class='glyphicon glyphicon-remove'></span>");
 			
 		},
 		success: function(label,element){
@@ -90,8 +101,9 @@ $().ready(function(){
 			var pariente;
 			if ( esradio ) {
 				pariente = $(element).parents(".form-group").children(".radioerror");
+				var iconstatus = $(pariente).children("span");
 				if (!$(pariente).children("span")[ 0 ])
-					pariente.preprend("<span class='glyphicon glyphicon-ok form-control-feedback'></span>");					
+					pariente.preprend("<span style='color:#3c763d;' class='glyphicon glyphicon-ok form-control-feedback'></span>");					
 			}
 			else if ( !$( element ).next( "span" )[ 0 ]){				
 					$( "<span class='glyphicon glyphicon-ok form-control-feedback'></span>" ).insertAfter( $( element ) );
@@ -106,7 +118,9 @@ $().ready(function(){
 			if ( esradio ) {
 				pariente = $(element).parents(".form-group").children(".radioerror");
 				pariente.addClass("has-error").removeClass("has-success");
-				pariente.children( "span" ).addClass( "glyphicon-remove" ).removeClass( "glyphicon-ok" );
+				var iconstatus = pariente.children( "span" );
+				iconstatus.addClass( "glyphicon-remove" ).removeClass( "glyphicon-ok" );
+				iconstatus.css("color","#a94442");
 			}
 			else
 				$( element ).next( "span" ).addClass( "glyphicon-remove" ).removeClass( "glyphicon-ok" );
@@ -119,7 +133,10 @@ $().ready(function(){
 			if ( esradio ) {
 				pariente = $(element).parents(".form-group").children(".radioerror");
 				pariente.addClass("has-success").removeClass("has-error");
-				pariente.children( "span" ).addClass( "glyphicon-ok" ).removeClass( "glyphicon-remove" );
+				var iconstatus = pariente.children( "span" );
+				iconstatus.addClass( "glyphicon-ok" ).removeClass( "glyphicon-remove" );
+				iconstatus.css("color","#3c763d");
+				
 			}
 			else
 				$( element ).next( "span" ).addClass( "glyphicon-ok" ).removeClass( "glyphicon-remove" );

registration.php

@@ -48,7 +48,7 @@
     <div class="form-group">
       <label class="col-sm-2 control-label" for="pais">Country</label>
       <div class="col-sm-8 input-container">    
-        <select id="pais">
+        <select id="pais" name="pais">
           <option></optoon>
         </select>  
         
@@ -125,7 +125,7 @@
         <label class="radio-inline"><input id="sifinan" type="radio" name="letterinvited" value="si">Yes</label>
         <label class="radio-inline"><input id="nofinan" type="radio" name="letterinvited" value="no">No</label>        
       </div>
-      <div class="col-sm-7 col-sm-offset-2 radioerror">
+      <div class="col-sm-10 col-sm-offset-2 radioerror">
 
       </div>             
     </div>
@@ -133,7 +133,7 @@
       <!-- es requerido -->
       <label class="control-label col-sm-2" for="roomtype">Rooming Preference</label>
       <div class="col-sm-8 input-container">
-        <select id="roomtype">
+        <select id="roomtype" name="roomtype">
           <option></optoon>
         </select>
       </div>