jHtmlArea - WYSIWYG HTML Editor for jQuery

New Post: Automatic
&

dunxz — Thu, 23 May 2013 01:53:35 GMT

**rpiggott wrote:**

Is there a way that instead of using <br> for a new line <p> & </p> could be implemented instead?

I have no idea but I'd vote for this if i could

Commented Issue: Unable to get value of the property 'msie': [16161]

wilpig — Thu, 09 May 2013 02:07:52 GMT

Doesn't work with latest version of jQuery, I get this error:

Unable to get value of the property 'msie':
Comments: ** Comment from web user: wilpig **

Duplicate of bug #15990

[http://jhtmlarea.codeplex.com/workitem/15990](http://www.example.com)

New Post: Allow for Mutliple ID's and Classes when using more than one instance.

dblu — Tue, 07 May 2013 21:14:22 GMT

Maybe this will help someone. I needed two instances, and wanted to give 2 ID's and a class. This is not hard and maybe it was posted somewhere but I thought I would post it anyways:

Added this:

if (opts.idName) iframe.attr("id",opts.idName);
if (opts.className) iframe.attr("class",opts.className);

after this about line 45:

var iframe = this.iframe = $("<iframe/>").height(textarea.height());

Then added the options on the page:

$("#answer").htmlarea({
    // Override/Specify the Toolbar buttons to show
    toolbar: [
        ["html"],
        ["bold", "italic", "underline"],
        ["orderedList", "unorderedList"],
        ["justifyleft", "justifycenter", "justifyright"],
        ["forecolor", "image"]                                      
    ],
    idName:"editor1",
    className:"c_editor"                  
});
        
$("#question").htmlarea({
    // Override/Specify the Toolbar buttons to show
    toolbar: [
        ["html"],
        ["bold", "italic", "underline"],
        ["orderedList", "unorderedList"],
        ["justifyleft", "justifycenter", "justifyright"],
        ["forecolor"]                                      
    ],
    idName:"editor2",
    className:"c_editor"               
});

$(".c_editor").contents().find('body').css({"font-family" : "Verdana, Geneva, sans-serif" });   
$(".c_editor").css({"border-color": "#000", 
                        "border-width":"1px", 
                            "border-style":"solid"});

Created Issue: Bug: $element.htmlarea('html', '') doesn't do anything [16190]

koosvdkolk — Fri, 03 May 2013 18:33:00 GMT

How to reproduce:

* $element.htmlarea('html', '');
* Expected behavior: editor is emptied
* Observed behavior: nothing happened

The bug is caused by the following code:
```
html: function (v) {
if (v) {
this.textarea.val(v);
this.updateHtmlArea();
} else {
return this.toHtmlString();
}
},
```

if(v) returns 'false' when v is empty.

Solution: check for 'undefined'

```
html: function (v) {
if (v === undefined) {
this.textarea.val(v);
this.updateHtmlArea();
} else {
return this.toHtmlString();
}
},
```

Commented Issue: Unable to get value of the property 'msie': [16161]

skpatel20 — Sat, 27 Apr 2013 04:35:17 GMT

Doesn't work with latest version of jQuery, I get this error:

Unable to get value of the property 'msie':
Comments: ** Comment from web user: skpatel20 **

New Post: rending with width and height zero values

Justin16l — Wed, 24 Apr 2013 13:20:47 GMT

I had the same problem. Here's why it's happening. If you have the textarea hidden (because of css/js, like with tabs), then jHtmlArea calculates its' width and height as 0. So the fix is to either make sure that the textarea is not hidden, or add another function that initiates when the hidden text area is shown.

Normal usage, but making sure the textarea is actually visible:

$("textarea:visible").htmlarea();

For cases where you need it to initiate later on, after showing the div, you can do this:

if ($('.myDiv').is(":visible")) {
        $("textarea:visible").htmlarea();
}

That's the basic idea anyway. I've just implemented a fix like this, and haven't has a problem so far.

New Post: auto focus in iphone 6.0

biechereran — Sun, 21 Apr 2013 11:47:19 GMT

Hello there,

I have tried to detect auto focus after loading and chage the param (keyboardDisplayRequiresUserAction to NO) in the webview of my applicaion.

The keyboard jumped looks fine and even the cursor is in the right position, the only problem is that the character that taps is not display in the edited area.

Any suggestion?

New Post: Hide horizontal scroll bar

Solg — Fri, 19 Apr 2013 14:06:43 GMT

Hi,

Try this

    $("#myTextArea").htmlarea({
        css: '@Url.Content("~/Content/jHtmlArea.Editor.css")'
    });

jHtmlArea.Editor.css:
body
{

background-color: transparent;
margin: 0;
padding: 0;

}

Created Issue: Unable to get value of the property 'msie': [16161]

RichHamilton — Mon, 15 Apr 2013 15:33:27 GMT

Doesn't work with latest version of jQuery, I get this error:

Unable to get value of the property 'msie':

New Post: Hide horizontal scroll bar

jamin824 — Fri, 05 Apr 2013 04:09:08 GMT

Anyone solved this?

New Comment on "Modify Editor Programatically using JavaScript"

Millzy — Wed, 27 Mar 2013 14:37:32 GMT

I'm trying to add some custom CSS classes to the iframe or editor side of the WysiWyg editor but can not seem to get them to work when adding the classes. I tried adding them to the iframe but that doesn't work, can anyone help please.

New Post: Automatic
&

rpiggott — Tue, 26 Mar 2013 22:10:56 GMT

Is there a way that instead of using <br> for a new line <p> & </p> could be implemented instead?

Created Issue: using jhtmlarea in jtable [16111]

Mteodoro — Wed, 20 Mar 2013 00:19:14 GMT

using this code inside jtable plugin to create a custom field returns document of null

```
var $dp = $("<textarea class='" + field.inputClass + "'>" + (value || '') + "</textarea>")
$dp.htmlarea();
return $dp;
```

TypeError: Cannot read property 'document' of null

what can it be?

New Post: problem display 'accent' on editor

forst — Wed, 13 Mar 2013 14:48:26 GMT

Hello all

I have a file with extension txt who contain a simple text with accent such as é ,è,...
When i insert this file into editor , there are incorrect caracter

function()  {   
      $.ajax({
        url : name_file,
    dataType: "text",
    success : function (data) 
               {      $("#editor").htmlarea('html', data ); }
              });       
}

Source code checked in, #100726

crpietschmann — Sun, 10 Mar 2013 17:03:21 GMT

Updated Nuget package to include jQuery dependency

Updated Wiki: Home

crpietschmann — Sun, 10 Mar 2013 16:56:59 GMT

Project Description
A simple, light weight, extensible WYSIWYG HTML Editor built on top of jQuery. This component allows you to easily display a WYSIWYG HTML Editor in place of any TextArea DOM Elements on the page. The minified script alone is 9.17kb; CSS and Images it's a total of 25.9kb.

This project also includes Visual Studio JavaScript Intellisense support.

Live Demo: http://pietschsoft.com/demo/jHtmlArea

Key Advantages of jHtmlArea

Free, open source (Microsoft Public License)
Simple and Lightweight - 10kb minified - 23.6kb w/ css and images
Supports all mainstream browsers - IE7/8/9+, Firefox 3+, Safari 4+, Chrome
Built on top of jQuery (requires jQuery 1.3.2 or higher)
Full Documentation

View Documentation for full usage examples

Nuget Package

http://nuget.org/packages/jHtmlArea

Tutorials / Articles

Basic Usage

$(function(){
    $("textarea").htmlarea();
});

Icons

This project also includes icons from the Silk Icon Set by Mark James. You can download the Silk Icon Set here: http://www.famfamfam.com/lab/icons/silk/

Contributors

This project is maintained by Chris Pietschmann. He is a Microsoft MVP for Bing Maps, a Co-Founder of Carto LLC, and the Owner of Simplovation LLC a software development consulting company that specializes in Mapping/GIS related application development.

Source code checked in, #100725

crpietschmann — Sun, 10 Mar 2013 16:56:17 GMT

Added Nuget Package

Created Issue: How to disable edit text [16077]

tjcombos — Thu, 28 Feb 2013 17:23:45 GMT

Can I disable user editing text after called ?
$('#textarea').htmlarea();

Please assist, thanks.

New Post: How to focus a editor textarea

WebDevCA — Thu, 21 Feb 2013 03:43:42 GMT

I don't want to start a new thread since my question is similar but I'm wondering if the jHtmlArea plugin natively detects if a TEXTAREA it is being applied to has focus and then gives that focus to the associated IFRAME that it creates for that TEXTAREA.

New Post: default jhtml font-family

siho — Tue, 19 Feb 2013 15:56:07 GMT

Hi
Any news on this? I'm also not able to use default css for the jhtmlarea.
Thanks

Cornelia Sihota

jHtmlArea - WYSIWYG HTML Editor for jQuery

New Post: Automatic &

Commented Issue: Unable to get value of the property 'msie': [16161]

New Post: Allow for Mutliple ID's and Classes when using more than one instance.

Created Issue: Bug: $element.htmlarea('html', '') doesn't do anything [16190]

Commented Issue: Unable to get value of the property 'msie': [16161]

New Post: rending with width and height zero values

New Post: auto focus in iphone 6.0

New Post: Hide horizontal scroll bar

Created Issue: Unable to get value of the property 'msie': [16161]

New Post: Hide horizontal scroll bar

New Comment on "Modify Editor Programatically using JavaScript"

New Post: Automatic &

Created Issue: using jhtmlarea in jtable [16111]

New Post: problem display 'accent' on editor

Source code checked in, #100726

Updated Wiki: Home

Key Advantages of jHtmlArea

View Documentation for full usage examples

Nuget Package

Tutorials / Articles

Basic Usage

Icons

Contributors

Source code checked in, #100725

Created Issue: How to disable edit text [16077]

New Post: How to focus a editor textarea

New Post: default jhtml font-family

New Post: Automatic
&

New Post: Automatic
&