Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
?
Solved

show/hide the <div> tag is not working

Posted on 2011-05-04
14
Medium Priority
?
369 Views
Last Modified: 2012-05-16
I have one hyperlink in that i call 3 functions one by one in onclick event.

<html>
<body>
<form name = "bulkcontactfrm" method="POST" action="<%= servletPath %>>
    <div id="saveDiv" layoutAlign="top" style="display:block;"> 
	    <table id=""  align="left"  border="0" cellpadding="0" cellspacing="0">
		<tr>
		     <td>
			<a href="javascript:void(0);" onclick="isAllowedToResubscribe(document.bulkcontactfrm); manipulateDIV(document.bulkcontactfrm); resubscribeCall(document.bulkcontactfrm);">&#160;Re-Subscribe</zoniac:roundrect>&#160;</a>
		    </td>
		</tr>                        
	    </table>
    </div>
    <div id="loadingDiv" class="cellWhiteBGFont" layoutAlign="top" style="display: block;"><p><img src="<%=ImageMappingManager.getImageName("imgLoading")%>" name = "b1">&nbsp;&nbsp;<font size='3'><b>Please wait...<b></font></p>
    </div>
</form>
</body>
</html>

Open in new window


Functionality flow
==================

First function validate the data using ajax call
-------------------------------------------
function isAllowedToResubscribe(form) {
	//Client validation takes here 
	processAjaxRequestPost('ajaxRequestPost','SimpleHandler','getResubscribeEmailValidationDetails',emilIDStr,sourcefromStr);
}

Open in new window


Second function hide the content in UI and show the Processing image in <DIV> tag
----------------------------------------------------------------------------------
function manipulateDIV(form) {
	hideSaveDiv();
	showLoadingDiv();
}

function hideSaveDiv() {
	
	//hide the Re-Subscribe hyperlink 
	document.getElementById('saveDiv').style.display='none';
}
function showLoadingDiv() {
	//show the Processing image 
	document.getElementById('loadingDiv').style.display='block';
}

Open in new window


Third function is for form submit using ajax call
-------------------------------------------------
function resubscribeCall(form) {
	//processAjaxRequestPost('ajaxRequestPost','SimpleHandler','getResubscribeEmailDetails',emilIDStr,sourcefromStr);
}

Open in new window


After click the hyperlink validation function calls and get succeed, conformation message appear click OK on the conformation.

My Objective:
------------
Hide the hyperlink <DIV> tag and show the Progress <DIV> tag.

My Problem
----------
The hyperlink <DIV> tag has not been hide so Progress image not getting loaded.

Thanks in Advance
0
Comment
Question by:Zoniac
  • 6
  • 6
  • 2
14 Comments
 
LVL 47

Expert Comment

by:for_yan
ID: 35695645
Are you sure that onClick would work this way - do you mean that you click it once
and one function executes, then second time - another function, and third time - third function?
Or maybe I misunderstood you?
0
 
LVL 1

Author Comment

by:Zoniac
ID: 35695654
Hi for_yan,

YES, you're right.
0
 
LVL 47

Expert Comment

by:for_yan
ID: 35695664
You mean I'm right that it should operate this way?
But i have some doubts about it, I was asking are you sure that
it should operate this way?
If it would where would it store the current state - say i clcked the first time, then
some time later the second time - so it remembers  somewhere that it need to
execute say second part or third part?
0
Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

 
LVL 1

Author Comment

by:Zoniac
ID: 35695673
Hi for_yan,

In fact, my original code was a single JavaScript function call.  For sake of clarity, I've just shown it in 3 JavaScript calls.  But even then in a single JavaScript function call, this is not working.

Do you have a different idea/approach for me to try out?
0
 
LVL 47

Expert Comment

by:for_yan
ID: 35695690
when you leave only the second function - does it still not function?
0
 
LVL 1

Author Comment

by:Zoniac
ID: 35695719
I also tried out the following:

If I introduce a JavaScript alert() just before the AJAX call as shown below, then it is working as I expected:

function resubscribeCall(form)
{
	alert('Hi');
	processAjaxRequestPost('ajaxRequestPost','SimpleHandler','getResubscribeEmailDetails',emilIDStr,sourcefromStr);
}

Open in new window

0
 
LVL 47

Expert Comment

by:for_yan
ID: 35695725

when you leave only the second function does it show/no show div ?
0
 
LVL 47

Expert Comment

by:for_yan
ID: 35695762
If the response to my question is positive, then
I think we need to have one function which within itself should take care
of switching between options and monitoring state - where to switch next.

0
 
LVL 1

Author Comment

by:Zoniac
ID: 35695780
> when you leave only the second function does it show/no show div ?

Yes, on leaving the second function, I could see saveDiv becoming hidden and loadingDiv becoming visible. I tried out this by removing the 3rd function call in anchor <a>  tag.
0
 
LVL 47

Expert Comment

by:for_yan
ID: 35695800
Then I think you should call one function, but inside this function you should
determine which of the three methods to call. I'm not quite sure waht is the bet way
to preserve state in JavaScript - so we need to know are we clicking first time, second time
or third time. One thing which comes to my mind is that we can have hidden
text elment in the form and it can be accessed from java script and we'll
increment its value up to three times and then make it zero again.
maybe you can do it simpler, but this should also work
0
 
LVL 20

Expert Comment

by:Sathish David Kumar N
ID: 35696022
The real pblm i check in code iss ...
  >>>>>>>>>>>>>>>    <div id="loadingDiv" class="cellWhiteBGFont" layoutAlign="top" style="display: block;"><p>
<img src="<%=ImageMappingManager.getImageName("imgLoading")%>" name = "b1">&nbsp;&nbsp;<font size='3'><b>Please wait...<b></font></p>  

Ur image  tag ...
here your starting the image tag ... with double qutoe
>>="<%=ImageMappingManager.getImageName(" --------> end  here  so that only its not working propely

change that as single qutoe

="<%=ImageMappingManager.getImageName('imgLoading')%>"
0
 
LVL 20

Accepted Solution

by:
Sathish David  Kumar N earned 1500 total points
ID: 35696030
And i founfd one more issue is ...

your not close form action

>>>>>> action="<%= servletPath %>>  
0
 
LVL 1

Author Comment

by:Zoniac
ID: 35971958
I solved this problem through form submit insted of ajax call.......Its working fine
0
 
LVL 1

Author Closing Comment

by:Zoniac
ID: 37974807
Thanks for your suggestions.
0

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

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

I found this questions asking how to do this in many different forums, so I will describe here how to implement a solution using PHP and AJAX. The logical flow for the problem should be: Write an event handler for the first drop down box to get …
This article discusses how to implement server side field validation and display customized error messages to the client.
As many of you are aware about Scanpst.exe utility which is owned by Microsoft itself to repair inaccessible or damaged PST files, but the question is do you really think Scanpst.exe is capable to repair all sorts of PST related corruption issues?
Enter Foreign and Special Characters Enter characters you can't find on a keyboard using its ASCII code ... and learn how to make a handy reference for yourself using Excel ~ Use these codes in any Windows application! ... whether it is a Micr…
Suggested Courses

564 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