2

例 jsFiddle

私はまだknockout.jsに傾倒しているので、コードを改善するための提案を自由にしてください


ko.mapping次の構造を含む JSON 文字列からビュー モデルを生成するために使用しています。

questions: [
    answer: "whetever the user enters", 
    controlType: "the type of input to display",
    lookupItems: "anything that will go into a SELECT input",
    modalSection: "if this question is a modal, then all modal questions will go here"
]

私はすべてを正常に動作させることができました.モーダルを処理するこの例に従うことで、モーダルとそれぞれの質問が思い通りにポップアップすることができました.

私の問題ですが、このモーダルから複数の結果を保存するにはどうすればよいですか? ユーザーはモーダルを何度も表示して、必要なだけ多くの情報を追加できる必要があります。これは、質問の下に表示される必要があります。

これが私がこれまでに試したことです:

.submissionsに配列を追加しますmodalSection

my を拡張.modalSectionして送信コレクションを作成すると、ユーザーがモーダルで [ OK ] をクリックすると、現在のモーダルのコピーがこのコレクションに追加され、テーブルに表示されます。

<!-- ko foreach: modalSection.submissions -->
<table>
    <tbody data-bind="foreach: questions">
        <tr>
            <td data-bind="text: text"></td>
            <td data-bind="text: answer"></td>
        </tr>
   </tbody>
</table>
<!-- /ko -->

これは、これを試している私のフィドルのバージョンです

これはうまくいかないようですが、私のテーブルは空のままです。それでも、私がこれを機能させた場合、私は正しい方向に進んでいますか?同じ観測可能なインスタンスをmodalSection複数回保存するだけではありませんか?

誰かが私を正しい方向に向けることができますか?おそらく提供されたフィドルのコードを見て、私が改善できることと私が望む場所に到達する方法について何か指針を与えることができますか?


編集 1

私が達成しようとしていることをよりよく理解するために、ここにシナリオがあります。

次の 2 つの質問があるとします。

  1. 車を所有したことがありますか。
  2. メーカー、型式、色など、所有しているすべての車の詳細を教えてください。

したがって、私の最初の質問はドロップダウン リスト ( lookupItems[はい] と [いいえ]) です。2 番目の質問は、より詳細な情報が必要なため、モーダルの最有力候補となります。したがって、この質問には、おそらく [Add Cars] というラベルの付いたボタンが入力として表示されます。

これにより、[車のメーカーは?]、[モデルは?]、[色は?] という質問 (非モーダルの質問と同様に制御タイプなどがあります) を含むモーダルが表示されます。モーダルが入力されると、結果がどこかに (テーブルなど) 表示され、[Add Cars] ボタンが再び使用可能になり、さらに N 個の詳細を追加できます。

4

1 に答える 1