I'm having an issue with my chat bot app where a line break is being inserted into the form after the user is pressing the submit button. To clarify, the message is being sent, but then creating a line break so the user has to backspace for the form to be completely empty.
var enableEnterKey = function() {
$(document).keypress(function(e) {
if($('#maxx-message-box').is(':focus') && e.keyCode === 13) {
var message = $('#maxx-message-box').val();
sendMessage(message);
}
});
This is our function. Please help.
You probably need something like:
$("#maxx-message-box").keypress(function (e) {
if (e.keyCode != 13) return;
var message = $("#maxx-message-box").val().replace(/\n/g, "");
if (!!message)
{
sendMessage(message);
$("#maxx-message-box").val("");
}
return false;
});
Related
HTML Button that I create
I wanted to know if there is something for an HTML button, simulate that the ENTER key was pressed. Since I need a button to send an automatic chat in which I am working. I was able to implement the button, although it still does not perform any action. The messages are sent by pressing the ENTER key, so I wanted to find a way to simulate that action. Thank you
var fncTxMessageKeydown = function (e) {
e = window.event || e;
var keyCode = (e.which) ? e.which : e.keyCode;
if (keyCode == 13 && !e.shiftKey) {
if (e.preventDefault) {
e.preventDefault();
} else {
e.returnValue = false;
}
var message = elements.txMessage.value.toString().trim();
if (message!=""){
if (gotUid==true) {
EngtChat.sendMessage(message);
elements.txMessage.value = "";
}
else{
//show initialization alert and reconnect socket
document.getElementsByClassName("engt-sheet-header-with-presence")[0].style.padding="7px";
socket.disconnect();
socket.connect();
}
}
return false;
}
};
if (elements.txMessage != undefined) {
elements.txMessage.onkeydown = fncTxMessageKeydown;
firstly English isn't my native language, sorry if I have any mistakes.
There is message sending problem in the function, I've played with Jquery codes but I couldn't fix it.
When I press the Enter, message reach to receiver, that's good.
But when I press the Shift with Enter, message reach to receiver again,
I want to create new line when press the both keys.
Jquery codes:
$(document).ready(function() {
$('input#chat').bind('keydown', function(e) {
if(e.keyCode==13) {
// Store the message into var
var message = $('input#chat').val();
var id = $('#chat').attr('class');
if(message) {
// Remove chat errors if any
$('.chat-error').remove();
// Show the progress animation
$('.message-loader').show();
// Reset the chat input area
document.getElementById("chat").style.height = "25px";
$('input#chat').val('');
Did you try it ?
if(e.shiftKey && e.keyCode==13){
// Don't fill
} else if(e.keyCode==13){
e.preventDefault();
// Store the message into var
var message = $('input#chat').val();
var id = $('#chat').attr('class');
if(message) {
........................
}
In this, while the shift key is pressed a boolean prevents the code from being run.
var ShiftDown = false; //Is false when not being pressed, true when being pressed
$(document).ready(function() {
$('input#chat').keydown(function(e) {
if(e.which === 16) {
//Shift key is pressed
ShiftDown = true;
}else if(e.which === 13){
//Code will only run if Shift key is not pressed
if(ShiftDown === false){
// Store the message into var
var message = $('input#chat').val();
var id = $('#chat').attr('class');
if(message) {
// Remove chat errors if any
$('.chat-error').remove();
// Show the progress animation
$('.message-loader').show();
// Reset the chat input area
document.getElementById("chat").style.height = "25px";
$('input#chat').val('');
}
}
}
})
$('input#chat').keyup(function(e) {
if(e.which === 16){
//Shift key is no longer pressed
ShiftDown = false;
}
});
}
I've just changed
$('input#chat').bind('keydown',function(e){})
to
$('input#chat').keydown(function(e){})
I have a multistep form using jquery validator plugin that also goes to the next page when you press enter.
function showPage(pg){
$('formError').empty();
$('table:visible').hide();
$('#page-' + pg).show();
$('input[type="text"]:visible').focus();
}
$(document).keydown(function(e) {
if(e.which == 13) {
if($('#msform :input:visible').valid()){
page++;
showPage(page);
}}});
The issue is that if you use the enter button, it triggers a validation error on the next page because the button is still being pressed and it tries to go to the next page.
How can I ignore the enter key for a small period so that releasing the enter key works to go to the next page without attempting to go to the page after the next page?
You can wait for the corresponding keyup event before taking in account a new keydown event for the enter key.
pressed = {};
$(document).keydown(function(e){
if(pressed[e.which] == null && e.which == '13'){
if($('#msform :input:visible').valid()) {
page++;
showPage(page);
}
}
pressed[e.which] = true;
});
$(document).keyup(function(e) {
pressed[e.which] = null;
});
You can use setTimeout() function like this
$(document).keydown(function(e) {
setTimeout(myFunction(),500);
});
function myFunction(){
if(e.which == 13) {
if($('#msform :input:visible').valid()){
page++;
showPage(page);
}}
}
::::::::::::::::::Update::::::::::::::::::
$(document).keydown(function(e) {
if(e.which == 13) {
setTimeout(myFunction(),500);
}
});
function myFunction(){
if($('#msform :input:visible').valid()){
page++;
showPage(page);
}
}
I would like to simulate the user pressing tab then enter when they press enter. I know this sounds bad, but I have an asp.net web application that will only allow me to have one form with runat="server" on it so when the user hits return the main form gets submitted. I have another textbox on the page though (that ideally should have it's own form but can't because it is asp), and when enter is hit from there obviously the main form is submitted. The simplest way I could think is to simulate tab then enter using javascript, but I have been unsuccessful in that. I am welcome to any other solutions to this problem. So far I have simulated pressing tab, but I don't know how to simulate more than one keypress though.
Here is the code I have so far, I imagine return 9; needs to be replaced with something else. JQuery will also do.
function suppressEnter (e) {
var keyPressed;
if (window.event) { keyPressed = window.event.keyCode } // IE
else if (e) { keyPressed = e.which }; // Netscape
if (keyPressed == 13) {
return 9;
}
else {
return true;
}
}
EDIT: return 9 + 13; works in chrome, but not IE
Something like this would work:
function keyPress(e) {
if (e.which == 13) {
$(document).trigger(jQuery.Event('keydown', {which: 9}));
// do something
alert('Enter')
}
if (e.which == 9) {
// do something
alert('Tab');
}
};
$(document).bind("keydown", keyPress);
I've coded it up in a fiddle - http://jsfiddle.net/FAe6U/
Also With regards to #nnnnnn comment:
It seems to me you should just code that directly rather than trying
to simulate keystrokes.
Try this:
var tabPress;
function keyPress(e) {
if (e.which == 13) {
if (tabPress == 1){
e.preventDefault();
alert('tab and enter');
}
else{e.preventDefault(); alert('enter')}
}
else if (e.which == 9) {
e.preventDefault();
tabPress = 1;
};
};
function keyRelease(){tabPress = 0;}
$(document).bind("keydown", keyPress);
$(document).bind("keyup", keyRelease);
I've coded it up in a fiddle - http://jsfiddle.net/f4Ybn/
I need to submit the content of a form when I press the Enter key, but only if the form has no error message. I built up the following function:
$(targetFormID).submit(function (e) {
var mess = error_m(targetDiv);
if (e.keyCode == 13 && mess.length > 0) {
e.preventDefault();
e.stopPropagation();
}
if (mess.length == 0 && e.keyCode == 13) $(targetFormID).submit();
});
In this function the mess variable is getting the error message returned by function error_m, the rest is simple code condtion but it doesn't work.
Need some help with this!!
Submitting the form when the Enter key is pressed is default browser behaviour. Don't mess with it. Just validate the form in the submit event.
$(targetFormID).submit(function (e) {
var mess = error_m(targetDiv);
if (mess.length > 0) {
e.preventDefault();
}
});
One other possible problem: what is targetFormID? If it's actually a string containing an element ID, you'll need
$("#" + targetFormID).submit(/* Same function as above */);
If it's a reference to the form element then $(targetFormID) is fine but your variable is misleadingly named.