|
|
|||||||||
|
|||||||||
|
|||||||||
| |
|||
| |||||||||
![]() |
|
|
«
Previous Thread
|
Next Thread
»
|
Thread Tools | Search this Thread | Display Modes |
|
|
|
Stop making mediocre tutorials.The best tutorials are video! Camtasia Studio makes it easy to create engaging, buzz-building screen videos at any size, in any popular format. Download the free trial!
|
|
#1
|
||||
|
||||
|
A drop down form without a submit button
I would like to know the javascript code that you use to enable a selection to be made on a drop-down menu without having to click on an extra submit button. Dev Articles Forum uses exactly this when inviting users to jump to the required forum from the main page.
I know it's something based around the normal html form of:- <form name="form1" method and action etc> <select name="choice"> <option selected value='1'>1</option> <option value='2'>2</option> </select> </form> and I think 'onchange' is used somewhere. However, I don't don't really know how or where. Could someone help. Cheers |
|
#2
|
||||
|
||||
|
forum jump
The forum jump (used in this forum) is using
onchange this.form.submit in the select EDIT: The onchange is in the select, not the options. Sorry for any confusion. Last edited by Mittineague : June 21st, 2006 at 08:41 PM. Reason: clarification of misinformation |
|
#3
|
||||
|
||||
|
Hi Mittineague! do have to declare the js function in the head?
|
|
#4
|
||||
|
||||
|
Well I don't know whether I have used your code wrongly but it did not work. However, I found this nice code and this works! Without any declaration the head.
<form id="Form1"> <select onchange="document.getElementById('Form1').submit()"> <option>Choose...</option> <option>Red</option> <option>Blue</option> </select> <noscript> <input type="submit" value="Go" id="Submit1" /> </noscript> </form> Thanks all the same though. |
|
#5
|
||||
|
||||
|
SnapCracker...
the coding you displayed above DOES NOT work if you want to add a [onSubmit] in the form tag, of course depending on what Mittineague wanted, if he wanted to check the value of the select, in which case currently no value is included, it will not submit, i tried. Please post back. colton22 -- http://www.freewebs.com/colton22 |
|
#6
|
||||
|
||||
|
Yes colton22, as much as it pains me to admit it, it won't work if there is a value declared, it will take the as the option and usually you will want a value different to the option. BTW I took a 'peek' into your website and was all excited to see how you achieved this in your 'select a song' menu, however in IE ver 5.2 for Mac it does not work but looks great in black and red. I tried in Safari, Macs own browser, and the menu works and shows a 'play' button, but on a white background and looks totally different.
Cheers |
|
#7
|
||||
|
||||
|
Wow, someone who tests with IE/mac... ;-)
Does the following code give some insight in how to make something like this? I'd also prefer to avoid the NOSCRIPT tag in favour of DOM... but I guess it doesn't hurt. Code:
<html>
<head>
<script>
function submitMyForm(sel) {
alert(sel.options[sel.selectedIndex].value);
// sel.form.submit();
}
</script>
</head>
<body>
<form id="Form1">
<select onchange="submitMyForm(this)">
<option>Choose...</option>
<option>Red</option>
<option>Blue</option>
</select>
<noscript>
<input type="submit" value="Go" id="Submit1" />
</noscript>
</form>
</body>
</html>
__________________
Daryl's Homepage | My Blogroll | My Profile | Firefox supporter! DevArticles Forum Moderator "The net is a waste of time, and that's exactly what's right about it." -- William Gibson |
|
#8
|
||||
|
||||
|
Thanks MadCowDzz (you neither any 3 of these) that's what makes you internet famous! Now we are firing on all cylinders here. It's just perfect and I spotted the nice little touch to be able to toggle between submitting and alerting just by sliding the comments-out up over the unwanted action!
Yes I aways test out in IE for Mac by default because I don't use a PC although it'll sadly be the same one day. And while we are on that subject, in IE v5.2 I can't see what's around the code tags on this forum unless I click on the quick reply link on the right and it shows it in the edit box. Is that normal for your mac mini? (how do I know, you're internet famous!) |
|
#9
|
||||
|
||||
|
heh, I actually ordered a MacBook today... I've been eyeballing it for a few weeks now, but i'll credit this thread as giving me that final push (thanks!)... Don't rely on testing in IE/mac and assuming it will display that way in windows... I can almost guarantee it won't... Don't forget to test on Windows still.
That's an interesting bug... I'll have a go when I'm at home on the mini to see if I experience the same thing. I rarely have IE set as my default browser, on mac I prefer Safari and Firefox. |
|
#10
|
||||
|
||||
|
I don't rely on IEv5.2 at all, I was horrified the first time I looked at my own web pages on a friends PC! I have altered the whole site as a result. PC IE seems to stretch the page vertically and so doesn't fit so much in. I have javascript drop-down menus unrelated to this post ( 3000 lines of code) which you have helped out with before, which don't work at all in FireFox (PC or Mac), so that's another job for me to do. However, I don't how to approach it cos Safari and Firefox both share the same gecko like structure. But I'm sure it's possible in JS.
Cheers MCD. |
|
#11
|
||||
|
||||
|
yea the reason my website looks bad in all browsers except IE/WIN was in my style i had this...
<STYLE TYPE="text/css">@import:url(colton22_main.css);</STYLE> in which only imports in that one browser, thanks for letting me know though, sence then i installed, FF, NN, Opera, and the new IE 11 Beta 3 colton22 ps: did you get your problem fixed?? (the one that was originally posted?) |
![]() |
| Viewing: Dev Articles Community Forums > Programming > JavaScript Development > A drop down form without a submit button |
| Thread Tools | Search this Thread |
| Display Modes | Rate This Thread |
|
|
|
|