How To Capture Clear Button event

[Mauri]

I am using the version of 0.99.96.1328 UniGUI / Delphi XE6 and created a new inherited component TUniDBLookupComboBox. I'm using the property clearbutton true and would like to execute a statement when the user clicks the X button (ClearButton). Is there any event that triggers the component when it is clicked the X (ClearButton)? How can I handle this event?

 

Best Regards,

 

Mauri

 

[Farshad Mohajeri]

This event is handled and used internally on client side. It is not sent to the server, so it can not be handled without additional implementations on client side.

[Sherzod]

Hi,

 

Can you try this approach?!:

 

For example:

 

UniDBLookupComboBox1 -> ClientEvents -> ExtEvents -> afterrender fn:

function afterrender(sender, eOpts)
{
    sender.plugins.forEach(function(p) {
        if (p.alias[0] == "plugin.clearbutton") {

            // default click handler:
            // handleMouseClickOnClearButton: function(event, htmlElement, object) {
            //     if (!this.isLeftButton(event)) {
            //         return;
            //     }
            //     this.textField.setValue('');
            //     this.textField.focus();
            // }

            // remove default click handler if is needed
            p.clearButtonEl.un('click', p.handleMouseClickOnClearButton, p);

            // add your click handler
            p.clearButtonEl.on('click', function(event, htmlElement, object) {
                // your logic
            })
        }
    })
}

Best regards.

[Mauri]

Thank you so much for the reply ... I'll implement your suggestion !!!

[asapltda]

Good evening, could you please tell me how to capture this event in a tunimedit thanks

[Sherzod]

5 hours ago, asapltda said:

could you please tell me how to capture this event in a tunimedit

Hello,

UnimEdit.ClientEvents.ExtEvents

function clearicontap(sender, input, e, eOpts)
{
  
}

 

[Isaev]

On 10/4/2016 at 12:41 PM, Sherzod said:

    sender.plugins.forEach(function(p) {
        if (p.alias[0] == "plugin.clearbutton") {

is it no longer relevant?
I see only

p.alias [0] = = "plugin.clearable"

 

[Sherzod]

8 minutes ago, Isaev said:

is it no longer relevant?
I see only

p.alias [0] = = "plugin.clearable"

Hello,

Please clarify the question again. For which platform, and what needs to be done?

[Isaev]

I would like to respond to a ClearButton press on the server. Therefore, I want to send ajaxRequest from the onClick handler on the client to process it on the server in AjaxEvent

function afterrender(sender, eOpts)
{
  console.log('>>> ', sender.uname, '.onAfterRender()');
  sender.plugins.forEach(function(p) {
        console.log('>> plugin: ', p.alias[0], ' = ', p);
        console.log('JSId: ', p.cmp.$iid);
        if (p.alias[0] == "plugin.clearbutton") {

            // default click handler:
            // handleMouseClickOnClearButton: function(event, htmlElement, object) {
            //     if (!this.isLeftButton(event)) {
            //         return;
            //     }
            //     this.textField.setValue('');
            //     this.textField.focus();
            // }

            // remove default click handler if is needed
            //p.clearButtonEl.un('click', p.handleMouseClickOnClearButton, p);

            // add your click handler
            p.clearButtonEl.on('click', function(event, htmlElement, object) {
                // your logic
                ajaxRequest(p.cmp, 'clearButtonClick', [p.cmp.$iid]);
            })
        }
    })
}

>>>  LUCbBx_category .onAfterRender()
>> plugin:  plugin.clearable  =  constructor {cmp: ctor, pluginConfig: {…}, initialConfig: {…}, config: {…}, initConfig: ƒ, …}

but p.alias[0] is always "plugin.clearable" and never "plugin.clearbutton"

[Sherzod]

Well, 

20 minutes ago, Isaev said:

plugin.clearable

Try using this object then.

[Isaev]

21 minutes ago, Sherzod said:

Well, 

Try using this object then.

then p.clearButtonEl is undefined

[Sherzod]

I will try to check. 

[pitterson]

On 10/4/2016 at 12:27 PM, Farshad Mohajeri said:

This event is handled and used internally on client side. It is not sent to the server, so it can not be handled without additional implementations on client side.

This event is solely processed on the client side and not sent to the server. Handling it would call for extra client-side implementations because it cannot be controlled server-side with the current design.

[Isaev]

@pitterson, 

this is exactly the "call for extra client-side implementations"

[Sherzod]

@Isaev

Hello,

You can also try this approach.

1. UniDBLookupComboBox1.ClientEvents.ExtEvents ->

function afterrender(sender, eOpts) 
{
    var me = sender,
        clearBtn = me.getTrigger('clear');

    if (clearBtn) {
        clearBtn.getEl().dom.addEventListener('click', function(e) {           
            /*
              If you want to cancel the default handler
              e.stopPropagation();
            */
            
            ajaxRequest(me, 'clearClick', {value: me.getValue()}, false);
        })
    }
}

2. UniDBLookupComboBox1.OnAjaxEvent ->

...

[Isaev]

@Sherzod

Thank you, it works well!