page redirection/form submit - to page according to different button click

[roberto68]

function proceed($mapType){        switch($mapType) {         case "showevent" : $("#dropdowns").attr("action", showEvent.html); $("#dropdowns").submit(); window.location.replace("showEvent.html"); break;          case "addplace" : $("#dropdowns").attr("action", addPlace.html); $("#dropdowns").submit(); window.location.replace("addPlace.html");break;        case "addevent" : $("#dropdowns").attr("action",map.html);  $("#dropdowns").submit(); window.location.replace("map.html");break; 

here's javascript

and here is html

<input type="button" value="add a place" id="addplace" onclick="proceed(addplace)" />        <input type="button" value="add an event" id="addevent" onclick="proceed(addevent)" />        <input type="button" value="show event" id="showevent" onclick="proceed(showevent)" />

what I want is to post dropdowns form ( form consisting of 4 dropdown lists) to diffenrent page - according to button clicked and redirect to that page after that

[justsomeguy]

The filename for the action should be quoted. There's no reason to redirect though, submitting the form will go to that page.

[roberto68]

so I quoted it, but hte result is still the same, is it ok that the form consists of multiple dropdowns and I want to submit it at once ? or simply here's my html for dropdowns. There's no error in javascript console

 <form name="dropdowns" id="dropdowns">        <div class="box">                <img src="images/pic1.jpg" alt="pic1">            <h2>education</h2><label for='educationForm'>select what you wanna learn<br><div align="center"><label for="education" id="dd1"><select multiple="multiple" name="mydropdown" id="dd1"><option value="1">IT-programing</option><option value="2">IT-sys_adm-proin</option><option value="3">IT</option><option value="4">science</option><option value="5">electronic engineering</option><option value="6">math&physics</option><option value="7">mechanical_engineering</option></select></label></div></label>   ......the other 3 dropdowns</form>

[justsomeguy]

What result is that, what actually happens? The form should be fine, although you shouldn't nest labels like that. What is your Javascript code now?

[roberto68]

ok so I changed the html put it to 1 dropdown with optgroup. so here's my html

        <div class="box">                <img src="images/pic1.jpg" alt="pic1">            <h2>education</h2><form name="dropdowns" id="dropdowns"><label for='educationForm'>select what you wanna learn<br><div align="center"><label for="education" id="dd1"><select multiple="multiple" name="mydropdown1" id="dd1"><optgroup label="education"<option value="1">IT-programing</option><option value="2">IT-sys_adm-proin</option><option value="3">IT</option><option value="4">science</option><option value="5">electronic engineering</option><option value="6">math&physics</option><option value="7">mechanical_engineering</option></optgroup>...........<optgroup label="volunteer"<option value="23"></option><option value="24"></option><option value="25"></option><option value="26"></optio</label><option value="27"></option><option value="28"></option><option value="29"></option></optgroup></select></label></form></div></label>

and the javascript remained unchanged

Edited February 25, 2015 by roberto68

[justsomeguy]

If the Javascript is still like it was in post 1, then it's not going to work. If you've changed it since then, then post the updated code.

[roberto68]

oh my bad it was so simple so here's my code , for everyone having same problem

switch(mapType) { case "showevent" : $("#dropdowns").attr("action", "showEvents.html"); $("#dropdowns").submit(); break;  case "addplace" : $("#dropdowns").attr("action", "addPlace.html"); $("#dropdowns").submit(); break;case "addevent" : $("#dropdowns").attr("action","map.html");  $("#dropdowns").submit(); break; }}

 

 <div class="mapbuttons" id="mapbuttons" >        <input type="button" value="add a place" id="addplace" onclick="proceed('addplace')" />        <input type="button" value="add an event" id="addevent" onclick="proceed('addevent')" />        <input type="button" value="show event" id="showevent" onclick="proceed('showevent')" />        </div>

Edited February 27, 2015 by roberto68