editor.field() triggers all fields instead of the passed one

editor.field() triggers all fields instead of the passed one

pisislerpisisler Posts: 125Questions: 24Answers: 1
edited April 2021 in Free community support

Hi all.

Still trying out Editor 2.0.1

I am trying to set a trigger for select elements to submit the form on change. There are discussions like this already but something wrong is happening in my case.

I am using inline editing with some fields being of type "select". Like selecting the city from the list. Right now I am using something like this:

editor.field('city').input().keypress( function (e) {
    if (e.which == 13)
        editor.submit();
});

and it works when pressing enter key after selecting an option. But I would like to change this behavior so that submitting is trigged as soon as an item is selected from the dropdown. The proposed method is:

editor.field('city').input().on('change', function () { editor.submit(); })

It works but the event is triggered not only on "city" field, but in every single field which is editable (i.e. which have an input). For example I click on the "surname" field, the form submits. But since no data has changed, it steps out of inline editing. (Like when you step into inline editing and pressing enter without changing anything.) (But if you quickly click on some random fields, inline editing keeps open.)

It also disregards allIfChanged option. Because all the fields trigger validation error based on other fields. Like for example when you click on "surname", (for it has already triggered the event incorrectly and submitted the form) it immediately warns like "Age can't be empty" while age is already not empty.

Is this a bug or am I doing something wrong?

This question has an accepted answers - jump to answer

Answers

  • allanallan Posts: 63,230Questions: 1Answers: 10,416 Site admin
    Answer ✓

    Let's use this example as the basis for this discussion - if you pop open the console and paste in:

    editor.field('users.site').input().on('change', function (e, d) {
      if (! d) {
        editor.submit();
      }
    })
    

    Then it works as expected - selecting an item in the site dropdown will immediately submit it. Changes in the other columns make no difference.

    The only change I've made relative to your own code is to consider the second parameter passed into the change event handler. If it is set then the change is coming from Editor itself (i.e. when you start to edit a row it needs to set the value of the field), if it is not set, then it is a user changed value.

    With that change, does your own script work the way you want? If not, can you link to a test case showing the issue please.

    Allan

This discussion has been closed.