textarea’s “required” attribute doesn’t work even though the value is empty
You have empty space inside text area, remove it: <textarea name=”reviews” rows=11 cols=50 maxlength=250 required ></textarea> Fiddle demo
textarea
selectionStart and selectionEnd in contenteditable element
Try this, it returns the selected text, no matter if it’s contentEditable or not. function GetSelectedText() { if (document.getSelection) { // all browsers, except IE before version 9 var sel = document.getSelection(); // sel is a string in Firefox and Opera, // and a selectionRange object in Google Chrome, Safari and IE from version 9 … Read more
How to have a textarea to keep scrolled to the bottom when updated
You can do it by javascript. Set the scrollTop property of text area with scrollHeight property like below: document.getElementById(“textarea”).scrollTop = document.getElementById(“textarea”).scrollHeight
Can I make a textarea grow with text to a max height?
You can use contenteditable and let the user input in a straight div, here’s a demo: http://jsfiddle.net/gD5jy/ HTML <div contenteditable> type here… </div> CSS div[contenteditable]{ border: 1px solid black; max-height: 200px; overflow: auto; }
HTML : Is there any way to show images in a textarea?
Use a div with contentEditable attribute which acts like a textarea. That’s how wysiwyg editors are created. div { width: 300px; height: 200px; border: 1px solid #ccc; } <div contentEditable=”true”>Type here. You can insert images too <img src=”http://t2.gstatic.com/images?q=tbn:ANd9GcQCze-mfukcuvzKk7Ilj2zQ0CS6PbOkq7ZhRInnNd1Yz3TQzU4e&t=1″ /> </div>
New Line in Textarea to be converted to
This will replace line breaks to HTML break tags. The different combinations are to cover the different browsers/systems and how line breaks are interpreted. $(this).val().replace(/\r\n|\r|\n/g,”<br />”) This will bring it back to new lines – also covering how different browsers interpret innerHTML. boxText.replace(/<br\s?\/?>/g,”\n”);
I am using tinymce, Is it possible to apply for only one textarea
For the textarea assign a class=”” to textarea property, this will support for you <script type=”text/javascript”> tinyMCE.init({ //mode : “textareas”, mode : “specific_textareas”, editor_selector : “myTextEditor”, theme : “simple” }); </script> <textarea id=”txtdesc” name=”txtdesc” class=”myTextEditor” rows=”6″ cols=”96″ ></textarea>
display line breaks asp.net mvc razor
There’s an even better/awesome solution that employs CSS white-space property: Using this you avoid Cross-site scripting (XSS) vulnerabilities… <p style=”white-space: pre-line”>@Model.Message</p> Works like a charm with ASP.NET MVC Razor engine.
How to get the height of the text inside of a textarea
element.scrollHeight is probably worth investigating. If I was going to approach this (and I’ve not tested this at all), I’d set the textarea’s height to 1px measure the scroll height and then reset the textarea’s height. https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollHeight
Limiting number of lines in textarea
This might help (probably be best using jQuery, onDomReady and unobtrusively adding the keydown event to the textarea) but tested in IE7 and FF3: <html> <head><title>Test</title></head> <body> <script type=”text/javascript”> var keynum, lines = 1; function limitLines(obj, e) { // IE if(window.event) { keynum = e.keyCode; // Netscape/Firefox/Opera } else if(e.which) { keynum = e.which; } … Read more