-1

I have two forms on my site (one is woocommerce, the other is gravity forms). The first form contains a single drop down with two options. The 2nd form contains two drop down fields. Any time the first form changes I want the second form to reset. I know this sounds strange but its for a hack. So I need a change function and clear form function. Lets say that a user selects option 1 from the first form then selects an option in each of the fields in form 2, the user then decides to select option 2 from the first form. The second form needs to reset.

4

2 に答える 2

1

これの行で何かを試してください：

<form id="first">
  <select>
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
  </select>
</form>

<form id="second">
  <select>
    <option value="">Select...</option>
    <option value="a">Option A</option>
    <option value="b">Option B</option>
  </select>
  <select>
    <option value="">Select...</option>
    <option value="c">Option C</option>
    <option value="d">Option D</option>
  </select>
</form>

changeイベント ハンドラーを次<select>の#first形式でバインドします。

$('#first select').change(function(){
  $('#second select').prop('selectedIndex',0);
});

changeコールバックは、フォーム<select>内のすべての要素のプロパティを最初に設定します。#second<option>

実際の例については、 http://jsfiddle.net/cC9sb/1/を参照してください。

于 2013-03-19T02:47:10.817 に答える
1

Cueの答えの代わりに、簡単に使用できます

Javascript

$('#first select').change(function(){
  $('#second')[0].reset();
});

この行 $('#second')[0].reset();は、フォーム内のすべての要素をリセットします (入力 (テキスト、ラジオ、チェックボックスなど) がある場合)。

HTML

<p>Form 1</p>
<form id="first">
  <select>
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
  </select>
</form>

<p>Form 2</p>
<form id="second">
  <select>
    <option value="">Select...</option>
    <option value="a">Option A</option>
    <option value="b">Option B</option>
  </select>
  <select>
    <option value="">Select...</option>
    <option value="c">Option C</option>
    <option value="d">Option D</option>
  </select>
</form>

Cue の更新されたフィドル

于 2013-03-19T03:37:40.820 に答える