How can i enable a Break Line or New Line in Textarea when i press the Enter Key ?
So that if I press the ENTER it saves in the form of New Line in database.
I have already searched some topics but it hasn't helped me.
Here is my Textarea Code:
<textarea name="post" id="post" class="valid Post_Text_Area" placeholder="Write something here..." ></textarea>
I tried this JS Code so far. but it hasn't worked for me
JavaScript: How to add line breaks to an HTML textarea?
Newlines in textarea's are saved into the database by default.
To generate them as Html BR codes, use nl2br($yourTextVariable) $yourTextVariable will be the variable you fetch from database. so use it like this :
<?php echo nl2br($yourTextVariable); ?>
This transforms newline to <br />
Another solution is put the output into <pre> tag or just style it with css white-space: pre. It will not swallow multiple spaces.
Related
New to Svelte here and playing with the reactivity concept. This first example works, the file input field correctly shows the selected file.
<script>
let files = []
</script>
<input type='file' bind:files />
This second example (only swapped the input attributes) does not. As can be easily tested in the REPL.
<script>
let files = []
</script>
<input bind:files type='file' />
It complains with "Value being assigned to HTMLInputElement.files does not implement interface FileList." and I don't understand why... do the bindings always have to go last in Svelte?
As #RichHarris explains above... this is a bug in Svelte. For now simply add the bindings to the end of the input element until it has been fixed.
See the Github issue for more info.
UPDATE: This has been fixed in November 2019 (see pull request #3849).
I have a (probably) simple issue that I can't solve and need your help to resolve.
I created a new MVC application with Visual Studio 2017. I then created the necessary Model, View, and Controller to add some data to a SQL Server database.
However, in the TEXTAREA input, I am not able to use the Enter Key to go to a new line, like I am able to do here when I submitted this question. The Enter key does nothing.
I tried to trace the issue and was able to use this script to confirm that the Enter key was detected; however, still can't get a new line when I pressed the Enter key.
<script>
$(window).keydown(function (event) {
if ((event.which == 13) && ($(event.target)[0] == $("textarea")[0])) {
alert("One");
// event.preventDefault();
// return false;
}
});
</script>
Second, I added an onclick event to the textarea itself and still did not get a new line when clicked. There must be an override for the textarea in code that I am not able to find, which is probably part of the default app build in .NET VS2017.
<textarea rows="6" cols="20" class="form-control" asp-for="Notes" style="width: 96% !important;" onclick="this.value='Hello \n How R U?'"></textarea>
Is there any way to correct this issue and gain access to the full TEXTAREA functionalities and be able to provide a full text-based area for users to provide detailed comments in multiple lines?
Thank you for your reply.
I wrote following HTML code to face your problem but there was no problem!
<html>
<head>
<title>
test
</title>
</head>
<body>
<textarea rows="6" cols="20" class="form-control" asp-for="Notes" style="width: 96% !important;"
onclick="this.value='Hello \n How R U?'"></textarea>
</body>
</html>
Did you check your application by another browser?
If the problem still remains, In your browser inspect HTML code of your textarea and compare it to the tag helper equivalent of the textarea in your view code. This may help you to figure something out.
http://view.jquerymobile.com/1.4.0/demos/controlgroup/#Textinputs
I followed the above link from jquery mobile. It doesn't work as expected !
Can someone help
Try setting the height too:
<div data-role="controlgroup" data-type="horizontal">
<input type="text" id="search-control-group" data-wrapper-class="controlgroup-textinput ui-btn">
<button>Submit</button>
</div>
.controlgroup-textinput{
height: 20px;
padding-top:.22em;
padding-bottom:.22em;
}
DEMO
To anyone having the same issue after using the code from the jquerymobile demos!
If you copy html or css content from the demos page, make sure to remove all leading whitespaces (indentation) first and add your own!
The demos page uses some other invisible non breakable spaces that prevent proper css parsing in most browsers!
I had the same issue and when looking into the css parsed by chrome it was marking
" padding-top: .22em;"
as invalid css, because of those non breakable spaces.
i using simple_html_dom.php
how to get textarea value if the website has used bad tag.
the textarea tag already closed before </textarea> like input tag.
Textarea HTML like below:
<textarea name="xxx" id="xxx" />this is value</textarea>
When i use this function, i dont get anything
$textarea = $html->find("textarea[name=xxx]");
$contents = $textarea->innertext;
echo $contents;
how to get 'this is value' using simple_html_dom.php or other alternative?
Thank you
Well, my previous comment won't work in this case, I'll leave it for info though...
Another approach is to clean it up before parsing it with simple_html_dom using Tidy extension. But it seems not to be working here either...
A last approach I can think of, and if this is your only problematic case, is to use regex to get what you want:
Using <textarea.*?name="xxx".*?id="xxx".*?\/>([^<]+)<\/textarea> ==> RegEx DEMO
The output will be in group one of the resulting array $match. Check this working code:
$input = <<<_DATA_
<textarea name="xxx" id="xxx" />this is value</textarea>
_DATA_;
$pattern = '/<textarea.*?name="xxx".*?id="xxx".*?\/>([^<]+)<\/textarea>/';
preg_match($pattern, $input, $match);
var_dump($match)
Working DEMO
It is easy to get the value of a Teaxtarea in javascript:
<script type=text/javascript>
function getValueTextarea()
{
var vl=document.getElementById("tx").value;
alert(vl);
}
</script>
<body>
<textarea id="tx">Value Of Textarea</textarea>
<input id="button" value="Get Value" onclick="getValueTextarea()">
</body>
Is it possible to use html in Foundation's tooltips?
Yes. It supports html in the title attribute.
from foundation.tooltip.js:
create : function ($target) {
var $tip = $(this.settings.tip_template(this.selector($target), $('<div></div>').html($target.attr('title')).html())),
...
Breaking that down it creates a new element wrapped in a div and the contents of the title attribute are inserted into the div using the html() method which will convert any markup in the string to html elements.
The following code:
<img src="example.png"
class="general-infotip has-tip tip-top"
data-tooltip
title="<b>This is bold</b> This is not" />
Will result in a tool tip that looks like
This is bold This is not
In Foundation v6.3+, you can append the attribute data-allow-html="true" to the element to allow html in the tooltip.
For example:
<span data-tooltip data-allow-html="true" aria-haspopup="true"
class="has-tip" data-disable-hover="false" tabindex="1"
title="Fancy word for a <strong>beetle</strong>. <br><br><img src=https://pbs.twimg.com/profile_images/730481747679432704/uc08_dqy.jpg />">
Scarabaeus
</span>
Here it is working in jsfiddle.
For more information, check out the pull request.