By Martin / The Lab, JavaScript / Friday October 3rd, 2008 / No comments
I made this for selecting categories when writing articles in this blog. The same could be achieved using checkboxes or a select with multiple enables, but what's the fun in that? Also, this fits on one line and can handle lots of options without tabking up too much space.
function $(eleid) { return document.getElementById(eleid); }
function select(select) {
if (select.value != "0") {
$("names").innerHTML += "<a href=\"javascript:delcat(" + select.value + ")\">" + options[select.value] + "</a>; ";
$("selected").value += "[" + select.value + "]";
select.value = "0";
}
}
function delcat(option_id) {
$("names").innerHTML = $("names").innerHTML.replace("<a href=\"javascript:delcat(" + option_id + ")\">" + options[option_id] + "</a>; ", "");
$("selected").value = $("selected").value.replace("[" + option_id + "]", "");
}
var options = {1 : "HTML", 2 : "Javascript", 3 : "PHP};
<select onchange="addcat(this)"> <option value="0" selected="selected">Select below</option> <option value="1">HTML</option> <option value="2">JavaScript</option> <option value="3">CSS</option> </select> <span id="names" title="click to remove"> </span> <input type="hidden" name="selected" id="selected" />
$selected = mysql_real_escape_string($selected);
$selected = substr($selected, 1, strlen($$select) - 2);
$selected = explode("][", $selected);
Sort of pointless, but it may be useful to someone...
∎
I hope you enjoyed reading this article. If you wish, you may view some of the other recent or popular things I have written, or subscribe to receive RSS updates. You can also add a comment, or share this article on Twitter or Facebook, below.
Website copyright © Aspektas 2009 - 2010 Valid XHTML 1.0 Strict and CSS 2.1