Issues with clientlib execution in dialog participant step

[test1234567]

Hi team, I noticed some issues with loading the clientlib in the dialog participant step. I have created a new component with a dialog to load the required fields in the dialog participant step. However, the fields in the dialog are being loaded in the workflow step instead. My intention is to restrict the user from manually entering text into the text field, and instead use the datepicker to provide input. To achieve this, I have created a clientlib to load if the user completes the step from the workflow inbox. I have added the clientlib to the 'cq.inbox.gui.commons' category, but the script is not manipulating the field as expected eventhough the script is loading. Can someone advise on this?

(function ($, document, ns) {
    $(document).on("dialog-ready", function() {
    $('.cmp-activationdate__editor .coral3-Textfield.coral-InputGroup-input').attr('onkeydown', 'return false');
    });
})(Granite.$, document, Granite.author);

[abhishekanand_]

Hi @test1234567 

Try adding a slight delay to ensure the dialog is fully loaded

(function ($, document, ns) {
    $(document).on("dialog-ready", function() {
        setTimeout(function() {
            $('.cmp-activationdate__editor .coral3-Textfield.coral-InputGroup-input').attr('onkeydown', 'return false');
        }, 500); // Adjust the delay as needed
    });
})(Granite.$, document, Granite.author);

 If you prefer not to use setTimeout, you can ensure the script runs only when the dialog is fully ready by using the foundation-contentloaded event

(function ($, document, ns) {
    $(document).on("foundation-contentloaded", function() {
        $('.cmp-activationdate__editor .coral3-Textfield.coral-InputGroup-input').attr('onkeydown', 'return false');
    });
})(Granite.$, document, Granite.author);

Hope this helps! 

[test1234567]

Thanks for your reply. Looks like the clientlib is not getting executed in modal popup window.

[arunpatidar]

Hi @test1234567 

I remember doing something similar where we had date picker in the dialog and validating date against some time frame when user submit the participant dialog

However I have written event on date-picker(.cq-dialog-scheduled-date) field change

$(document).on("change", ".cq-dialog-scheduled-date", function() {

})

[test1234567]

Thanks for your reply. Actually, on the "/aem/inbox" page, the code hits the breakpoint in JS, but not when I open the "Complete Work Item" window/modal popup. Should I need to try differently?

[arunpatidar]

Hi @test1234567 
You may need to check if the clientlibs is loading or not, how are you loading the clientlibs?

[kautuk_sahni]

@test1234567 Did you find the suggestions helpful? Please let us know if you require more information. Otherwise, please mark the answer as correct for posterity. If you've discovered a solution yourself, we would appreciate it if you could share it with the community. Thank you!