0

複数の個人情報を取得できるページを作成する必要があります。クライアントは、いくつかの個人情報の記録を記入し、それらを一度に送信します。

一度に 1 つのレコードの入力フィールドのみをページに表示したいと思います。1 つのレコードを入力した後、クライアントは [次へ] ボタンをクリックして次のレコードに進むことができます。

配列入力で1つのフォームを作成し、javascriptを使用して各レコードを非表示/表示することを考えています。しかし、この解決策は非常に面倒です。レコード数が不明な場合。各レコードの入力フィールドをまたはテーブルセルにネストして、この要素を非表示/表示することは可能ですか? 各レコードの入力フィールドの数は非常に多くなります。

画像を含めることができ、すべてがいくつかの共通の非表示の値を共有するため、各レコードを送信したくありません。

誰かが以前にこの問題を抱えていると確信していますが、きちんとした解決策の提案はありますか?

どうもありがとう。

4

2 に答える 2

0

あなたがこのようなhtmlを持っていることを考えると

<form>
<table id="page-1">
  <input type="text" name="name"/>
  <input type="text" name="surname"/>
</table>
<table id="page-2">
     <input type="text" name="age"/>
</table>
<div id="page-3">
     <input type="submit" name="submit"/>
</div>
</form>
<input id="next" type="button" value="Next"/>

だからあなたはこのような単純なjavascriptでそれを行うことができます

    var actualPage = 0;
    $("#next").click(function() {
        $("#page-" + actualPage).hide();
        actualPage++;
        if(!$("#page-" + actualPage).length) {
             // this was last page
             $(this).hide();
             return false;
        }
        $("#page-" + actualPage).show();
    });

これを行うには本当にたくさんの方法があります、私はあなたが提供したものに応じてどれがあなたに最も合うかわかりません

このように、javascriptはフィールドの量を気にせず、フォームの送信は期待どおりに機能します

于 2012-08-15T15:15:25.673 に答える
0

ユーザビリティの観点から、それは良い考えではありません。ユーザーはフォームの長さに気づかず、合計ステップ数と残りのステップ数を知る方法がありません。

しかし、それは短い形式であり、ユーザーに現在/合計のステップの何らかの手がかりを与えるとしましょう.

フォーム全体を表示し、fieldset タグを使用してさまざまなステップを分離する必要があります。
次に、JavaScript を使用して最初のフィールドセット以外をすべて非表示にし、「次のステップ」ボタンを提供します
。ユーザーが「次のステップ」をクリックすると、

  1. 入力を検証する
  2. フィールドセットを隠す
  3. 次のものを表示
  4. 現在/合計ステップのインジケータを更新します

無効な入力がいくつかあると、すべてのエラーを同時に表示することができないため、検証は重要です。

于 2012-08-16T06:34:55.820 に答える