OnChange Event

OnChange Event

Adrian ChallinorAdrian Challinor Posts: 21Questions: 8Answers: 0

Is there anyway to put an onChange event in the editor? I want to be able to detect a filed value has changed so that I can turn on or off specific

<

div>s

This question has an accepted answers - jump to answer

Answers

  • kthorngrenkthorngren Posts: 20,141Questions: 26Answers: 4,735

    Will the submitSuccess work for your requirements?

    Kevin

  • Adrian ChallinorAdrian Challinor Posts: 21Questions: 8Answers: 0

    Not really. As I understand it, the SubmitSuccess gets triggered when the edit form submits data to the server.

    What I want to do is much more interactive. The first field in the form is a select box that allows the user to choose which of several paths through the fields. Depending on its value I want to show / hide other fields on the form. This way on the fields needed for a specific action are shown. I would do that be enabling disabling the visibility of DIVs in the custom form.

    I know I can do this with a conventional submit form, but that would break the UI of the app. Still, if needs must, that is how I will go.

  • kthorngrenkthorngren Posts: 20,141Questions: 26Answers: 4,735

    Sounds like you want dependent() to show and hide fields based on a condition. I thought you meant div elements elsewhere on the page.

    Kevin

  • rf1234rf1234 Posts: 2,801Questions: 85Answers: 406
    Answer ✓

    You can do pretty much anything with "dependent". I didn't find too many good examples in the docs. So here is something from my own coding. You can also use "dependent" inside other Editor events to use it only while creating or editing. In that case don't forget to turn it off after finishing ("undependent").

    ctrEditor
        .dependent('ctr.automatic_prolongation', function (val, data, callback) {
            var self = ctrEditor;
            if (val == '1') {
                self.show(['ctr.prolongation_months', 'ctr.last_day_month']);
            } else {
                self.set({'ctr.prolongation_months': 0, 'ctr.last_day_month': 0})
                    .hide(['ctr.prolongation_months', 'ctr.last_day_month']);
            }
        })
        .on ( 'initCreate', function ( e ) {
            this.dependent('ctr.end_date', function (val, data, callback) {
                var self = ctrEditor;        
                ctrEndDateStandardDependencies(self);
            })
        })
        .on('close', function() {
            this.undependent('ctr.end_date');
        })
    
  • Adrian ChallinorAdrian Challinor Posts: 21Questions: 8Answers: 0

    Thank you, thank you, thank you.

    The pointer to "dependent" was what I needed. This rocks.

This discussion has been closed.