I want to send message using enter key and new line using shift+enter key for my chat system

Question

 <?php
 session_start();
 if(!isset($_SESSION['user_id']) && empty($_SESSION['user_id'])){
    header("Location:login.php");
 }
 include 'connect.php';
 include 'functions.php';
 $my_id = $_SESSION['user_id'];
 $hash = $_GET['hash'];
 if(isset($_POST['message']) && !empty($_POST['message'])){
 $new_message = $_POST['message'];
 mysql_query("INSERT INTO `messages`       VALUES('','$hash','$my_id','$new_message')");
 header('Location: startcon.php?hash='.$hash);
 }
 ?>
 <link rel='stylesheet' href='css.css' />
 <header>
 <div id="logo"><img src="logo.jpg" height="35px" width="35px"></div>
 <div id="options"><a href='profile.php'>Profile</a>&nbsp &nbsp <a      href="conversation.php">Messenger</a> &nbsp &nbsp <a href="friends.php">Friends</a> &nbsp &nbsp <a href="requests.php">Friend     Requests</a> &nbsp &nbsp <a href='find.php'>Find Friends</a> &nbsp &nbsp <a     href='logout.php'>Logout</a> &nbsp </div>
 </header>
 <div id='outerconversation'>
 <div id="conversationheader"><a href='conversation.php' title='back'><img     src='back.png' height='20px' width='18px' /></a></div>
 <div id="innerconversations">
 <?php
 $message_query = mysql_query("SELECT from_id, message FROM `messages` WHERE      `group_hash`='$hash'");
 while($run_message = mysql_fetch_array($message_query)){
 $from_id = $run_message['from_id'];
 $message = $run_message['message'];
 $user_query = mysql_query("SELECT `email`,`username` FROM `users` WHERE      id='$from_id'");
 $run_user = mysql_fetch_array($user_query);
 $from_email = $run_user['email'];
 $from_username = $run_user['username'];
 echo "<hr color='#008298' /><span style='color: #008298; font-family:      Arial; margin-left: 10px;'>$from_username <span style='color: #BAB9B9; font-     style: italic;'>$from_email</span></span><br/><br/>";
 echo "<span style='color: #008298; font-family: Segoe UI Light; margin-     left: 30px;'><span style='color: #BAB9B9; font-family: Arial; margin-left:      10px;'>says: </span>$message</span><br/><br/>";
}
?>
 </div>
 <form method='POST'>
 <?php
 ?>
 <textarea name='message' placeholder="Type Message..." maxlength="400"      rows='6' cols='145'></textarea>
 <input type='submit' value="Send Message" />
 </form>
 </div>

I am making a chat system. I want to send message using ENTER key instead of input submit button and New line using Shift+Enter. I don't have strong knowledge of javascript and jquery. Please make a function that sends message using enter key and make new line using shift+enter key.

http://stackoverflow.com/questions/6014702/how-do-i-detect-shiftenter-and-generate-a-new-line-in-textarea?rq=1 — Chris, Aug 29 '15 at 13:58

Blaž Zupančič · Accepted Answer · 2015-08-29T20:42:38.857

3

<form id="chat_form" method='POST'>
    <textarea name='message' placeholder="Type Message..." maxlength="400" rows='6' cols='145' autofocus></textarea>
    <input type='submit' value="Send Message" />
</form>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript">

var shiftDown = false;
var chatForm = $("#chat_form");
var messageBox = chatForm.children("textarea");

$(document).keypress(function (e) {
    if(e.keyCode == 13) {
        if(messageBox.is(":focus") && !shiftDown) {
            e.preventDefault(); // prevent another \n from being entered
            chatForm.submit();
        }
    }
});

$(document).keydown(function (e) {
    if(e.keyCode == 16) shiftDown = true;
});

$(document).keyup(function (e) {
    if(e.keyCode == 16) shiftDown = false;
});
</script>

edited Aug 29 '15 at 20:42

answered Aug 29 '15 at 14:23

Blaž Zupančič

2,176
2
13
22

But bro i found a problem. It cant send empty message and its good but when i creat new line using shift+enter key and has no text it sends empty message. It sends message when i add a new line. What should i do now ? – Aug 29 '15 at 14:46
I don't see why it should be doing that. I've tried it on chrome and it works perfectly. Maybe it's confusing you because the form loses focus upon sending a message. Try adding autofocus at the end of the textarea tag. – Blaž Zupančič Aug 29 '15 at 15:01
brother thank you problem solved. Please do one more thing for me i want my scroll always to down position so that when the user wan'ts to send message the scroll bar auto goes always into the bottom position. Please can you ? – Aug 29 '15 at 15:10

I want to send message using enter key and new line using shift+enter key for my chat system

1 Answers1