Forum Moderators: open
I was wondering if there is a way to change a combo box into a text field after an onclick event.
Thanks in advance!
<html>
<head>
<title>Untitled</title>
<script language="JavaScript">
function changeToDropdown(CID) {
// How on earth?
}
</script>
</head>
<body>
<select name="persons" id="persons" style="width: 40px;">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select>
<a href="javascript:changeToDropdown('persons')">more then 10</a>
</body>
</html>
<html>
<head>
<title>Untitled</title>
<script language="JavaScript">
function changeToDropdown(CID) {
document.getElementByID(CID).innerHTML = '<input type="text" name="persons" id="persons" style="width:40px;">'
}
</script>
</head><body>
<div id="personbox">
<select name="persons" id="persons" style="width: 40px;">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select>
</div>
<a href="javascript:changeToDropdown('personbox')">more then 10</a>
</body>
</html>
Using innerHTML I think causes problems with browsers like Firefox and Safari(?).
I tried using document.getElementById("persons).tagName.toLowerCase() == 'input' but no dice.
Wow, you would think that this would be a rather simple ...
hvanvelzen, no problems with FF in my practice (do not know about Safari personally).
When I've spoken about "headache", I meant retaining variable(s) values, etc. I suppose you want to change the type not only to play with this, but to achieve something valuable.
the wrong way maybe. tagName is only a dom object attribute I suppose, but the object itself is something more. And probably - read-only one...
I really thought that the innerHTML property was buggy when it comes down to browser compatibility. But I just tested it in IE, Firefox (windows and mac) and Safari and it works just fine.
Thanks a bunch!
You're absolutely right. The funny thing is I actually always use the onlick event to trigger JavaScript. However when I'm working in a WYSIWYG editor (like Dreamweaver) I find it easier to type "javascript: ...." in the "Link" input box. So in this case it's just me being lazy!
But thanks for the advice!
You mean something like this:
<span onclick="alert('hi!');" style="cursor: hand;">Click me</span>
Dont't know about that one Moby_Dim ...
Here's the thing:
Using <span> I think deprives me of showing the user pseudo text styles (link, visited, active, hover). I don't know how to simulate these properties without using the <a> tag.
And in Firefox you don't get to see the hand cursor if you don't use the anchor tag.
Or am I missing something?
But, each way has it's own ++ and -- ,of course.
(script in the <head>)
function other(event) {
if (event.selectedIndex == event.options.length - 1) {
document.getElementById("other").style.display = "";
}
else {
document.getElementById("other").style.display = "none";
}
}
Along with these in the body:
<select name="event" onchange="javascript: other(this);">
<option>1</option>
<option>2</option>... your options ...
<option>More than 10</option>
</select><div id="other" style="display: none;">
<input type="text" class="text" name="other-event" />
</div>
When the last option is selected, the input box appears, allowing the user to type in whatever.
HTH, J.
Edit: fixed code :)
I like your idea also. The beauty of it is that you offer more flexibility to your users. If someone "accidently" clicks on "More than 10" they still are able to choose between typing and selecting.
I like, I like!
Thanks everybody!
If you have more ideas I'll be glad to hear them!
does anybody here have sticky mail problems?
Just stickied you so I guess not, have you tried contacting Brett?
J.
