Editor: Can you do validation on the multi row editing dialog?

Editor: Can you do validation on the multi row editing dialog?

1ticket1ticket Posts: 11Questions: 8Answers: 1
edited June 2018 in Free community support

How can I prevent a user from submitting the multi value edit window with an empty value for a certain field? Is there a validation callback, or a parameter to pass for the field? Do I have to store the initial value and set it back to that if they don't edit anything or else it gets set to nothing?

_fieldTypes.headliner = {
    create: function (conf) {
        var that = this;

        conf._enabled = true;

        // Create the elements to use for the input
        conf._input = $(`<div id="${Editor.safeId(conf.id)}">
                    <input class="typeahead form-control headliner" type="text" placeholder="Headliner / Home Team" style="background-color: unset">
                    </div>`);

        let blood = new Bloodhound({
            datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'),
            queryTokenizer: Bloodhound.tokenizers.whitespace,
            remote: {
                url,
                prepare: function (query, settings) {
                    settings.url = settings.url + query
                    settings.headers = {
                        "x-api-key": _config.apis.dti1ticketapps.eventCatalogToken
                    };
                    return settings;
                }
            },
        });

        $('input.typeahead.headliner', conf._input).typeahead(null, {
            name: 'headliner',
            display: Handlebars.compile('{{name}} - {{category_name}}'),
            source: blood,
            templates: {
                empty: [
                    '<div class="empty-message">',
                    'Unable to find headliners that match query.',
                    '</div>'
                ].join('\n'),
                suggestion: Handlebars.compile(
                    '<div><strong>{{name}}</strong> – {{category_name}}</div>'
                )
            },
            limit: 10
        }).on('typeahead:selected typeahead:autocomplete', function (obj, datum) {
            $('input.typeahead.headliner.tt-input', conf._input).data({data:datum})
            that.set(conf, datum);
        });

        return conf._input;
    },

    get: function (conf) {
        let val = $('input.typeahead.headliner.tt-input', conf._input).data('data')
        return val
    },

    set: function (conf, val) {
        $('input.typeahead.headliner.tt-input', conf._input).typeahead('val', val.name);
    }
};

Answers

  • allanallan Posts: 61,697Questions: 1Answers: 10,102 Site admin

    It is possible to do client-side validation in Editor with the preSubmit method. There is an example of that here.

    That said, Editor primarily focuses on server-side validation since you need to do validation there anyway, but yes, you can do client-side validation if you want. field().multiGet() might be useful if you are dealing with multiple values for the field (multi-row editing).

    Allan

This discussion has been closed.