0

私は、クライアントとの予定を作成しようとしているWebアプリケーションを作成しようとしています。私の想像では、アプリのユーザーがクライアントとの予定を作成したい場合、最初に「予定の作成」などのリンクを選択し、次に既存のクライアントを選択する画面が表示されます。または、新しいものの情報を入力します。

私が苦労してきた主な問題は、アプリケーションの一般的なフローです。POSTが発生するタイミングと、メモリに保持する必要がある量です。もちろん、ユーザーがクライアントを作成する必要がある場合は、ブラウザーを別の画面に転送し、ユーザーを保存して送り返すこともできますが、フローの途中（予定を作成するフロー）でクライアントを保存するのは悪いことだと思います。 ; 最後にすべてを保存したいです。

AngularJSのようなフレームワークを調査して、この問題が解決するかどうかを確認するために多くの時間を費やしましたが、解決するとは思いません。これらすべてをJavascriptを使用してDOMで実行し（すべてメモリ内にあるため）、すべてを含む1つのPOSTを送信したいと確信しています。

すべてをメモリに保持し、ワークフロー全体に対して1つの大きなPOSTを送信すると仮定すると、JSONの外観をどのように提案しますか？JSONで既存のクライアントと新しいクライアントを解読するための合理的な方法は何でしょうか？この特定の問題の解決を容易にするフレームワークはありますか。

私がやりたかったのは、ユーザーをフローから遠ざけることなく、クライアントを選択したり、新しいクライアントを作成したりするための画面を作成することだけでした。なんでこんなに難しいの？

すべてに感謝します！

4

3 に答える 3

2

Angular での簡単な解決策は、データを $rootScope JSON オブジェクトに保存し続けることです。どのページに移動しても、データは保持されます。したがって、完了したら、JSON POST を使用する Web サービスにデータを送信するだけです。(例 - JERSEY RestFul Web サービスの実装)。その後、データを一発で保存できます。

送信が完了していない場合は、必要に応じてオブジェクトを無効にするか、JSON オブジェクトを空にします。

于 2012-11-17T10:58:44.317 に答える
1

JS MVC フレームワークでは、他の JS アプリと同様に、オブジェクト/クラス/モデルを定義して操作します。Web サービス (AJAX 呼び出し) からクライアントのリストを取得すると、angularJS は $http または $resource を使用して自動的に JS オブジェクトに変換します (どちらもフレームワークの Web サイトで詳しく説明されています)。ただし、いつでも独自のものを作成し、POST を介してすぐに、または後で DB に追加できます。モデルの新しいインスタンスを追加するために「ビュー」を変更する必要はありません。

これは、私のアプリケーション用に私が持っているコントローラーの例です。ロジックのほとんどは、明確にするために削除され、コメントに置き換えられています。これはエントリを表し、エントリのリストは親コントローラに格納され、コントローラは ng-repeat ディレクティブを介して生成されます (以下の html コードを参照)。

コントローラ：

/**
 * Entry Controller
 * @class entryCtrl
 */
ucpaTpaApp.controller(
    'entryCtrl', 
    ['$scope', 'httpService',
    function($scope, httpService) {


        /**
         * initiate the entry model, with all the required logic
         * Called upon the controller's construction 
         */
        $scope.initEntry = function initEntry(){
            if(!$scope.entry){
                $scope.newEntry();
            }
        }


        /**
         * Set the fields of the entry, stored on the indicator's metadata
         * for new entries.
         */
        $scope.newEntry = function newEntry(){

            $scope.entry = {
                status: {
                    state: 'new',
                    connection: 'idle'
                },
                field_values: {},
                saved_field_values: {},
                title: ""
            };

            for(var field in $scope.fields){
                $scope.entry.field_values[String($scope.fields[field].id)] = '';
            }
        };


        $scope.resetFields = function resetFields(){
         // Resets fields to original status (blank if it is new)
        };


        /**
         * Save a new entry, adding it to the list of entries, and attempting
         * to save to the server
         */
        $scope.addEntry = function addEntry(){
         // Add a copy to array, with status 'new',
             // and call saveEntry on it
             // After that, reset fields
        };

        $scope.deleteEntry = function deleteEntry(){
         // Delete on WS, remove from array on confirmation
        };

        $scope.saveEntry = function saveEntry(){
         // Save to WS, update status on confirmation
        };


        $scope.initEntry();

    }]
);

テンプレート：

<div class="indicator">
    <h3>{{indicator.title}} - {{indicator.score}}</h3>
    <div 
    ng-repeat="entry in indicator.entries" 
    ng-form="{{entry.id}}" 
    ng-controller="entryCtrl">
        <tr-entry>
        </tr-entry>
    </div>
</div>
<div ng-controller="entryCtrl">
    <tr-entry>
    </tr-entry>     
</div>

ご覧のとおり、エントリのリストは ng-repeat ディレクティブで表示されます (実際のエントリ DOM は独自のディレクティブである tr-entry で作成されます)。次に、追加のエントリ「新しい」エントリがこのリストの最後に作成されます。そのエントリが保存 (追加) されると、そのエントリ モデルが配列にコピーされ、angularJS はそれを保存しようとします。結果は次のとおりです。「新しいエントリ」はそのフィールドを空白に設定し、新しいエントリが ng-repeat リストに表示されます。もちろん、DB に保存されたという確認が受信された場合にのみ、ステータスが「新規」から「保存済み」に変更されます (バックエンドがデータの検証を実行するため、エントリが拒否される場合があります)。

于 2012-11-17T04:30:07.367 に答える
0

なぜAJAXを使わないのですか??? 最初に、サーバーへの1つのajax呼び出しとなるクライアントを選択/作成すると、ユーザーは同じビューにとどまります。その後、サーバーが応答したら、そのクライアントの予約をしてから、そのページを送信するか、同じビューを維持したまま何か他のことをしたい場合は、別の Ajax 呼び出しを行うことができます。すべてのデータが積み重なるのを待たずに、単に AJAX を使用して投稿します。:)

于 2012-11-17T03:42:43.793 に答える