|
|
Post by Wormopolis on Aug 22, 2010 7:11:13 GMT -8
Browser Tested: IE and FF
placement: wherever you want the dropdown to appear
I have noticed a lot of bad drop downs causing forms to stop working on numerous forums because people get sent to the HTMLBasix site and they arent quite sure of what they are doing when they edit the HTML for a drop down. multiple forms suddenly get added to the page and all with the same name and none of the drop downs seem to work and the login box suddenly stopped working as well.
so I wrote this up. Put it exactly where you would have put the HTML for your drop down. it will ensure unique names for things as well as let you customize background/foreground colors. Also included is a variable to turn on/off a "go" button. If you want multiple dropdowns, just use multiple copies of the code.
code:
<script type="text/javascript">
<!--
// Easy Drop Down Engine
// v1.5
// by Wormopolis - www.wormocodes.com
// keep header intact
// For every drop down you want to make, insert a copy of this entire code.
thisDropdownTitle="Staff Members";
thisDropdownBackgroundColor="444444";
thisDropdownTextColor="FFFF00";
thisDropdownHasGoButton=false; // set to true if you want a GO button next to drop down
thisDropdownOpensNewWindow=false; //set true if you want it
thisDropdownChoices=[
["Choice One","URL for choice one"],
["Choice Two","URL for choice two"],
["Choice Three","URL for choice three"],
["Choice Four","URL for choice four"] //keep copying this line, no comma on last entry
];
// no need to edit below - unless you know what you are doing
ddid=thisDropdownTitle.replace(/\s/,'').replace(/'/,'').replace(/"/,'')+parseInt((Math.random()*10000));
stuff="<select id='"+ddid+"' style='background-color: "+thisDropdownBackgroundColor+"; color: "+thisDropdownTextColor+";' ";
stuff+=(thisDropdownHasGoButton ? "" : "onchange=' "+(thisDropdownOpensNewWindow ? "window.open(this.options[this.selectedIndex].value);" : "location.href=this.options[this.selectedIndex].value;")+" ' ")+">";
stuff+= (thisDropdownHasGoButton && thisDropdownTitle=='' ? '' : "<option value=' '>"+thisDropdownTitle+"</option>");
for (w=0; w<thisDropdownChoices.length; w++) stuff+="<option value='"+thisDropdownChoices[w][1]+"'>"+thisDropdownChoices[w][0]+"</option>";
stuff+="</select>";
if (thisDropdownHasGoButton) {
stuff+="<input type='button' value='GO' style='background-color: "+thisDropdownBackgroundColor+"; color: "+thisDropdownTextColor+";' ";
stuff+="onclick=\"goval=document.getElementById('"+ddid+"').value; if (goval!=' ') " + (thisDropdownOpensNewWindow ? "window.open(goval);" : "location.href=goval;") +"\">";
}
document.write(stuff);
// -->
</script>
|
|
Nightwalker
Full Member
Everything Happens at Night
Posts: 138
Nightwalker said 0 great things
|
Post by Nightwalker on Aug 22, 2010 10:29:51 GMT -8
This code is simple but very useful for people who don't code.
Would you like to post it on Nightcodes?
|
|
|
|
Post by Wormopolis on Apr 15, 2011 19:17:37 GMT -8
version update 1.1: mad eit where if title is empty, and go button is on, first choice in drop down is shown on default.
|
|
|
|
Post by Wormopolis on Apr 29, 2011 18:33:13 GMT -8
version upgrade 1.5: added variable to open link in new window if desired
|
|
|
|
Post by tunescool on Apr 30, 2011 15:30:31 GMT -8
wormer i never thought of it until i seen your code, but im using it in every one of my boards and its really useful. im gonna have to change every one now that you updated it, is there anyway to get the standard proboards dropdowns like the forum jump looks and every other one
|
|
|
|
Post by Wormopolis on Apr 30, 2011 15:59:05 GMT -8
well you dont HAVE to change them. I just added the ability to make it open in a new window instead of the same. if that isnt important, then I wouldnt worry about updating the code.
standard proboards dropdowns? Like the skin selector and the color drop down?
|
|
|
|
Post by tunescool on Apr 30, 2011 16:07:25 GMT -8
yea the ones with the blue on the rite. i like the opening in another window tho otherwise people have to reopen my site
|
|
|
|
Post by tunescool on May 11, 2011 13:36:11 GMT -8
so can you modify it for those dropdowns
|
|
|
|
Post by Wormopolis on May 11, 2011 21:59:52 GMT -8
I am not sure which drop downs you are pointing me to...
|
|
|
|
Post by tunescool on May 11, 2011 23:02:21 GMT -8
change the dropdwns in this code, or at least just modify it for me, to look like every proboards dropdown  is that recent posts link in your miniprofiles your code, i looked in submissions and the database but couldnt find it |
|
|
|
Post by Wormopolis on May 15, 2011 19:26:53 GMT -8
the dropdown engine allows you to choose which colors you want.
thisDropdownBackgroundColor="444444";
thisDropdownTextColor="FFFF00";
you are probably looking for a background color of "FFFFFF" and a text color of "000000"
|
|
|
|
Post by tunescool on May 15, 2011 20:08:49 GMT -8
i dont want to change just the colors, i want to change the actual dropdowns
|
|
|
|
Post by Wormopolis on May 16, 2011 2:45:07 GMT -8
every dropdown is the HTML select tag that your browser makes. are you seeing different kinds of dropdowns somewhere else? the ones in your image look like the standard dropdown to me.
|
|
|
|
Post by tunescool on May 16, 2011 3:18:39 GMT -8
the ones in the code look like this, can they be changed to the ones in the pic you were talking about  |
|
|
|
Post by Wormopolis on May 16, 2011 4:25:47 GMT -8
this is what I see which are standard dropdowns with a whie background and black text Attachments:
|
|