web-dev-qa-db-ja.com

JavaScript：選択に基づいてフォームアクションの属性値を変更する方法

ドロップダウンメニューから選択した値に基づいてフォームアクションを変更しようとしています。

基本的に、HTMLは次のようになります。

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

「人」が選択されている場合（デフォルト）、アクションは「/ search/user」であり、コンテンツが選択されている場合、アクションは「/ search/content」である必要があります

私はまだ周りを検索していますが、これを行う方法を見つけることができていません。

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

フォームのアクションのみを変更する場合は、on-input-changeではなく、on-form-submitでアクションを変更することをお勧めします。一度だけ起動します。

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

使用する方が良い

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

のではなく

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

だから、トランテの答えに基づいて：

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

setAttributeを使用すると、潜在的に多くの時間を節約できます。

0
Anastasiya Martynyak