3

私はノックアウト、デュランダル、ブリーズを学んでいます。ジョン・パパのJumpStart SPAビデオのおかげで、これは喜びです。そこで、このプロジェクトのコードを調べて、現在、検証メカニズムを変更しようとしています。

このとき、変更を保存するときに保存に失敗した場合は、エラーを収集し、エラーの履歴書とともにトーストを表示します。

ここに画像の説明を入力してください

私が達成したいのは:

  • ビュー内の無効なフィールドを赤(背景色)でマークする機能があります

  • トーストが検証エラーの履歴書とともに表示された場合(「保存に失敗しました:affairNrが必要です」など)プロパティ名をよりわかりやすい名前に置き換えたい(「保存に失敗しました:事柄番号が必要です」など)

datacontext.jsでの検証の部分コードは次のとおりです。

var saveChanges = function () {
    return manager.saveChanges()
        .then(saveSucceeded)
        .fail(saveFailed);

    function saveSucceeded(saveResult) {
        log('Saved data successfully', saveResult, true);
    }

    function saveFailed(error) {
        var msg = 'Save failed: ' + getErrorMessages(error);
        logError(msg, error);
        error.message = msg;
        throw error;
    }
};

function getErrorMessages(error) {
    var msg = error.message;
    if (msg.match(/validation error/i)) {
        return getValidationMessages(error);
    }
    return msg;
}

function getValidationMessages(error) {
    try {
        //foreach entity with a validation error
        return error.entitiesWithErrors.map(function (entity) {
            // get each validation error
            return entity.entityAspect.getValidationErrors().map(function (valError) {
                // return the error message from the validation
                return valError.errorMessage;
            }).join('; <br/>');
        }).join('; <br/>');
    }
    catch (e) { }
    return 'validation error';
}

誰かが私を正しい方向に向けることができますか?

前もって感謝します。


編集:

問題を再現するには:Transportsの左側のサイドバー+ recherche avancee +リスト内の任意のアイテム+右側:いくつかの入力をクリアし(下のスクリーンショットのNumero d'affaireなど)、[Enregistrer]をクリックします。次に、保存ボタンが呼び出されます。そこで、ko.validation.groupで無効な入力があるかどうかを確認する必要がありますが、機能しません。

ここに画像の説明を入力してください

4

1 に答える 1

8

少し前に、観察可能なプロパティを拡張して、そよ風のバリデーターに基づく検証を追加するヘル​​パー関数を投稿しました。そのヘルパーを使用すると、無効な入力で赤い色を実現できます。

そよ風の検証メッセージを翻訳する

2番目の質問についてはお役に立てません。検証メッセージをカスタマイズできることは知っていますが、デフォルトのバリデーターでは、メッセージに表示するわかりやすい名前を設定できないと思います。

アップデート:

私が最初に行うことは、関数(更新されたバージョン)を公開するヘルパーモジュールを作成することです。

define([],
function () {
"use strict";
var foreignKeyInvalidValue = 0;

function addValidationRules(entity) {
    var entityType = entity.entityType,
        i,
        property,
        propertyName,
        propertyObject,
        validators,
        u,
        validator,
        nValidator;

    if (entityType) {
        for (i = 0; i < entityType.dataProperties.length; i += 1) {
            property = entityType.dataProperties[i];
            propertyName = property.name;
            propertyObject = entity[propertyName];
            validators = [];

            for (u = 0; u < property.validators.length; u += 1) {
                validator = property.validators[u];
                nValidator = {
                    propertyName: propertyName,
                    validator: function (val) {
                        var error = this.innerValidator.validate(val, { displayName: this.propertyName });
                        this.message = error ? error.errorMessage : "";
                        return error === null;
                    },
                    message: "",
                    innerValidator: validator
                };
                validators.push(nValidator);
            }
            propertyObject.extend({
                validation: validators
            });
        }

        for (i = 0; i < entityType.foreignKeyProperties.length; i += 1) {
            property = entityType.foreignKeyProperties[i];
            propertyName = property.name;
            propertyObject = entity[propertyName];

            validators = [];
            for (u = 0; u < property.validators.length; u += 1) {
                validator = property.validators[u];
                nValidator = {
                    propertyName: propertyName,
                    validator: function (val) {
                        var error = this.innerValidator.validate(val, { displayName: this.propertyName });
                        this.message = error ? error.errorMessage : "";
                        return error === null;
                    },
                    message: "",
                    innerValidator: validator
                };
                validators.push(nValidator);
            }
            propertyObject.extend({
                validation: validators
            });
            if (!property.isNullable) {
                //Bussiness Rule: 0 is not allowed for required foreign keys
                propertyObject.extend({ notEqual: foreignKeyInvalidValue });
            }
        }
    }
}

return {
    addValidationRules: addValidationRules
};
});

次に、各そよ風エンティティタイプの初期化子を定義しています(http://www.breezejs.com/documentation/extending-entities)。例:

define(['app/validatorHelper', 'knockout'],
function (vHelper, ko) {
"use strict";
var constructor = function () {
},

    initializer = function indicadorInitializer(entity) {
        vHelper.addValidationRules(entity);
    };

return {
    constructor: constructor,
    initializer: initializer
};
});

そして最後に、どこかで(データサービスモジュール内のinit関数で実行しています)、初期化子を登録しています(http://www.breezejs.com/documentation/extending-entities):

//store comes from: manager = breezeconfig.createManager(),
//    store = manager.metadataStore,
store.registerEntityTypeCtor("Palanca", domain.palanca.constructor, domain.palanca.initializer);

メタデータをフェッチする前に、これらすべてを実行しています。

これがお役に立てば幸いです。

アップデート2:

問題が見つかりました。ノックアウト検証のバージョンは最後のものではありません。

ダウンロードしたファイルの内部:http://ericmbarnard.github.com/Knockout-Validation/行:349は次のとおりです。

exports.rules[ruleName] = ruleObj;

ファイル内の同等の行(関数addAnonymousRule)は次のとおりです。

ko.validation.rules[ruleName] = {
    validator: ruleObj.validator,
    message: ruleObj.message || 'Error'
};

最新バージョンで動作するはずだと思います。

アップデート4:

保存するコードは次のとおりです。

vmAddPalanca.prototype.saveChangesCmd = ko.asyncCommand({
    execute: function (palanca, complete) {
        var validationErrors = ko.validation.group(palanca);
        if (validationErrors().length === 0) {
            dataservice.saveChanges()
            .then(saveChangesSuccess)
            .fail(saveChangesFail)
            .fin(complete);
        } else {
            validationErrors.showAllMessages(true);
            toastr.error("Debe corregir los errores antes de poder guardar");
            complete();
        }
    },
    canExecute: function (isExecuting) {
        return !isExecuting && dataservice.hasChanges();
    }
});
于 2013-03-26T14:39:58.917 に答える