Identify page loads completely and enable dropdown


I am working on 2.0 application using C# that uses lot of javascript and jquery.

I need help in jquery/javascript

On my webpage, I have dropdown. When user selects the dropdown, based on the selected dropdown another dropdown gets filled by reading webservice.

Its a long big code written by agency long back in jquery and difficult to understand the complete flow.

Now the problem is, if the page is not loaded completely and user tries to select the value from dropdown 2, then selections goes away and it is frustrating.

dropdown 2 is only displayed when user selects the value from dropdown 1.

I found that dropdwon 2 is filled from below code and all values are filled from code

Please advise how can I enable the dropdown once the page is completly loaded.

Also, please advise alternative solutions if anything is better.

Please advise

function GetAdventureTourName(strCity,strCateogry) 
   var xhrUrl = "/IFY/Middle/WPInterim.asmx/GetTourName";
	type: "POST",
	url: xhrUrl,
	data: '{"strCity":"' + strCity + '","strCategory":"' + strCateogry + '"}',
	contentType: "application/json; charset=utf-8",
	dataType: "json",
	success: function(responseData)

	    var optdefalut = document.createElement("option"); 
	    optdefalut.text = 'Select a Tour';
	    optdefalut.value = '';

	    $.each(eval(responseData), function () {

	    if(this['Value'] != "ALL")
		var opt = document.createElement("option");
		opt.text = this['Text'];
		opt.value = this['Value'];
	jqreinitFromData($('.itemTourSubCategory .jqTransformSelectWrapper'), $('.itemTourSubCategory  .jqTransformSelectWrapper select'));    
	error: function ()
	    alert("An unexpected error has occurred during processing.");


Open in new window

Also, method

is called from method BindTourName()

Can we call method
GetAdventureTourName($('.itemStayingIn select').val(),$('.itemTourCategory
once page is loaded completely

function BindTourName() 
        if ($('#ddlCategory').val() != "")
           GetAdventureTourName($('.itemStayingIn select').val(),$('.itemTourCategory select').val());

Open in new window

Just thinking.

Please advise the solutions.
Who is Participating?
GaryConnect With a Mentor Commented:
Ok see what you mean now.
Can you disable the jqtransform plugin and see if that is the culprit - I suspect it is.
Why not hide/disable the dropdown initally and in your document.ready change its display back to block/re-enable it.
Then you'll know your jquery is firing, same method is used in many websites.
tia_kamakshiAuthor Commented:
As I mentioned in my original post. Dropdown is not visible until user selects the dropdown 1.
As soon as user selects the value in dropdown 1 then based on the selected value dropdown 2 set to visible and fills the value.

My problem is if other things like images, js, css etc is not loaded completely and user clicks on dropdown 2 then dropdown closes and user is not able to select the value in dropdown 2.

which is frustrating for user.

Please advise.
Never miss a deadline with

The revolutionary project management tool is here!   Plan visually with a single glance and make sure your projects get done.

I think you misunderstood slightly, you disable the initial dropdown/elements until the page has fully loaded i.e. you disable any elements that rely on jQuery until it has been fully loaded at which point you can then enable all those elements
Using document.ready means the page has to be fully loaded, images and css are really irrelevant to this
document.ready will not fire until the whole page is fully loaded - that is the really important parts that make the page work
Do you have a link to the page?
tia_kamakshiAuthor Commented:
On site

select "select a tour category" dropdown and another dropdown will appear.

I am discussing on this dropdown in Book your Adventure widget

Please advise
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.