sap.m.FeedInput height adjusted according to the text inside

[Former Member]

Hi,

According to SAP Fiori Guidelines website (https://experience.sap.com/fiori-design/ui-components/feedinput/ ) there is a feature that I need and I cannot replicate.

Basicaly, on Feed Input, when you hit enter several times the height of the input should increase and adjust in order to fit the whole text the user types. However, if I hit ENTER a couple of times the Feed Input brings me a scroll bar and keeps the default height (about 3 rows).

Does anybody knows how to solve this without changing to another type of object like TextArea, etc

Additional info: if you check the live samples from SAP you'll observe the same behaviour as well (scroll bar instead of adjusting the height) - SAPUI5 Explored

Thanks in advance,

Hugo Oliveira

[Former Member]

Hi Hugo,

FeedInput is internally using TextArea control and the default rows is set to 1. So directly if you hit enter it will bring you a scroll bar.

You can increase the default rows by extending the control. May be something like below :

var myFeed = sap.m.FeedInput.extend("MyFeedInput",{

    metadata:{

         properties:{

              rows:"string"

         }

    },

    renderer: {}

   });

   myFeed.prototype.setRows = function(sRows){

         this._getTextArea().setRows(parseInt(sRows));

    };

and use the extended control in your view:

myFeed= new MyFeedInput({

  showIcon: false,

  rows: "5",

  onPost: function(oEvent){

  }

});