Autogrow and shrink textarea (plain text)

Forums Dynamic Forms for SharePoint Autogrow and shrink textarea (plain text)

This topic contains 0 replies, has 1 voice, and was last updated by  Alexander Bautz 4 months, 1 week ago.

  • Author
    Posts
  • #19039

    Alexander Bautz
    Keymaster

    Here is an attempt to create a function to autosize a plain text multiline field when you type or paste text in it. Put this code in your Custom JS textarea in DFFS backend and change the “YourFieldNameHere” in the last line to match your field name:

    function autoGrow(elm){
        // Set the height initially to 75px to calculate the scrollheight for shrinking the field
        jQuery(elm).height(75);
        var scrollHeight = elm.scrollHeight, innerHeight = jQuery(elm).innerHeight();
        if(scrollHeight > innerHeight){
            jQuery(elm).height(scrollHeight+20);
            spjs.dffs.resizeDlg();
        }
    }
     
    function initAutosize(fin){
        var tr = jQuery("#dffs_"+fin), elm = tr.find("textarea");
        elm.on("keyup",function(){
            autoGrow(elm.get(0));
        }).on("paste",function(){
            setTimeout(function(){
                autoGrow(elm.get(0));
            },100);
        }).css("overflow","hidden");
        // On load
        setTimeout(function(){
            if(!tr.is(":visible")){
                tr.show();
                setTimeout(function(){
                    tr.hide();
                },0);
            }
            autoGrow(elm.get(0));
        },100);
    }
     
    initAutosize("YourFieldNameHere");

    Alexander

You must be logged in to reply to this topic.