iSeller Commerce
iSeller POS Retail
iSeller POS F&B
iSeller POS Express
Crosslight
WebUI
ClientUI
What's New
Download Trial
Web Solution
Mobile Solution
Enterprise Solution
Custom Development
Blog
Community
Latest Development Blogs
ForumPostTopic
Browse By Tag
In WebTextEditor I have used the MailMerge function to insert merge-labels in a document. This works fine.
The problem I am experiencing is: When I select the merge-label I have inserted in the document and mark it as bold, the bold-tags are inserted inside the mail-merge span instead of outside the mailmerge span.
Is it possible to ensure that when a mail-merge field is selected, the whole mail-merge span is selected instead of just the label text?
As an alternative, is there a clientside action associated with changing the location in the document (ie clicking to the left of the label text), which would allow me to move the location to the left of the mail-merge span?
RegardsChristian
You could retrieve the selection of the HTML element the command executed on using the GetSelectionParentNode function. For your scenario, you try using the OnAfterExecCommand event handler and rewrite the HTML element so the style tag will be outside of the SPAN with the type attribute mailmerge.
Here is the snippet for Bold command:
function WebTextEditor_OnAfterExecCommand(controlId, action){ var WebTextEditor = ISGetObject(controlId); var selection = WebTextEditor.GetSelectionParentNode(); if(selection.parentElement.getAttribute("type") == "mailmerge") { switch(action) { case "Bold": var oNew = document.createElement("strong"); selection.parentElement.parentElement.insertBefore(oNew, selection.parentElement); oNew.appendChild(selection.parentElement); selection.parentElement.innerHTML = selection.parentElement.innerHTML.replace(/<strong>/i, "").replace(/<\/strong>/i, ""); break; } }}
Hi Christian,
Unfortunately, that would be our default behavior. However, I have created a workaround that perhaps might fulfill your scenario. We will need to use "OnToolBarClick" client side event and rewrite the tag format. Here is the snippet:
function WebTextEditor_OnToolBarClick(controlId, command, commandSection) { var WebTextEditor = ISGetObject(controlId); var NewMailMerge = WebTextEditor.MailMergeSettings; var NewSelection = WebTextEditor.Selection; if (command.Id == "cmdBold") { for (var i = 0; i < NewMailMerge.Labels.length; i++) { if (NewSelection != null) { if (NewMailMerge.Labels[i].Label == NewSelection.text) { var Span = "<strong>"; Span = Span.concat(NewSelection.htmlText); Span = Span.concat("<\strong>"); NewSelection.pasteHTML(Span); } } } } return true; }
I hope it can help you. Please let me know if it does not meet your scenario. Thank you and have a nice day.
Best Regards,
Andi Santoso
Hi Andi,
Thank you for your suggestion. It works just fine, however I have a couple of questions:
I have just tried to create a check to ensure that the user can't change the formatting of only part of the merge-label. Unfortunately the text is still bold, even if I return false:
var WebTextEditor = ISGetObject(controlId); var NewSelection = WebTextEditor.Selection; if (NewSelection != null) { // Remove white spaces before and after the selection var text = rtrim(ltrim(NewSelection.text)); if (text.indexOf('}') < text.indexOf('{') || (text.indexOf('{') <0 && text.indexOf('}') > 0) || (text.indexOf('{') > 0 && text.indexOf('}') < 0)) { // Only part of mail merge selected opt out return false; } }
How do I ensure that the toolbar-command is cancelled?
In order to cancel the command execution you will need to return false in the OnBeforeExecCommand event handler not in the OnToolBarClick event handler. Here is the snippet for OnBeforeExecCommand event handler assuming this is for Bold action command, since I do not have the ltrim and rtrim function I only use text selection:
function WebTextEditor_OnBeforeExecCommand(controlId, action){ var WebTextEditor = ISGetObject(controlId); var NewMailMerge = WebTextEditor.MailMergeSettings; var NewSelection = WebTextEditor.Selection; //Should remove white spaces before and after the selection var text = NewSelection.text; switch(action) { case "Bold": if (text.indexOf('}') < text.indexOf('{') || (text.indexOf('{') < 0 && text.indexOf('}') > 0) || (text.indexOf('{') > 0 && text.indexOf('}') < 0)) { return false; } break; }}
Thanks Glenn, that worked perfectly. The only thing I need to figure out now is how to get the current cursor location, so that I can highlight words the user clicks on (just as when you click on a merge label), and so that I can overwrite any typing inside a mail merge tag.
I am still disucssing the cusror position selection with the developer. I will inform you in this thread after I have some update regarding the issue.
or
Choose this if you're already a member of Intersoft Community Forum. You can link your OpenID account to your existing Intersoft Social ID.
Choose this if you don't have an Intersoft account yet. Your authenticated OpenID will be automatically linked to your new Intersoft account.
Enter your Wordpress Blogname