CODEWITHSUNDEEP
javascriptjqueryhtml
Electronics For KTU
Electronics For KTU

Reputation: 41

Prevent page reload when blank link is clicked?

I have a web page to download files using a button.But for some cases the files does not exit and download links are blank...So whenever the user clicks the link page just reloads.It would have been great if i could somehow disable the page reload and display an alert that says file not yet available..

This is the download link button code.row["slink"] gives the download link and may become empty sometime.

'<a href="'+row["slink"]+'"><button type="button" class="btn btn-info " data-row-id="' + row.id + '">Download</buttn></a> ';

Upvotes: 1

Views: 1672

Answers (2)

Terrance00
Terrance00

Reputation: 1678

Simple Solution

You can set target to blank:

<a ... ... target="_blank" > ... </a>

This will open it in a new tab instead of refreshing.

More Sophisticated Approach:

You can also use a conditional to build your anchor tag.

if (row["slink"] == "")
{
    var atag = '<a href="javascript:void(0)" onclick="alert(&quot;No File Available&quot;)"><button type="button" class="btn btn-info " data-row-id="' + row.id + '">Download</button></a> ';
}

This will give an alert if there is no file.

Upvotes: 1

Abhi
Abhi

Reputation: 4261

Check if row['slink'] is present, else replace href with javascript:alert(...)(This won't do page reload for blank href, and show an alert):

var href = row["slink"].trim().length > 0 ? row["slink"] : "javascript:alert('File Not Yet Available')"


'<a href="'+href+'"><button type="button" class="btn btn-info " data-row-id="' + row.id + '">Download</buttn></a> ';

Upvotes: 3

Related Questions