I am trying to figure out the link issue in my custom text component. But not able to find out.
When I am creating new link by using my custom text component, then my link is coming in the next line and also it is broken, as shown in below screenshot.
<?xml version="1.0" encoding="UTF-8"?> <jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0" jcr:primaryType="cq:Dialog" padding="5" title="Edit Text" height="{Long}380" width="{Long}575" xtype="dialog"> <items jcr:primaryType="cq:WidgetCollection"> <tabs jcr:primaryType="cq:TabPanel"> <items jcr:primaryType="cq:WidgetCollection"> <General jcr:primaryType="cq:Widget" title="General" xtype="panel"> <items jcr:primaryType="cq:WidgetCollection"> <text jcr:primaryType="cq:Widget" allowBlank="false" hideLabel="true" externalStyleSheets="[/etc/docroot/sunita/components/text/text/css/text.dialog.css]" name="./text" xtype="richtext"> <htmlRules jcr:primaryType="nt:unstructured" path="/apps/sunita/components/text/text/htmlRules.infinity.json" xtype="cqinclude"/> <rtePlugins jcr:primaryType="cq:Widget" path="/apps/sunita/components/text/text/rtePlugins.infinity.json" xtype="cqinclude"/> <listeners jcr:primaryType="nt:unstructured" added="function(comp, parentCt, index) { if ('postProcessor' in comp.editorKernel) { /* I override postProcessor.applyHtmlRules to apply link rules also on postProcessing */ comp.editorKernel.postProcessor.applyHtmlRules = function(dom) { /* todo maybe we should move an extended version of this method to HtmlRules for common use? */ var com = CQ.form.rte.Common; /* adjust tag names to more appropriate (regarding editing) tag names if */ /* necessary */ var tagName = dom.tagName.toLowerCase(); var changedTagName = (this.isPreProcessing() ? this.htmlRules.docType.adjustToRaw(tagName) : this.htmlRules.docType.adjustToDocType(tagName)); var changedDom; if (changedTagName != null) { changedDom = this.context.createElement(changedTagName); this.elementsToChange.push({ 'domToChange': dom, 'changedDom': changedDom }); return false; }
/* handle links (add attributes as specified by rules, remove links with invalid */ /* HREFs) */ if (com.isTag(dom, 'a')) { var href = com.getAttribute(dom, 'href'); if (href) { if (this.htmlRules.links.validateHref(href)) { this.htmlRules.links.applyToObject(dom); return false; } else { this.markForRemoval(dom); return true; } } }
return false; };
/* */
/* original function wrapped */ comp.editorKernel.htmlRules.links.applyToObject_ = comp.editorKernel.htmlRules.links.applyToObject;
comp.editorKernel.htmlRules.links.applyToObject = function(obj) { var anchorWrapper; /* this override override wraps every link with its child as was required in DFCOB-531 */ comp.editorKernel.htmlRules.links.applyToObject_(obj);
if (obj.childElementCount > 0) { anchorWrapper = CQ.Ext.getDoc().dom.createElement('DIV');
if (obj.firstChild.nodeName == 'IMG') { /* we leave images as they were */ return; } else { CQ.Ext.each(obj.children, function(childEl) { /* we clone anchor and its child */ var clonedLink = obj.cloneNode(false); var clonedContent = childEl.cloneNode(false);
/* regular ExtJS's .appendChild cannot be used because it does not handle TextNodes */
while (childEl.hasChildNodes()) { clonedLink.appendChild(childEl.removeChild(childEl.firstChild)); }
also, what is the value stored in the content ? does it include '123'. Also did you try debugging using browser console and see if any of the CSS causing this issue ?