Menu
I have recently decided to use the jQuery text editor. However, I am confused when I access the textarea on which I am using the jqte the textarea shows no data.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>jQuery TE | Downloaded Demo | v.1.3.6</title>
<link type="text/css" rel="stylesheet" href="demo.css">
<link type="text/css" rel="stylesheet" href="../jquery-te-1.3.6.css">
<script type="text/javascript" src="http://code.jquery.com/jquery.min.js" charset="utf-8"></script>
<script type="text/javascript" src="../jquery-te-1.3.6.min.js" charset="utf-8"></script>
</head>
<body>
<h1>jQuery TE</h1>
<div class="navigation">
<a href="http://jqueryte.com" target="_blank">Home</a>
<a href="http://jqueryte.com/demos" target="_blank">Demos</a>
<a href="http://jqueryte.com/documentation" target="_blank">Documentation</a>
<a href="http://jqueryte.com/comments" target="_blank">Comments</a>
<a href="http://jqueryte.com/about" target="_blank">About</a>
<a href="http://jqueryte.com/license" target="_blank">License</a>
</div>
<h2>Demo | v.1.3.6</h2>
<!------------------------------------------------------------ jQUERY TEXT EDITOR
<textarea cols="2" rows="3" name="textarea" class="jqte-test" id="mytextarea"><b>My contents are from <u><span style="color:rgb(0, 148, 133);">TEXTAREA</span></u></b></textarea>
<p>
<button class="status">Toggle jQTE</button>
</p>
<hr>
<input name="input" type="text" value="<b>My contents are from <u><span style=& quot;color:rgb(0, 148, 133);">INPUT</span></u></b>" class="jqte-test"/>
<div name="div" class="jqte-test"><b>My contents are from <u><span style="color:rgb(0, 148, 133);">DIV</span></u></b></div>
<script>
$('.jqte-test').jqte();
// settings of status
var jqteStatus = true;
$("textarea#mytextarea").bind(function(){ alert($(this).html()) ;});
$(".status").click(function()
{
jqteStatus = jqteStatus ? false : true;
$('.jqte-test:first').jqte({"status" : jqteStatus})
});
</script>
I am actually checking how should I get the jqte formated html? There are no comprehensive notes on it. Can someone help me?
923
The actual editor window is a div with the class "jqte_editor".
And so...
$(".jqte_editor").html()
... will give you the latest/edited content.
97
I had this same problem and here is what I did to solve it.
I noticed the plugin had a setter but not a getter equivalent for the value of the editor; this is odd because the normal jQuery pattern for plugins that create content with a value is to have the getter be an overloaded paramater-less version of the setter.
So I looked in the plugin code and made this modification. From the uncompressed version of the code:
This:
$.fn.jqteVal = function(value){
$(this).closest("."+vars.css).find("."+vars.css+"_editor").html(value);
}
Changed to:
$.fn.jqteVal = function(value){
if(typeof value === 'undefined'){
return $(this).closest("."+vars.css).find("."+vars.css+"_editor").html();
}else{
$(this).closest("."+vars.css).find("."+vars.css+"_editor").html(value);
}
}
And from the 'minified' version:
This:
e.fn.jqteVal=function(t){e(this).closest("."+u.css).find("."+u.css+"_editor").html(t);}
Changed to:
e.fn.jqteVal=function(t){if(typeof t === 'undefined'){return e(this).closest("."+u.css).find("."+u.css+"_editor").html();}else{e(this).closest("."+u.css).find("."+u.css+"_editor").html(t);}}
After making the change you can now use the jqteVal() function like any other jQuery value function:
$(SELECTOR).jqteVal("text that goes into editor"); //Setter
var editor_value = $(SELECTOR).jqteVal(); //Getter
I am not sure why the author did not do this but I have had a lot of success with this methodology.
31
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
