0

作成中の複数フィールド検索フォームがあります。9 つの異なる検索フィールドがあります。ただし、いずれも必須ではありません。唯一の要件は、少なくとも 1 つのフィールドに入力する必要があることです。

それらはすべて、検索フィールドの目的を示すためにラベルを使用する代わりに、ロード時にデフォルト値 (つまり「状態」) を表示します。したがって、1 つのフィールドを編集して他の 8 つをそのままにしておくと、9 つすべてに値が投稿されたままになります。

これを処理するための適切で効率的な方法はありますか? サイト全体でこの検索が数回繰り返されるため、投稿する前に jQuery (例if($(inputid).val() == 'Default Value') { ...) またはコントローラー (例)でロジックを手動で実行する必要はありません。そのため、動的なソリューションは非常に役立ち、節約できます。if($this->input->post('name') == 'default value') { $data['name'] = ''たくさんの時間。

ありがとう！

以下の@veddermatic の投稿の後に私が最終的に得たものの要点を編集します。

レンダリングされたフォーム:

<form id="search-form" action="spend/search">
<input id='fname' value='First Name' data-original_value='First Name' name='fname'/>
<input id='lname' value='Last Name' data-original_value='Last Name' name='lname'/>
...
</form>

ゴーストフォーム:

<form id="ghost-form" action="spend/search">
<!--nothing here yet-->
</form>

それをすべて処理するjquery：

$('.do-the-search').click(function(e) {
        e.preventDefault();

        $('#search-form input').each(function() {
            var $this = $(this);

            if($this.attr('data-original_value') != $this.val())
            {
                var clone = $this.clone();
                $("#ghost-form").append(clone);
            }
        });

        $("#ghost-form").submit();

    });
4

1 に答える 1

1

1 つのオプションは、現在使用している「通常の」フォームと、ユーザーに提示されたものと同じターゲットとアクションを持つ「ゴースト」フォーム (送信ボタンや表示フィールドがない) の 2 つのフォームを持つことです。

フォームを作成/ユーザーに表示するときは、各入力に反復処理に使用できるクラスを与え、事前に入力された値をデータ属性に入れます。

<input type="text" class="myFormInput" name="in1" data-original_value="blah" value="blah" />
<input type="text" class="myFormInput" name="in2" data-original_value="something" value="something" />
....

次に、JavaScript を使用してユーザー向けのフォーム送信を処理し、要素を繰り返し処理し.myFormInputます。元の値と異なる値を持っている場合は、「ゴースト」フォームに同じ名前の入力要素を作成してから、そのフォームを送信します。これは変更された要素のみを送信し、何らかの理由で javascript がオフまたは無効になっている場合、元のフォームがまだ送信されるため、適切に機能が低下します。

編集:これをプラグインに簡単に変換し、複数のインスタンスがある場合はすべてのフォームで使用できるため、次のようにするだけです:jQuery('#userFacingForm').ghostForm();

于 2013-03-20T20:09:23.883 に答える