Hello...new to the forum, so I hope that I"m posting in the right area. I have successfully *modified* created a shoutbox that works with Social Engine Websites. I have been looking for two days and have searched and implemented 100's of codes to try and figure out how I can just use the enter key to submit the message that others type in the shoutbox. I use jQuery, Ajax, Mysql, and PHP, but can't figure it out for the likes of me. I would really, really, really, appreciate the ability to get this fixed. Below is my code for my index.tpl, and my send_message.js. If you need anything else, please just let me know.
Everything works. When you type your comment/message and press the send, then it sends it to the php file and to the database and then it recalls the database files and shows it in the shoutbox. Just can't get the enter key working. I'm sure it's something so simple that I"m going to hit myself over, but can't figure it out
Please, any help would be appreciated. I think there's a conflict with the Ajax or something. I'm not sure. If I were, I wouldn't be here. LOL! Thank you all.
Last edited by XCalibre; 02-29-2012 at 08:48 PM..
Reason: more descriptive
Changes:
1. gave your form an ID
2. binded your desired function to the submit event of the newmessage form ( this way it will fire when user enters or clicks on a submit button)
3. fixed your check for an empty string ( best to check the length of the val)
4. used .serialize() to properly format your form values without writing them in manually ( had to change this line slightly jsut realised the username input isnt even in a form at all)
5. altered your success function to reset the newmessagecontent value since you had already declared it as a variable
changes are in red
Code:
$(function() {
$('#newMessage').submit(function() {
var username = $("#username").val();
var message = $("#newMessageContent").val();
if (message.length > 0 || message == "Enter your message here") {
return false;
}
var dataString = $("#username,#newMessageContent").serialize();
$.ajax({
type: "POST",
url: "/application/widgets/shoutbox/send_message.php",
data: dataString,
success: function() {
message=""
}
});
});
});
oh and for future reference, please read the posting guidlines.
you need to use a more descriptive subject line than " code doesnt work or help pls! or im a n00b fix my code!" as many people here won't even read the post
Okay....implemented the changes and on submit, nothing happens, and when entering, nothing happens. This is what I"ve been getting every time I try to change the coding. Thank you for replying so fast. It's being a nightmare
oh and for future reference, please read the posting guidlines.
you need to use a more descriptive subject line than " code doesnt work or help pls! or im a n00b fix my code!" as many people here won't even read the post
It apparently stopped calling the ajax in the send_message.js file. It refreshes the entire page instead of just the shoutbox, and it doesn't post the messages in the shoutobox.
I believe the index.tpl is calling the ajax from the id: newMessageSend......not the form...so there has to be a conflict with it somewhere. I think it's calling the newMessageSend "First" and therefore bypassing the Form id: newmessage......
I've taken bits and pieces from 100 different scripts to try and get this to work, so it may just have to be re written a bit in order to what I want to do, but I can't figure it out. I've went through 100's of scripts to try and implement this "enter" function.
I don't have a great knowledge of php, but I"m learning. Thank you for looking at this.
ok I went a different route. this worked when I tried it on the test account. I used the firebug console to unbind your current functions then tried mine and it worked.
save a backup of what you have in the sendmessage .js now and replace it with this
*** you do not need to change your html.
Code:
$(function() {
$('form.newMessage').submit(function(e) {
e.preventDefault();
var username = $("#username").val();
var message = $("#newMessageContent").val();
if (message.length > 0 || message == "Enter your message here") {
return false;
}
var dataString = $("#username,#newMessageContent").serialize();
$.ajax({
type: "POST",
url: "/application/widgets/shoutbox/send_message.php",
data: dataString,
success: function() {
message="";
}
});
});
//this function below watches for "enter" in the keyup action, jsut inside of the newmessage textarea
$("#newMessageContent").keyup(function(e){
var key;
if(window.event){
key = window.event.keyCode;
}
else{
key = e.which; //firefox
}
if (key === 13 ) {
if (e.shiftKey === false){
$("#newMessageSend").click();
}
}
});
});
oh also, in the textarea, it should submit only if enter it pressed and not shift+enter, that way users can still get a new line if they want. you might want to throw a hint(removable perhaps?) on the UI somewhere
Before you post, read our: 
I'm a noob...Code Not Working on Enter
It's being a nightmare 
