?
Solved

jquery select box issue

Posted on 2011-05-13
4
Medium Priority
?
393 Views
Last Modified: 2012-05-11
Hi,
I have snippet of jquery I would like to use onload and onchange.

Do I just repeat as shown or is there a way I can create a function and call it?

I would also like one ajax callback to generate another given a condition.

$(document).ready(function()
{
   var id=$(".country").val();
		
		var dataString = 'id='+ id;
		
		$.ajax
		({
		type: "POST",
		url: "ajax.php",
		data: dataString,
		cache: false,
		success: function(html)
		{
			$(".area").hide();
			if(html == 'fail') {
				$(".city").hide();
				
			}
			else{
				$(".city").html(html);
				$(".city").show();
			}
		}
		});
    $(".country").change(function()
	{
		var id=$(".country").val();
		
		var dataString = 'id='+ id;
		
		$.ajax
		({
		type: "POST",
		url: "ajax.php",
		data: dataString,
		cache: false,
		success: function(html)
		{
			$(".area").hide();
			if(html == 'fail') {
				$(".city").hide();
				
			}
			else{
				$(".city").html(html);
				$(".city").show();
			}
		}
		});
	
	});
});

Open in new window

0
Comment
Question by:mmguide
  • 2
4 Comments
 

Author Comment

by:mmguide
ID: 35752691
Just to clarify the key to this problem seems to be the trigger of the ajax call to get the city and city list onloading the page.

Also having a function that can be called with an onchange event and onload event in jquery.
0
 
LVL 83

Expert Comment

by:leakim971
ID: 35753771
Yes you can :)

Check line 29 :
$(document).ready(function()
{
    $(".country").change(function()
	{
		var id=$(".country").val();
		
		var dataString = 'id='+ id;
		
		$.ajax
		({
		type: "POST",
		url: "ajax.php",
		data: dataString,
		cache: false,
		success: function(html)
		{
			$(".area").hide();
			if(html == 'fail') {
				$(".city").hide();
				
			}
			else{
				$(".city").html(html);
				$(".city").show();
			}
		}
		});
	
	}).change();
});

Open in new window

0
 
LVL 7

Accepted Solution

by:
jhp333 earned 2000 total points
ID: 35758777
I think this is a better coding practice - the intention is clearer.
function countryOnChange()
{
	var id=$(".country").val();

	var dataString = 'id='+ id;

	$.ajax
	({
	type: "POST",
	url: "ajax.php",
	data: dataString,
	cache: false,
	success: function(html)
	{
		$(".area").hide();
		if(html == 'fail') {
			$(".city").hide();
			
		}
		else{
			$(".city").html(html);
			$(".city").show();
		}
	}
	});
}

$(document).ready(function()
{
    countryOnChange();
    $(".country").change(countryOnChange);
});

Open in new window

0
 

Author Closing Comment

by:mmguide
ID: 35785528
I used php varibale to save repeating in code but this is better
0

Featured Post

Upgrade your Question Security!

Your question, your audience. Choose who sees your identity—and your question—with question security.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Hello World !, Thanks : My Sincere thanks to @Michael Male who encouraged me to write an article on this in my  blog (http://scribblejava.wordpress.com). Introduction:       There are several technical issues a developer may face in his…
There is basically two types of AJAX request in mootools. Request  and Request.HTML Request: Request is the basic XHR request class in MooTools. While not extremely useful on its own, it provides the basic functionality for both Request.HTM…
Integration Management Part 2
This lesson discusses how to use a Mainform + Subforms in Microsoft Access to find and enter data for payments on orders. The sample data comes from a custom shop that builds and sells movable storage structures that are delivered to your property. …
Suggested Courses

580 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question