Member Avatar for jacob21

Hi,
I m using this javascript code.
for form submission i am using ajax.The problem is date calender is not showing
when i use ajax file.
If i remove ajax file,its working fine.
Need help as i am using ajax first time

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>PG Accomodation</title>


<link rel="stylesheet" type="text/css" href="css/styles.css"/>
<link rel="stylesheet" type="text/css" href="css/style.css"/>

<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="script.js"></script>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="requirement_validation.js"></script>
<script type="text/javascript">jQuery(document).ready(function($) {$('a[rel*=facebox]').facebox() })</script>

<link rel="stylesheet" media="screen" href="styles/vlaCal-v2.1.css" type="text/css" />
<script type="text/javascript" src="jslib/mootools-1.2-core-compressed.js"></script>
<script type="text/javascript" src="jslib/vlaCal-v2.1-compressed.js"></script>

<style>
	.pickerImg { position: absolute; margin-left: -16px; margin-top: 5px; cursor: pointer;	}
	.infoBox { background-color: #fefdec; border: 1px solid #edebcd; padding: 6px; margin-bottom: 20px;	}
</style>

<script type="text/javascript">
window.addEvent('domready', function() 
{ 
	new vlaDatePicker('exampleII', { separator: '.', leadingZero: true, twoDigitYear: false, offset: { y: 3 }, alignX: 'center', alignY: 'bottom' });
	new vlaDatePicker('exampleI', { separator: '.', leadingZero: true, twoDigitYear: false, offset: { y: 3 }, alignX: 'center', alignY: 'bottom' });
	new vlaDatePicker('exampleIII', { openWith: 'togglePicker', offset: { y: -2, x: 2 }, separateInput: { day: 'day', month: 'month', year: 'year' } });
	new vlaDatePicker('exampleIV-A', { style: 'adobe_cs3', offset: { y: 1 }, format: 'm/d/y', ieTransitionColor: '' }); 
	new vlaDatePicker('exampleIV-B', { style: 'apple_widget', offset: { x: 3, y: 1 } });
	new vlaCalendar('exampleV', { startMonday: true });
	new vlaDatePicker('exampleVI', { defaultView: 'year' });
	new vlaDatePicker('exampleVII', { prefillDate: { day: 12, month: 12, year: 2012 } });			
});	
</script>
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
$(function() {

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);
};
$(document).ready(function()
{ 

	$("#username").blur(function()
	{
		//remove all the class add the messagebox classes and start fading
		$("#msgbox").removeClass().addClass('messagebox').text('Checking...').fadeIn("slow");
		//check the username exists or not from ajax
		$.post("user_availability.php",{ username:$(this).val() } ,function(data)
        {
		  if(data=='no') //if username not avaiable
		  {
		  	$("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox
			{ 
			  //add message and change the class of the box and start fading
			  $(this).html('This email Already exists').addClass('messageboxerror').fadeTo(900,1);
			  $("#password").attr("disabled", "disabled");
			  $("#rpassword").attr("disabled", "disabled");
			  $("#mobile").attr("disabled", "disabled");
			  $("#city").attr("disabled", "disabled");
			  $("#name").attr("disabled", "disabled");
			  $("#type").attr("disabled", "disabled");
			});		
          }
		  else
		  {
		  	$("#msgbox").fadeTo(200,0.1,function()  //start fading the messagebox
			{ 
			  //add message and change the class of the box and start fading
			  $(this).html('Email available to register').addClass('messageboxok').fadeTo(1000,1);
			});
		  }
				
        });
 
	});
});

$(".submit").click(function() {

    var name = $("#name").val();
	var username = $("#username").val();
	var password = $("#password").val();
	var type = $("#type").val();
	var mobile=	$("#mobile").val();
	var city=$("#city").val();
	var rpassword=$("#rpassword").val();
    var dataString = 'name='+ name + '&username=' + username + '&password=' + password + '&rpassword=' + rpassword+ '&type=' + type + '&mobile=' + mobile + '&city=' + city;
	if(name=='' || username=='' || password=='' || rpassword=='' || type=='' || city=='' || mobile=='')
	{
	$('.success').fadeOut(200).hide();
    $('.error').fadeOut(200).show();
    $('.pwd_error').fadeOut(200).hide();
    $('.error1').fadeOut(200).hide();
    $('#msgbox').fadeOut(200).hide();
    $("#msgbox").fadeTo(200,0.1,function()  //start fading the messagebox
	{ 
	  //add message and change the class of the box and start fading
	  $(this).html('Email available to register').addClass('messageboxok').fadeTo(1000,1).hide();
	});
	}
	
	else if( !isValidEmailAddress(username) ) 
	  { 
	   $('.success').fadeOut(200).hide();
       $('.error').fadeOut(200).hide();
       $('.error1').fadeOut(200).show();
       $('.pwd_error').fadeOut(200).hide();
       $('#msgbox').fadeOut(200).hide();
       $("#msgbox").fadeTo(200,0.1,function()  //start fading the messagebox
	{ 
	  //add message and change the class of the box and start fading
	  $(this).html('Email available to register').addClass('messageboxok').fadeTo(1000,1).hide();
	});
	  }
	  
	else if(!(password==rpassword))
	{
	 $('.success').fadeOut(200).hide();
     $('.error').fadeOut(200).hide();
     $('.pwd_error').fadeOut(200).show();
     $('.error1').fadeOut(200).hide();
     $('#msgbox').fadeOut(200).hide();
  	$("#msgbox").fadeTo(200,0.1,function()  //start fading the messagebox
	{ 
	  //add message and change the class of the box and start fading
	  $(this).html('Email available to register').addClass('messageboxok').fadeTo(1000,1).hide();
	});

	}
	else
	{
	$.ajax({
	type:"POST",
    url:"join.php",
    data:dataString,
    success: function(){
	$('.success').fadeIn(200).show();
    $('.error').fadeOut(200).hide();
    $('.pwd_error').fadeOut(200).hide();
    $('.error1').fadeOut(200).hide();
    $('#msgbox').fadeOut(200).hide();

    $('#name').val('');
    $('#type').val('');
    $('#password').val('');
    $('#rpassword').val('');
    $('#username').val('');
    $('#mobile').val('');
    $('#city').val('');
		
   }
});

	}
		
    return false;
	});

});
</script>
  • 3 Contributors
  • 4 Replies
  • 259 Views
  • 9 Hours Discussion Span
  • Latest Post Latest Post by Stefano Mtangoo

