Goal
A simple dialog-ready event listener fired when a Touch UI dialog is opened (listener top aligns field labels)
Package Install
Solution
1) Login to CRXDE Lite, create folder (nt:folder) /apps/touch-ui-sample-dialog-ready
2) Create clientlib (type cq:ClientLibraryFolder) /apps/touch-ui-sample-dialog-ready/clientlib and set a property categories of String type to cq.authoring.dialog
3) Create file ( type nt:file ) /apps/touch-ui-sample-dialog-ready/clientlib/js.txt, add the following
labels.js
4) Create file ( type nt:file ) /apps/touch-ui-sample-dialog-ready/clientlib/labels.js, add the following code
(function ($, $document) { "use strict"; $document.on("dialog-ready", function() { $(".coral-Form-fieldlabel").css("float", "none"); }); })($, $(document));
Wondering if a component level clientlib can be written that have access to the page properties the component it is on.
ReplyDeleteWondering if that will affect all dialogs.
ReplyDeleteYes, that is happening to me, I haven't find a way to fix it.
Deleteconst componentName = 'myComponentName';
Delete$document.on('dialog-ready', function() {
Granite.author.DialogFrame.currentDialog;
if (componentName !== currentDialog.editable.name) return;
// place the code that needs to be executed only for this dialog here
});