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!

Register Log in
  • Congratulations Mike Lewis 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

TurboSRT4

Programmer
Nov 23, 2009
47
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
 
Sort by date Sort by votes
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:
 
Upvote 0 Downvote
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.
 
Upvote 0 Downvote
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
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

Mike Lewis
  • Locked
  • Question
Anyone here got any experience of Grid.JS (a sortable Javascript grid) 1
Replies
5
Views
740
Mike Lewis
Mike Lewis
malpa
  • Locked
  • Question
Graph the selection of a html table row
Replies
0
Views
333
malpa
malpa
edgarv
  • Locked
  • Question
Field with numbers and characters get nan
Replies
1
Views
106
ggriffit
ggriffit
penguinspeaks
  • Locked
  • Question
How do I pass a classic asp variable to JS
Replies
1
Views
499
xwb
xwb
Disskyz
  • Locked
  • Question
Need help with javascript date 1
Replies
4
Views
111
Smurfmania
Smurfmania

Part and Inventory Search

Sponsor

Back
Top