Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations SkipVought on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

help experimenting with a custom prompt

Status
Not open for further replies.

TurboSRT4

Programmer
Nov 23, 2009
47
0
0
US
hello i have a custom prompt box you can see here the problem you will see is that the value entered in the prompt appears then disappears can you please help here is my code.

<head>
<style type="text/css">
<!--
#customPrompt {
position:absolute;
left:65px;
top:69px;
width:279px;
height:143px;
z-index:2000;
background-color: #FF9900;
}
-->
</style>



<script type="text/javascript">

function showEl(id)
{
var el = document.getElementById(id);
el.style.display = "";

}
function hideEl(id)
{
var el = document.getElementById(id);
var su_val=document.pro.myNumber.value;
document.getElementById('test_span').innerHTML = su_val;
el.style.display = su_val;

}
</script>
</head>
<body>
<!-- CUSTOM FLOATING PROMPT -->
<div id="customPrompt" style="display:none;">
<p>Enter some number</p>
<p>
<form name=pro>
<input type="text" id="myNumber" />
<input type="submit" name="button" id="button" value="Submit" onClick="hideEl('customPrompt')" />
</form>
</p>
</div>
<!-- END CUSTOM PROMPT -->

<p><a onClick="showEl('customPrompt')" style="cursor:pointer;"> Open Prompt </a> </p>


<p><span id=test_span></span> </p>
</body>

thanks in advance
 
Without trying the code to find out, my guess is it's most likely due to the form submission re-loading the page.

If that is the case, then if you don't want this behaviour, either don't use a form, don't use a submit button, or trap the onsubmit event and return false.

Hope this helps,
Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:
Code Couch Tech Snippets & Info:
 
if i do not use form how can i retrieve the value of the form field
var su_val=document.pro.myNumber.value;
if i remove the form named pro.... how can i retrieve the value. thanks.
 
ok i partially got it..... i changed the code to this
function hideEl(id)
{

var su_val=document.pro.myNumber.value;
document.getElementById('span_id').innerHTML = su_val;


}
</script>
</head>
<body>
<!-- CUSTOM FLOATING PROMPT -->
<div id="customPrompt" style="display:none;">
<p>Enter some number</p>
<p>
<form name=pro method=get action=#>
<input type="text" id="myNumber" />
<input type="button" name="button" id="button" value="Submit" onClick="hideEl('customPrompt')" />
</form>
</p>
</div>
<!-- END CUSTOM PROMPT -->

<p><a onClick="showEl('customPrompt')" style="cursor:pointer;"> Open Prompt </a> </p>


<p><span id=span_id></span> </p>
</body>

itworks but the popup box does not go away thanks
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top