web-dev-qa-db-fra.com

JavaScript: comment modifier la valeur de l'attribut d'action de formulaire en fonction de la sélection?

J'essaie de modifier l'action de formulaire en fonction de la valeur sélectionnée dans un menu déroulant.

En gros, le HTML ressemble à ceci:

<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>

Si "personnes" est sélectionné (valeur par défaut), l'action doit être "/ search/user" et si le contenu est sélectionné, l'action doit être "/ search/content".

Je cherche toujours, mais je n'ai pas réussi à savoir comment faire cela.

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

Si vous souhaitez uniquement modifier l'action du formulaire, je préfère modifier l'action lors de la soumission du formulaire, plutôt que lors de la modification de l'entrée. Il ne tire qu'une fois.

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

Il vaut mieux utiliser

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

plutôt que

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

Donc, sur la base de la réponse de Trante, nous avons:

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

Utiliser setAttribute peut vous faire économiser potentiellement beaucoup de temps.

0
Anastasiya Martynyak