Form setValue and Events


#1

Hi,

I have noticed that if I use setValue to change the value of controls on a form, form events are fired. Is there a way to use setValue without it firing events like you can in DhtmlX 5? In looking at the code, I was not able to see anything that I thought would help me, but believe that using an optional parameter might be an easy way to provide the functionality.

As a workaround, I am detaching the event handler, doing a setValue, then attaching the event handler. The ugly part of the workaround is that I have to put the attach in a setTimeout to allow for the events to finish firing.

Cheers,

Alex


#2

The way I have worked around this behavior is to set a flag variable (i.e., form.preventEvent = true) when taking an action that I don’t want to fire the events, and then have the event check that flag variable and only perform actions if it is not true. That way your’e not having to detach and reattach the events, just setting and unsetting a true/false variable.

Example (will not work as is, just shorthand to show the concept):

form = new dhx.Form();
form.preventEvent = false;
form.events.on("change",function(name,value){
    if (!form.preventEvent){
        // Do your thing
    }
});

form.preventEvent = true;
form.setValue(data);
form.preventEvent = false;

The flag can also be set when loading data through dhx.ajax calls; just put the last 3 lines into the .then() of the Promise object so they run after the data has been retreived.


#3

I like your idea of using a flag better. Thank you. But, I am still facing the same ugly timing problem where the events fire async after setValue has returned leaving me with:

setTimeout(function () { form.preventEvent = false; }, 200); // Hack to allow events to finish firing


#4

That’s why I mentioned putting the form.preventEvent = false into the .then event of the ajax Promise object.

form = new dhx.Form();
form.preventEvent = false;
form.events.on("change",function(name,value){
    if (!form.preventEvent){
        // Do your thing
    }
});

dhx.ajax.get(url).then(function(data){
    form.preventEvent = true;
    form.setValue(data);
    form.preventEvent = false;
});

Or, if you’re not using an ajax call that has a Promise object, then put it into the callback of your ajax. That way it doesn’t run until the ajax call has returned.

OR, if this isn’t about ajax at all and you have some other kind of async action happening, please post a sample of your code that shows how the setValue() is being used and maybe we can pin down what’s causing the timing issue.