Disable New Line in Textarea when Pressed ENTER - textarea

Question

I am calling a function whenever someone press enter in the textarea. Now I want to disable new line or break when enter is pressed.
So new line should work when shift+enter is pressed. In that case, the function should not be called.
Here is jsfiddle demo:
http://jsfiddle.net/bxAe2/14/

Answer 1

try this
$("textarea").keydown(function(e){
// Enter was pressed without shift key
if (e.keyCode == 13 && !e.shiftKey)
{
// prevent default behavior
e.preventDefault();
}
});
update your fiddle to
$(".Post_Description_Text").keydown(function(e){
if (e.keyCode == 13 && !e.shiftKey)
{
// prevent default behavior
e.preventDefault();
//alert("ok");
return false;
}
});

Answer 2

Below code is to prevent to getting resize the "textarea", avoid scroll bar inside textarea, and also prevent to get into next line when enter key is pressed.
style.css
textarea {height:200px; width:200px;overflow:hidden;resize: none;}
index.html
<textarea></textarea>
Script.js
$("textarea").keydown(function(e){
// Enter pressed
if (e.keyCode == 13)
{
//method to prevent from default behaviour
e.preventDefault();
}
});

Answer 3

React: textarea w/ value and onChange event
const PreventTextAreaEnter = () => {
const [comment, setComment] = useState();
const handleTextArea = (e) => {
console.log({e}) // Destructure to get a more accurate log
// Return if user presses the enter key
if(e.nativeEvent.inputType === "insertLineBreak") return;
setComment(e.target.value);
};
return (
<>
<textarea value={comment} onChange={ (e) => { handleTextArea(e) } />
</>
)
}

Answer 4

$(".Post_Description_Text").keypress(function(event) {
if (event.which == 13) {
alert("Function is Called on Enter");
event.preventDefault(); //Add this line to your code
}
});

Answer 5

For Angular Users
While there are existing working solutions, if anyone comes across this question using Angular, you can disable new lines with the following:
Add <textarea ng-trim="false" ng-model='your.model' ...
In your controller, add:
$scope.$watch('your.model', function(newvalue, oldvalue) {
if (newvalue && newvalue.indexOf('\n') > -1) {
$scope.your.model = oldvalue;
}
});

Answer 6

use the input tag instead of textArea tag in your HTML