Как я могу добавить проверку в поле ввода? Привязка JSON модель не работает - PullRequest
1 голос
/ 20 января 2020

Я пытаюсь изучить SAPUI5 с примерами frpm Demo kit Input - Checked. Я получаю сообщение об ошибке: oInput.getBinding не является функцией

У меня есть простое поле ввода xml:

<Label text="Name" required="false" width="60%" visible="true"/>
<Input  id="nameInput" type="Text" enabled="true" visible="true" valueHelpOnly="false" required="true" width="60%" valueStateText="Name must not be empty." maxLength="0" value="{previewModel>/name}" change= "onChange"/>

и мой контроллер:

_validateInput: function(oInput) {
var oView = this.getView().byId("nameInput");
        oView.setModel(this.getView().getModel("previewModel"));
        var oBinding = oInput.getBinding("value");
        var sValueState = "None";
        var bValidationError = false;

        try {
            oBinding.getType().validateValue(oInput.getValue());
        } catch (oException) {
            sValueState = "Error";
            bValidationError = true;
        }

        oInput.setValueState(sValueState);

        return bValidationError;
    },

    /**
     * Event handler for the continue button
     */
    onContinue : function () {
        // collect input controls
        var that = this;
        var oView = this.getView();
        var aInputs =oView.byId("nameInput");
        var bValidationError = false;

        // check that inputs are not empty
        // this does not happen during data binding as this is only triggered by changes
        jQuery.each(aInputs, function (i, oInput) {
            bValidationError = that._validateInput(oInput) || bValidationError;
        });

        // output result
        if (!bValidationError) {
            MessageToast.show("The input is validated. You could now continue to the next screen");
        } else {
            MessageBox.alert("A validation error has occured. Complete your input first");
        }
    },

    // onChange update valueState of input
    onChange: function(oEvent) {
        var oInput = oEvent.getSource();
        this._validateInput(oInput);
    },

Может кто-нибудь объяснить мне, как я могу установить модель?

Ответы [ 2 ]

1 голос
/ 21 января 2020

Ваша модель в порядке и правильно связана. Проблема в вашем коде заключается в том, что функция onContinue

         jQuery.each(aInputs, function (i, oInput) {
             bValidationError = that._validateInput(oInput) || bValidationError;
         });

aInput не является массивом, поэтому ваш код не повторяется с элементом массива. Чтобы быстро это исправить, вы можете поместить скобки вокруг объявления следующим образом:

        var aInputs = [
            oView.byId("nameInput")
        ];

Также вы можете удалить первые две строки метода _validateInput, так как они бесполезны ...

0 голосов
/ 20 января 2020

Обычно мы устанавливаем модель после загрузки вида, а не при изменении значения. Например, если вы хотите установить JSONModel с именем «previewModel», вы можете сделать это, как указано ниже.

Обратите внимание, что onInit вызывается при инициализации контроллера. Если вы правильно связали модель следующим образом, то oEvent.getSource (). GetBinding ("value") вернет ожидаемое значение.

onInit: function(){
                var oView = this.getView().byId("nameInput");
                oView.setModel(new sap.ui.model.json.JSONModel({
                name : "HELLO"
                }), "previewModel");
            },


onChange: function(oEvent) {

                var oInput = oEvent.getSource();
                this._validateInput(oInput);
            },

...

Кроме того, для проверки входного текста вы можете выполнить следующее:

    _validateInput: function(oInput) {
        var oBinding = oInput.getBinding("value");
        var sValueState = "None";
        var sValueStateText = "";
        var bValidationError = false;
        if(oBinding.getValue().length === 0){
            sValueState = "Error";
            sValueStateText = "Custom Error"
        }


        oInput.setValueState(sValueState);
        if(sValueState === "Error"){
            oInput.setValueStateText(sValueStateText);
        }

        return bValidationError;
    },

Обратите внимание, что код выше не высокого качества и готов к производству, так как это быстрый ответ на этот пост :)

...