How to download file when user click

Question

I want to display first 10 characters afterword ... till .pdf or xlx or .docx match. Each result has link . when user click on perticular link it will redirect to matching file and file will be download. could anyone help me.

  function createRowMultiresult(jobjects) {

        var $div = $('<div class="chat Bot"></div>');
        var $div2 = $('<div class="user-photo"><img src="{% static "Robot.jpg" %}" /></div>');
        $div.append($div2);
        var $tbl = $('<table style="width:100%;"></table>');

        if (jobjects.length>1){
            var $tr = $('<tr><td style="padding:5px;">Multiple results Found for your query. Please search with specific keyword</td></tr>');
            $tbl.append($tr);
        }

        for(var x=0; x<jobjects.length;x++){

            var currentobj = jobjects[x];
            if (currentobj.ans != null){
                if (currentobj.ans.indexOf("/AA") != -1){
                    var $tr = $('<tr><td style="padding:5px;"><a href="https://' + currentobj.ans +'" target="_blank" >Click Here for User Guide</a></td></tr>');
                    $tbl.append($tr);
                }
                else{
                    var $tr = $('<tr><td style="padding:5px;">' +(x+1)+'.'+ currentobj.ans.replace(/[^\w\s]/gi, "<br/>") +'</td> </tr>');
                    $tbl.append($tr);
                    if (currentobj.Pic.length>7){
                        var $tr = $("<tr><td style='text-align:center;'><img class='productpic' src='{% static '/Pictures/' %}" + currentobj.Pic +"' /></td></tr>");
                        $tbl.append($tr);
                    }
                }
            }
            else if(currentobj.filename != null){
                    alert("Got there");
                    var $tr = $('<tr><td style="padding:5px;"><a href="https://' + currentobj.ans + '" target="_blank" >' + currentobj.filename.slice(0,10)+"...."+ +'</a></td> </tr>');
                    $tbl.append($tr);
            }
        }

        var $par = $('<p class="chat-message"></p>');
        $par.append($tbl);

        $div.append($par);
        $chatlog.append($div);

    }

Each result has link.

Sample actual result:

1. insert_data_data_data.pdf
2. BE_guage_data_data.xlsx
3. BE_guage_data_data.docx

Expected output and when user click it will download :

1. insert_data....pdf
2. BE_guage.....xlsx
3. BE_guage.....docx

Answer 1

You can simply count character length and replace '...' after some point.

var displayName = ( currentobj.ans.length > 10 ) > ( currentobj.ans.substring( 0, 10 ) + '...' ) : currentobj.ans;

Now you can use this displayName variable for display.

in .substring() function first parameter is the starting point, and the second one is the endpoint.

Answer 2

According to the samples and the expected outputs, the simplest way is by using the replace function i.e.

result_str.replace(/_data_data\./, '...')

Answer 3

You can use a regex with capture groups. $n is the nth group.

var regex = /(\w{10})\w+(\.\w+)/;
var str = "insert_data_data_data.pdf";

console.log(str.replace(regex, "$1...$2"));