# Chat input bar with Ionic **URL:** \ **Category:** ionic-v1\ **Created:** [April 17, 2015, 10:06am UTC](https://forum.ionicframework.com/t/chat-input-bar-with-ionic/21167 "2015-04-17T10:06:54Z")\ **Posts on this page:** 9\ **Page:** 1
**Author:** ![xavierheysch](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/xavierheysch/32/92184_2.png) [@xavierheysch](https://forum.ionicframework.com/u/xavierheysch)\ **Post date:** [April 17, 2015, 10:06am UTC](https://forum.ionicframework.com/t/chat-input-bar-with-ionic/21167/1 "2015-04-17T10:06:56Z")
Hi everyone, I’m trying to make a chat view in Ionic (v1.0.0-rc.2) but I have issues regarding the input chat bar. I’m using a ion-footer-bar with keyboard-attach directive. This footer contains a textarea and a sending button. I have tried many things but the result is not smooth / not native at all. As you can see in the following issue I have submited ([https://github.com/driftyco/ionic/issues/3537](https://github.com/driftyco/ionic/issues/3537)), there is an animation problem but here is another issue. When I click on the textarea, the keyboard is opening correctly. Then I enter some characters in it and when I click on the “send” button, the keyboard is disappearing. As WhatsApp, Line, iMessages, etc., I want the keyboard to stay open and prevent it to be closed automatically. If anybody have found a solution regarding that, I’m looking for help! 😉 ---
**Author:** ![mhartington](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/mhartington/32/137757_2.png) [@mhartington](https://forum.ionicframework.com/u/mhartington)\ **Post date:** [April 17, 2015, 1:13pm UTC](https://forum.ionicframework.com/t/chat-input-bar-with-ionic/21167/2 "2015-04-17T13:13:12Z")
So this can be done using a form element. > ---
**Author:** ![xavierheysch](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/xavierheysch/32/92184_2.png) [@xavierheysch](https://forum.ionicframework.com/u/xavierheysch)\ **Post date:** [April 17, 2015, 1:32pm UTC](https://forum.ionicframework.com/t/chat-input-bar-with-ionic/21167/3 "2015-04-17T13:32:43Z")
I want to post the message with a send button like all messaging app. The using of the “return” button of keyboard to submit the form is not wanted here. This “return” button is used to make a jump line. Is there a way with the current version of Ionic ? ---
**Author:** ![AndySoHotRightNow](https://avatars.discourse-cdn.com/v4/letter/a/7feea3/32.png) [@AndySoHotRightNow](https://forum.ionicframework.com/u/AndySoHotRightNow)\ **Post date:** [October 8, 2015, 10:09am UTC](https://forum.ionicframework.com/t/chat-input-bar-with-ionic/21167/4 "2015-10-08T10:09:39Z")
Xavier made a good observation about the keyboard animation. It is not smooth or native at all. Both the ‘keyboard-attach’ directive and the ‘ion-footer-bar’ work well together in static positions. However during keyboard animations, it looks as though the keyboard and the input field travel at two different speeds (keyboard springs up slower than the input field, revealing empty background on the way up, and disappears equally slower than the input field on the way back, partially covering it while disappearing/losing focus). I am also trying to make a Chat app and would be incredibly eager to know if anybody has found a work-around (CSS? Angular? jQuery?). EDIT: to answer Xavier’s question on how to get the keyboard to stay open after pressing the ‘send’ button, I made this directive: ``` .directive("isFocused", function($timeout) { return { link: function(scope, element) { scope.$watch("isFocused", function (value) { $timeout(function () { if (scope.isFocused) { element[0].focus(); } element.on("blur", function () { if (scope.isFocused) { element[0].focus(); } }); }); }); } }; }); ``` and in my controller I have: ``` $scope.isFocused = true; $scope.contentClick = function () { // triggered by an ngClick placed in $scope.isFocused = false; } $scope.inputClick = function () { // triggered by an ngClick placed in the