[dropdown]Dropdownmenu zonder buttom

Door DDragonz op 27-09-2008 22:59

1.709 views

Hallo iedereen,
Ik heb weer eens een vraag die ik niet zelf vind op google. Ik wil dus een dropdown menu (keuzemenu van een standaard html formulier) hebben, maar met het verschil dat men niet eerst de keuze maakt en dan op een knop drukken. Maar dat die gelijk verwerkt in een GET naar de zelfde pagina.
Als dit zonder javascript zou gaan dan zou ik die optie willen hebben, maar naar wat ik weet is dat niet mogenlijk en moet het dus met javascript gebeuren. Een onclick-event?

Heeft iemand misschien toevallig ergens een voorbeeld of kan je er zelf een voorbeeld geven dan zou dat erg mooi zijn :). Kan ik weer verder met het echte programmeren :( :P (bedoel dan php, he ;) ).
Grtz DDragonz

Bart Tuma

27-09-2008 23:21

Dreamweaver heeft een 'jump-menu':


<script type="text/javascript">
<!--
function MM_jumpMenu(targ,selObj,restore){ //v3.0
  eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
  if (restore) selObj.selectedIndex=0;
}
//-->
</script>
<form name="form" id="form">
  <select name="jumpMenu" id="jumpMenu" onChange="MM_jumpMenu('parent',this,0)">
    <option value="?pagina=get&amp;id=4" selected>item1</option>
  </select>
</form>

Misschien is jQeury / Mootools wel wat, daar zit vast ook wel zoiets bij wat je bedoeld.

The Ultimate

27-09-2008 23:46

Helaas vind ik jou verhaal/vraag nogal onduidelijk en weet dus niet precies wat je bedoelt. Maar is dit niet iets dat je goed via AJAX kunt doen?

Jan Koehoorn

28-09-2008 00:09

Jump menu's in DreamWeaver, vaag gepraat over AJAX, hij wil gewoon dit:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<script type="text/javascript" src="mootools/mootools.js"></script>
	<script type="text/javascript">
	window.addEvent ('domready', function () {
		$('myselect').addEvent ('change', function () {
			this.getParent ().submit ();
		});
	});
	</script>
</head>

<body>

	<form id="myform" method="get" action="test.php">
		<select id="myselect" name="myselect">
			<option value="1">optie 01</option>
			<option value="2">optie 02</option>
			<option value="3">optie 03</option>
		</select>
	</form>
</body>
</html>

D DDragonz

28-09-2008 00:25

Kan het misschien wel wat duidelijker uitleggen, maar Jan Joehoorn heeft mij goed begrepen :). En omdat ik de mootools toch gebruik voor slimbox (lightbox) komt het ook goed uit :). Hij werkt precies goed :). Dank je wel iedereen :)

edit:
Ik ga nu dus de mootools manier doen, maar ik zou nog wel graag weten hoe het werkt met alleen javascript zonder andere hulpmiddelen.

D Douwe

28-09-2008 09:08


    <form id="myform" method="get" action="test.php">
        <select id="myselect" name="myselect" onchange="document.getElementById('myform').submit()">
            <option value="1">optie 01</option>
            <option value="2">optie 02</option>
            <option value="3">optie 03</option>
        </select>
    </form>

Zonder framework.

D DDragonz

28-09-2008 18:08

@Douw M:
Mooi, dat is ook een mooi voorbeeld :) zonder framework.

Nu weer een tweede vraag:
Nu wil ik ook een textinput veld zonder een submit. Ik wil dit voor een snel zoeken functie gebruiken. Ik wil dus dat nadat iemand iets heeft ingetikt en daarna volgt met een enter dat de invoer met een get naar de url gaat(dus de enter dient als de submit). Is dit mogenlijk?

- SanThe -

28-09-2008 18:25

Gewoon een <input> gebruiken en checken op if($_SERVER['REQUEST_METHOD'] == 'POST') (of GET).

D DDragonz

28-09-2008 19:05

Ow nhe dat was niet wat ik bedoelde. Het is eigenlijk al goed, want dat is automatische al zo dat wanneer je iets invult en je drukt op enter dat die dan de forminput verstuurt. Dus het is al goed :) Had iets te snel wat gevraagt.
Bedankt iedereen ... kan ik nu weer verder :) (zal nog een keer hier een previeuw geven van wat ik gemaakt hebt en wat dan beter kan enz)

Henk PHP

30-10-2008 12:17

DDragonz schreef op 28.09.2008 18:08
@Douw M:
Mooi, dat is ook een mooi voorbeeld :) zonder framework.

Maar dat is wel lelijk, je wilt eigenlijk geen javascript tussen je html :)

N Niek Weevers

30-10-2008 14:50

Jewel, dat kan zeker wel.
Waar je wel op moet letten is dat het ook moet werken zonder javascript.
Dus je kan in het geval van het dropdownmenu de submit button tussen noscript tags plaatsen.
Als javascript uit staat dan laat hij alsnog de button zien

Reageren

Inloggen om te reageren