How can i make an input position fixed buttom like WhatsApp Chat interface

Hello guys,
I’m developping a chat app, in chat view i have an input where the user enter his message and a button to send and a ul tag to append messages sent or recieved, when the input gets the focus ionic pops it up to show the keyboard and push all messages up, what i really want is when the input lose focus, the input goes back to position fixed buttom and make ul tag only scrollable ?

<ion-content class="has-header">
        <ul class="chats">

    <div class="chat-form">
        <div class="input-cont">
            <textarea id="message-input"  class="form-control"  cols="30" rows="2"></textarea>
        <div class="btn-cont" ng-click="sendMessage(messageBody)">
            <span class="arrow"></span>
            <a href="" class="btn blue icn-only">
                <i style="font-size: 20px;" class="ion-paper-airplane"></i>

Maybe you can use the ionic footer ?

When i put the textarea in ionic footer if it gets the focus it doesn’t get pushed up to show up the keyboard !!!

1 Like

Check out keyboard-attach

You need to see this chat template! :smiley:

is there something similar for Ionic 2/3?