﻿
    // prepare the form when the DOM is ready
    $(document).ready(function() {


    //$.post("./Handlers/CountrySelectionHandler.ashx", "Action=Load" , function(data) {
    // debugger  
    //   populateDropdown(data);
    //  });
    


	$("#formContact").validate({
		rules: {
		Name: "required",
			Email: {
				required: true,
				email: true
			}
			
		},
		messages: {
			Name: " Required",
			Email: " Valid email required"
		}
	});
	
	
	

    $("#imgloader").hide();
    $("#demoresponse").hide();
    
        var options = {
            target: '#contactResponse',   // target element(s) to be updated with server response
            beforeSubmit: validationHandler,  // pre-submit callback 
            success: responseHandler, // post-submit callback 
            url: './Handlers/FormPostsHandler.ashx',        // override for form's 'action' attribute 
            //type:      type        // 'get' or 'post', override for form's 'method' attribute 
            //dataType:  null        // 'xml', 'script', or 'json' (expected server response type) 
            clearForm: true       // clear all form fields after successful submit 
            //resetForm: true        // reset the form after successful submit 

            // $.ajax options can be used here too, for example: 
            //timeout:   3000 
        };

        // bind to the form's submit event
        $('#formContact').submit(function() {
            // inside event callbacks 'this' is the DOM element so we first 
            // wrap it in a jQuery object and then invoke ajaxSubmit 
            $(this).ajaxSubmit(options);
            // !!! Important !!! 
            // always return false to prevent standard browser submit and page navigation 
            return false;
        });

//        $("#Email").keyup(function() {

//        var email = $("#Email").val();

//        if (email != 0) {
//             
//                if (isValidEmailAddress(email)) {
//                    $("#validEmail").css({
//                        "background-image": "url('siteimages/validYes.png')"
//                    });
//                } else {
//                    $("#validEmail").css({
//                    "background-image": "url('siteimages/validNo.png')"
//                    });
//                }
//            } else {
//                $("#validEmail").css({
//                    "background-image": "none"
//                });
//            }

//        });




    });

    function isValidEmailAddress(emailAddress) {
        var pattern = new RegExp(/^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i);
        return pattern.test(emailAddress);
    }

    function validationHandler(formData, jqForm, options) {
    
        for (var i = 0; i < formData.length; i++) {
            if (formData[i].name == 'Email' || formData[i].name == 'Name') {
            
            if (formData[i].name == 'Email') {
                if (!isValidEmailAddress(formData[i].value))
                    return false;
            }
            else {
                if (!formData[i].value) {
                    return false;
                }
            }
               // if (formData[i].name == 'Email') {
                //    if (!isValidEmailAddress(formData[i].value) || !formData[i].value) {
//                        $("#validEmail").css({
//                            "background-image": "url('siteimages/validNo.png')"
                      //  });

                       // return false;

                 //   }
                 //   else
//                        $("#validEmail").css({
//                            "background-image": "none"
//                        });
              //  }
              //  else
              //      if (!formData[i].value) {
//                    $("#validName").css({
//                        "background-image": "url('siteimages/validNo.png')"
//                    });


            //        return false;
            //    }
            //    else {
//                    $("#validName").css({
//                        "background-image": "none"
//                    });
            //    }
            }
        }
         
        $("#imgloader").show();
        $("#ancSubmitter").enable(false);
     

    }
    // post-submit callback
    function responseHandler(responseText, statusText, xhr, $form) { 
     
        $("#imgloader").hide();
     
        if (responseText == "demo") {
            $("#demoresponse").show();
            $("#democontent").hide();
        }
        else {

            $("#formContainer").hide();
        
        }
        
    }
    function submitContactForm() {
     
        $('#formContact').submit();


    }




    function populateDropdown(data) {


var selectValues  = {"name":"Choose","value":"Choose","name":"Afghanistan","value":"AF"};
var auxArr = [];

$.each(selectValues, function(i, option) {
    auxArr[i] = "<option value='" + option.value + "'>" + option.name + "</option>";
});
 
$('#country').append(auxArr.join('')); 


    }
     //   var selectValues = { "1": "test 1", "2": "test 2" }; 

//var selectValues  = {"name":"Choose","value":"Choose","name":"Afghanistan","value":"AF"};


//for (key in data) {
//    
//        $('#country').append('<option value="' + key + '">' + data[key] + '</option>'); 
//  } 
//         
//          

//    }
// var respObj = null;

// try {
//     respObj = JSON.parse(data);
// }
// catch (e) { }
 
 //debugger 


 




// $('#country').html('');

// $.each(respObj, function(id, option) {
// $('#country').append($('<option></option>').val(option.value).html(option.name));
// });	
 
 	     
//        var auxArr = [];

//        $.each(respObj, function(i, option) {
//            auxArr[i] = "<option value='" + option.value + "'>" + option.name + "</option>";

//        });
//        debugger 
//        
//        $('#country').append(auxArr.join(''));
  //  }
