Develop Reference

Is there a way to make Enter and Shift + Enter work the same way in TinyMCE?

I'm using tinymce-react package in my current project. Is there a way to make "enter" and "shift + enter" work the same way? In my case I need them both to insert <p></p> when pressed. I tried different variations of force_root_block, force_p_newlines and force_br_newlines but it always ends up that one of them insert <p></p> and the other one <br/>. Thanks in advance for help :)

Are you looking for something like this?
//target textarea with querySelector
var textA = document.querySelector("textarea");
textA.addEventListener("keyup", function(event) {
// keyCode 13 is the "Enter" key on the keyboard
// keyCode 16 is the "Shift" key on the keyboard
if (event.keyCode === 13 || event.keyCode === 16) {
// Prevent default action
event.preventDefault();
//if shift or enter are pressed then insert new paragraph
textA.value = textA.value + "<p></p>"
}
});
<textarea></textarea>

HTML textarea linebreak on enter key press don't work

I have a textarea and when click enter it doesn't insert a linebreak,
I tried to use the following code, But, when i press enter, it goes to the end fo text and add new line.
$("#descre").on('keydown', function(e) {
var code = e.keyCode || e.which;
if (code == 13) { //Enter keycode
event.preventDefault();
var s = $(this).val();
$(this).val(s + "\n");
}
});
I want to make a normal enter press, like ex: jsfiddle

My textarea was not working well, so to accept enter key press on normal behaviour i used the code:
$('#descre').keypress(function(e) {
if (e.keyCode == 13) {
e.preventDefault();
this.value = this.value.substring(0, this.selectionStart) + "" + "\n" + this.value.substring(this.selectionEnd, this.value.length);
}
});

You have passed e in the function as argument but in the if block you are doing event.preventDefault() change it to e.preventDefault()
//i try this one
$("#descre").on('keydown', function(e) {
var code = e.keyCode || e.which;
if(code == 13) { //Enter keycode
e.preventDefault();
var s = $(this).val();
$(this).val(s);
}
});
You are adding an extra line in the end yourself. Thats why it is inserting the extra k=line

Firefox OS: start searching on enter key press

I am new in Firefox OS. I have a search box.
After pressing the submit button it shows results perfectly. But I want to add keyboardevent like press enter button it will show result.

Try this:
$("#SearchText").keydown(function (e) {
var keyCode = e.keyCode || e.which;
if (keyCode == 13) {
//stop CR & do submit here instead
document.forms["myform"].submit();
return false;
}
});
It intercepts every key press in the search text field and checks for Return.

How do I get key values in HTML/Javascript

Okay, so i understand how to get the key value while using an input field... but I am taking about key values that are pressed while your browser isn't focused in any text box or text area.
I am trying to make a onscreen keypad that has buttons for 0, 1, 2, .. 9... however I want the user to be able to press the buttons with the keys on the keyboard.
I've seen this done in some websites, where if you press the S key on the homepage, it will take you to the signin screen. Facebook also does the L key, to like a photo.
So the question is: How do I get the key values in javascript, when the cursor isn't focused.

If you are using JQuery you just add the event handler to the document...
$(document).keypress(function(event) {
alert('Handler for .keypress() called. - ' + event.which);
});
(From http://forum.jquery.com/topic/how-to-catch-keypress-on-body)
Edit for zzzzBov's comment...
From the JQuery KeyPress documentation:
To determine which character was entered, examine the event object
that is passed to the handler function. While browsers use differing
properties to store this information, jQuery normalizes the .which
property so you can reliably use it to retrieve the character code.

you need to use window.onkeydown and then check for the keys you're interested in.
https://developer.mozilla.org/en-US/docs/Web/API/window.onkeydown

You should listen on key press event.
document.onkeypress = function(evt) {
evt = evt || window.event;
var charCode = evt.which || evt.keyCode;
alert("Character typed: " + String.fromCharCode(charCode));
};
For more info Look here Link

You need to add an event listener to the window. Then in the event handler, you get the keyCode property from the passed-in event. KeyCodes are semi-arbitrary in that they don't directly map to what you might think, so you have to use a table (first result on google: http://www.cambiaresearch.com/articles/15/javascript-char-codes-key-codes) to identify the keycodes you care about.
window.addEventListener('keypress',function (evt) {
switch (evt.keyCode) {
case 48:
zeroKeyPressed(); break;
case 49:
oneKeyPressed(); break;
...
}
}, false);

You would use a key press event.
Here's an example for your usage:
window.addEventListener('keypress', function (event) {
var key_code, key;
event = event || window.event; // IE
key_code = event.charCode || event.keyCode || event.which || 0;
key = String.fromCharCode(key_code);
// prevent keys 0-9 from doing what they normally would do
if (key_code >= 48 && <= 57) {
event.preventDefault();
alert('The user pressed ' + key);
}
}, false);

Using plain js, you can use this in your layout.htmlcs, at the beginning:
#{
<script>
sessionStorage.setItem("ProductionHostURL", '#System.Configuration.ConfigurationManager.AppSettings["ProductionHostURL"]');
</script>
}
<!DOCTYPE html>
Then in your main js file of the layout.htmlcs, you can use this a method liked this:
var urlBaseProduction;
var urlBaseDevelopment;
$(document).ready(function () {
configureHostEnvironment()
....
}
In that method, configure the variables to use in production and development, like this:
function configureHostEnvironment(){
HOST = sessionStorage.getItem("ProductionHostURL")
if (HOST.length <= 0) {
alert("Host not configured correctly")
} else {
urlBaseProduction= host + '/api/';
urlBaseDevelopment= host + port + '/api/';
}
}
If you have a suggestion or improvement to this method, please comment.

jQuery how to figure out if user inputed ' ' in text input area?

we have an input type="text" user prints into it some string. each time he inputs empty space char we want to call some function. How to do such thing with jQuery?

$(input).keydown(function (e) {
if ( e.which === 32 ) {
// do your thing
}
});
where input is a reference to your INPUT element.
Live demo: http://jsfiddle.net/uHpLg/

Check out jQuery's keypress event:
$("#YourInputId").keypress(function() {
var code = (e.keyCode ? e.keyCode : e.which);
if(code == 32) { // 32 = space keycode
//Do something
}
});
Here's a web page that has a list of javascript key codes.

Bind a listener to the input onchange event.
Compare the current value to the last value and check is the new character is a space
If so, call a function.

you can select the input text box and bind to it a change listener
but this will work only when the box is unfocused and the new value is different than the old value
$(document).ready(function () {
$('#mytextbox').change(function(){
if ($(this).val() == ' ')
{
// do whatever u want
}
});
});
but if u wanted something like autosuggestion (don't wait for user to unfocus the text input ) u can create ur own listener
is when the user focus the text box ,key press u check the pressed key and if it's is = " " do whatever u want
and when the user unfocus the input , it stops checking it
$('#mytextbox').keypress(function (e){
if (e.keycode == 32 )
{
// do your code here
}
});
for more info about keycodes : http://asquare.net/javascript/tests/KeyCode.html
on keypress Jquery function documentation : http://api.jquery.com/keypress/