shorten display name?

[Steven]

After selecting a file for upload, is it possible to shorten the displayed filename?

So if a user selects veryveryverylongfilename.pdf, can I display

veryveryverylong...  [x remove]

but still save it as veryveryverylongfilename.pdf. I have a limited space where I have placed the control and if the filename is too long my formatting gets thrown off.



thnx

[Bozhidar]

Hello Steven,

Try the following:

<telerik:RadAsyncUpload

    OnClientFileUploaded="fileSelected" 

    ID="RadAsyncUpload1" runat="server">

</telerik:RadAsyncUpload>



<script type="text/javascript">

 

    function fileSelected(sender, args) {

        var $span = $telerik.$(".ruUploadProgress", args.get_row());

        var text = $span.text();

        if (text.length>15) {

            var newString = text.substring(0, 15) + '...';

            $span.text(newString);

        }

    }

 

</script>

 
All the best,
Bozhidar
the Telerik team

[Steven]

perfect,t hanks

[Max]

Hello again,

The solution is not perfect because upload progress disappears, as it is as well contained in that newly rewritten span.

So I modified it to its true perfection :)

function FileSelected(sender, args) {
    var spanTag = document.createElement("span");
    spanTag.className = "ruFileProgressWrap";
    var spanTagInner = document.createElement("span");
    spanTagInner.className = "ruFileProgress ruProgressStarted";
    spanTag.appendChild(spanTagInner);

    var $span = window.$telerik.$(".ruUploadProgress", args.get_row());
    var text = $span.text();
    if (text.length > 15) {
        var newString = text.substring(0, 15) + '...';
        $span.text(newString);
        $span.append(spanTag);
    }
}

Cheers.

[Peter]

And even further tweaked Max's solution to add a tooltip (title) for shortened files (hover over filename and full name is displayed).

function FileSelected(sender, args) {

    var spanTag = document.createElement("span");

    spanTag.className = "ruFileProgressWrap";

    var spanTagInner = document.createElement("span");

    spanTagInner.className = "ruFileProgress ruProgressStarted";

    spanTag.appendChild(spanTagInner);

     

    var $span = window.$telerik.$(".ruUploadProgress", args.get_row());

    var text = $span.text();

    if (text.length > 15) {

        var newString = text.substring(0, 15) + '...';

        $span.text(newString);
   $span.attr("title" ,text);


        $span.append(spanTag);

    }

}