2009-12-18 15 views
138

Sto cercando di modificare l'azione modulo in base al valore selezionato da un menu a discesa ...javascript - modifica l'azione del modulo in base alla selezione?

In sostanza, il codice HTML simile a questo:

<form class="search-form" id="search-form" method="post" accept-charset="UTF-8" action="/search/user"> 
<select id="selectsearch" class="form-select" name="selectsearch"> 
<option value="people">Search people</option> 
<option value="node">Search content</option> 
</select> 

<label>Enter your keywords: </label> 
<input type="text" class="form-text" value="" size="40" id="edit-keys" name="keys" maxlength="255" /> 

<input type="submit" class="form-submit" value="Search" id="edit-submit" name="search"/> 
</form> 

Se "popolo" è selezionata, (che è di default), l'azione dovrebbe essere "/ search/user", e se il contenuto è selezionato, l'azione dovrebbe essere "/ search/content"

Sto ancora cercando in giro, ma non sono stato in grado di scoprire come fare questo ...

risposta

253
$("#selectsearch").change(function() { 
    var action = $(this).val() == "people" ? "user" : "content"; 
    $("#search-form").attr("action", "/search/" + action); 
}); 
+0

Questo è il modo migliore di quello che stavo cercando ... Grazie – n00b0101

+1

Perfetto. Grazie. Ho aggiornato questo codice per modificare l'azione su submit anziché su cambio modulo. – Ryan

+0

Molto buono! Ha aiutato molto! – Alex

-14

È necessario avere un modulo?
Se no, allora si potrebbe utilizzare questo:

<div> 
    <input type="hidden" value="ServletParameter" /> 
    <input type="button" id="callJavaScriptServlet" onclick="callJavaScriptServlet()" /> 
</div> 

con il seguente JavaScript:

function callJavaScriptServlet() { 
    this.form.action = "MyServlet"; 
    this.form.submit(); 
} 
+14

this.form.submit(); non ha senso perché in realtà non ci sono forme e quindi niente da presentare – SET

22

Se si desidera modificare solo l'azione di forma, preferisco cambiare l'azione on-form-submit, piuttosto di on-input-change. Si spara solo una volta.

$('#search-form').submit(function(){ 
    var formAction = $("#selectsearch").val() == "people" ? "user" : "content"; 
    $("#search-form").attr("action", "/search/" + formAction); 
}); 
0

E 'meglio usare

$('#search-form').setAttribute('action', '/controllerName/actionName'); 

piuttosto che

$('#search-form').attr('action', '/controllerName/actionName'); 

Quindi, in base alla risposta del Trante abbiamo:

$('#search-form').submit(function() { 
    var formAction = $("#selectsearch").val() == "people" ? "user" : "content"; 
    $("#search-form").setAttribute("action", "/search/" + formAction); 
}); 

Utilizzando setAttribute si può risparmiare un sacco di tempo potenzialmente.

Problemi correlati