/    Sign up×
Community /Pin to ProfileBookmark

Javascript promptbox with select box wont work in ie7

I want to use the following code:

It works great in firefox 2
but in IE7, once text is entered in the textbox the select boxes start getting glitchy and wont drop down.

How can I fix this in IE7?

[CODE]
<html>
<head>

<style type=”text/css”>

input.prompt {border:1 solid transparent;

background-color:#99ccff;width:70;font-family:arial;font-size:12; color:black;}

td.titlebar { background-color:#FF9F40; color:#0000D2; font-weight:bold;font-family:arial; font-size:12;}

table.promptbox {border:1 solid #ccccff; background-color:#FFFFE6;

color:black;padding-left:2;padding-right:2;padding-bottom:2;font-family:arial; font-size:12;}

input.promptbox {border:1 solid #0000FF; background-color:white;width:100%;font-family:arial;font-size:12;

color:black; }

</style>

<script language=’javascript’>

var response = null

function prompt2(promptpicture, prompttitle, message, sendto) {

promptbox = document.createElement(‘div’);

promptbox.setAttribute (‘id’ , ‘prompt’)

document.getElementsByTagName(‘body’)[0].appendChild(promptbox)

promptbox = eval(“document.getElementById(‘prompt’).style”)

promptbox.position = ‘absolute’

promptbox.top = 100

promptbox.left = 200

promptbox.width = 300

promptbox.border = ‘outset 1 #bbbbbb’

document.getElementById(‘prompt’).innerHTML = “<table cellspacing=’0′ cellpadding=’0′

border=’0′ width=’100%’><tr valign=’middle’><td width=’22’ height=’22’ style=’text-indent:2;’ class=’titlebar’><img src='” +

promptpicture + “‘ height=’18’ width=’18’></td><td class=’titlebar’>” + prompttitle + “</td></tr></table>”

document.getElementById(‘prompt’).innerHTML = document.getElementById(‘prompt’).innerHTML

+ “<table cellspacing=’0′ cellpadding=’0′ border=’0′ width=’100%’ class=’promptbox’><tr><td>” + message +

“</td></tr><tr><td><input type=’text’ id=’promptbox’ onblur=’this.focus()’

class=’promptbox’><br><br><select><option>1</option><option>2</option><option>3</option><option>4</option></select><br><select><op

tion>a</option><option>b</option><option>c</option><option>d</option></select></td></tr><tr><td align=’right’><br><input

type=’button’ class=’prompt’ value=’OK’ onMouseOver=’this.style.border=”1 outset #dddddd”‘ onMouseOut=’this.style.border=”1

solid transparent”‘ onClick='” + sendto + “(document.getElementById(“promptbox”).value);

document.getElementsByTagName(“body”)[0].removeChild(document.getElementById(“prompt”))’> <input type=’button’ class=’prompt’

value=’Cancel’ onMouseOver=’this.style.border=”1 outset transparent”‘ onMouseOut=’this.style.border=”1 solid transparent”‘

onClick='” + sendto + “(“”);

document.getElementsByTagName(“body”)[0].removeChild(document.getElementById(“prompt”))’></td></tr></table>”

document.getElementById(“promptbox”).focus()

}

function myfunction(value) {

if(value.length<=0)

return false;

else

document.getElementById(‘output’).innerHTML=”<b>”+value+”</b>”;

}

</script>

<SCRIPT LANGUAGE=”JavaScript”>

<!–

function callPrompt(){

prompt2(‘btn1p.gif’, ‘My Prompt’,’Please enter your name ,if you want to chat with our <B>customer support

executive</B>’, ‘myfunction’);

}

//–>

</SCRIPT>

</head>

<body>

<input type=”button” value=’show prompt’ onClick=”callPrompt()”> </CENTER>

<div id=”output”

style=”position:absolute;background-color:#transparent;width:200;height:50;left:300;top:150;border:0″></div>

</body>
</html>
[/CODE]

to post a comment
JavaScript

4 Comments(s)

Copy linkTweet thisAlerts:
@JodarecodeauthorSep 17.2008 — Ok, it seems to work if I double click on the selectbox.......how would I make it so I only have to click once?
Copy linkTweet thisAlerts:
@FangSep 18.2008 — The code given will not work until all unterminated strings are corrected in function prompt2
Copy linkTweet thisAlerts:
@JodarecodeauthorSep 18.2008 — Im not sure I follow,

could you explain for future reference?

I might just keep this strict firefox anyway and get it corrected for firefox 3 as well. There are not too many users going to use this form anyway and its best to keep it simple since it will always be the same users.
Copy linkTweet thisAlerts:
@FangSep 18.2008 — The innerHTML strings are incorrectly formatted.
×

Success!

Help @Jodarecode spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...