Recommended Answers

All 4 Replies

Member Avatar for Stefano Mtangoo

I think it is JS question than PHP. BTW, why don't you organize your JS code into finctions in single file and just call those functions? Your code is a mess and hard to read. May be post the relevant lines only!

Member Avatar for lps

Instead of trying the whole bunch of code, I suggest that you should try to cut some of the code part by part to monitor which part of the code is not functioning and thus try to debug it. If the problem is not solved, you can try to asking the question here with specific question instead of posting whole bunch of code here.

Member Avatar for jacob21

I think it is JS question than PHP. BTW, why don't you organize your JS code into finctions in single file and just call those functions? Your code is a mess and hard to read. May be post the relevant lines only!

This is my ajax code.

I am using calender in javascript.when i use below ajax code calender is not working.
otherwise it is working.
need suggestion
want to show both calender n ajax file both

<script type="text/javascript">
$(function() {


$(document).ready(function()
{ 

	$("#username").blur(function()
	{
		//remove all the class add the messagebox classes and start fading
		$("#msgbox").removeClass().addClass('messagebox').text('Checking...').fadeIn("slow");
		//check the username exists or not from ajax
		$.post("user_availability.php",{ username:$(this).val() } ,function(data)
        {
		  if(data=='no') //if username not avaiable
		  {
		  	$("#msgbox").fadeTo(200,0.1,function() //start fading the messagebox
			{ 
			  //add message and change the class of the box and start fading
			  $(this).html('This email Already exists').addClass('messageboxerror').fadeTo(900,1);
			  $("#password").attr("disabled", "disabled");
			  $("#rpassword").attr("disabled", "disabled");
			  $("#mobile").attr("disabled", "disabled");
			  $("#city").attr("disabled", "disabled");
			  $("#name").attr("disabled", "disabled");
			  $("#type").attr("disabled", "disabled");
			});		
          }
		  else
		  {
		  	$("#msgbox").fadeTo(200,0.1,function()  //start fading the messagebox
			{ 
			  //add message and change the class of the box and start fading
			  $(this).html('Email available to register').addClass('messageboxok').fadeTo(1000,1);
			});
		  }
				
        });
 
	});
});

$(".submit").click(function() {

    var name = $("#name").val();
	var username = $("#username").val();
	var password = $("#password").val();
	var type = $("#type").val();
	var mobile=	$("#mobile").val();
	var city=$("#city").val();
	var rpassword=$("#rpassword").val();
    var dataString = 'name='+ name + '&username=' + username + '&password=' + password + '&rpassword=' + rpassword+ '&type=' + type + '&mobile=' + mobile + '&city=' + city;
	if(name=='' || username=='' || password=='' || rpassword=='' || type=='' || city=='' || mobile=='')
	{
	$('.success').fadeOut(200).hide();
    $('.error').fadeOut(200).show();
    $('.pwd_error').fadeOut(200).hide();
    $('.error1').fadeOut(200).hide();
    $('#msgbox').fadeOut(200).hide();
    $("#msgbox").fadeTo(200,0.1,function()  //start fading the messagebox
	{ 
	  //add message and change the class of the box and start fading
	  $(this).html('Email available to register').addClass('messageboxok').fadeTo(1000,1).hide();
	});
	}
	
	else if( !isValidEmailAddress(username) ) 
	  { 
	   $('.success').fadeOut(200).hide();
       $('.error').fadeOut(200).hide();
       $('.error1').fadeOut(200).show();
       $('.pwd_error').fadeOut(200).hide();
       $('#msgbox').fadeOut(200).hide();
       $("#msgbox").fadeTo(200,0.1,function()  //start fading the messagebox
	{ 
	  //add message and change the class of the box and start fading
	  $(this).html('Email available to register').addClass('messageboxok').fadeTo(1000,1).hide();
	});
	  }
	  
	else if(!(password==rpassword))
	{
	 $('.success').fadeOut(200).hide();
     $('.error').fadeOut(200).hide();
     $('.pwd_error').fadeOut(200).show();
     $('.error1').fadeOut(200).hide();
     $('#msgbox').fadeOut(200).hide();
  	$("#msgbox").fadeTo(200,0.1,function()  //start fading the messagebox
	{ 
	  //add message and change the class of the box and start fading
	  $(this).html('Email available to register').addClass('messageboxok').fadeTo(1000,1).hide();
	});

	}
	else
	{
	$.ajax({
	type:"POST",
    url:"join.php",
    data:dataString,
    success: function(){
	$('.success').fadeIn(200).show();
    $('.error').fadeOut(200).hide();
    $('.pwd_error').fadeOut(200).hide();
    $('.error1').fadeOut(200).hide();
    $('#msgbox').fadeOut(200).hide();

    $('#name').val('');
    $('#type').val('');
    $('#password').val('');
    $('#rpassword').val('');
    $('#username').val('');
    $('#mobile').val('');
    $('#city').val('');
		
   }
});

	}
		
    return false;
	});

});
</script>
Member Avatar for Stefano Mtangoo

All I would suggest for you is that: Since you use JQuery, then go for JQueryUIwhich makes code cleaner and simpler taking care of nasty processing fro you!

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.