Hi,
I am using Infragistics v13.2. I was looking at the functionality of WebHTMLEditor.
I noticed that in design tab, every line that is entered is added as a new <div>. Is there any way where Instead of adding as a new div, a <br> can appended ?
Like -
In design tab if i type
This is line one
Hello,
Please let me know if you need any further assistance with this matter.
Hello Vaishnavi,
Thank you for posting in our community.
What I can suggest for achieving your requirement is using the UseLineBreak property of WebHtmlEditor. This property gets or sets a value which determines how enter key presses behave. If it is set to true enter key presses insert a BR tag, if it is set to false enter key presses insert a <div>/<p>/<br> tag depending on the browser. Please note that the tag that is going to be inserted when the property is browser specific (Internet Explorer inserts <P> tag, Chrome inserts <div> tag, Firefox inserts<br> tag by default). Additionally, keep in mind that when the property is set to true, in order to get the <br> Enter key should be pressed in combination with Shift key (Shift + Enter).
Some further reference about UseLineBreak property could be found at:
http://help.infragistics.com/Help/Doc/ASPNET/2014.1/CLR4.0/html/Infragistics4.WebUI.WebHtmlEditor.v14.1~Infragistics.WebUI.WebHtmlEditor.WebHtmlEditor~UseLineBreak.html
Alternatively, you could capture the KeyDown client side event for the WebHtmlEditor. In this event the key code could be checked and if the sender of the event is the enter key you could get reference to the current content of the editor as string (using getText() function). Afterwards, depending on the browser, the <div> tag(for chrome browser) could be replaced with br tag. For example:
function WebHtmlEditor1_KeyDown(oEditor, keyCode, oEvent) { if (keyCode == 13) { //get reference to the editors text var editorText = oEditor.getText(); if (navigator.userAgent.indexOf("Firefox") != -1) { // alert("Firefox"); } if (navigator.userAgent.indexOf("Chrome") != -1) { //replace <div> tags with <br> tags } var isIE = false || !!document.documentMode; if (isIE) { //replace <p> tags with <br> tags } } }
function WebHtmlEditor1_KeyDown(oEditor, keyCode, oEvent) {
if (keyCode == 13) {
//get reference to the editors text
var editorText = oEditor.getText();
if (navigator.userAgent.indexOf("Firefox") != -1) {
// alert("Firefox");
}
if (navigator.userAgent.indexOf("Chrome") != -1) {
//replace <div> tags with <br> tags
var isIE = false || !!document.documentMode;
if (isIE) {
//replace <p> tags with <br> tags
Please keep in mind that this is as custom approach and in order to ensure that it is working as expected you should test all the aspects of the editor in details.
I hope you find this information helpful.
Please feel free to contact me if you need any further assistance with this matter.