Pass data from one page to another page on HTML Anchor Link click in JavaScript

Last Reply 8 months ago By pandeyism

Posted 8 months ago

Pass value when click in "a href"  link without showing data in URL using Asp.net C# JS.

There is a question and solution where use "a href"

https://www.aspforums.net/Threads/142386/Show-only-the-first-and-last-four-digit-of-a-number-using-JavaScript/

 

Here value 1111234567123456 is showing in url, I want to pass value without showing in URL.

Thanks for your help.

 

 

 

You are viewing reply posted by: pandeyism 8 months ago.
Posted 8 months ago Modified on 8 months ago

Hi Alauddin,

Please refer below article.

Send (Pass) Data (Values) from one page to another using jQuery

In below sample, I have used sessionStorage properties.

The sessionStorage properties allow to save key/value pairs in a web browser. The sessionStorage object stores data for only one session (the data is deleted when the browser tab is closed).

HTML

CS.aspx

<div>
    <asp:Label ID="lblTable" runat="server"></asp:Label>
</div>
<script type="text/javascript">
    window.onload = function () {
        var table = document.getElementsByTagName("table");
        var trs = table[0].getElementsByTagName('tr');
        for (var i = 0; i < trs.length; i++) {
            var tds = trs[i].getElementsByTagName('td');
            var cardno = tds[1].innerText;
            if (cardno.length > 5) {
                var firstFour = cardno.substr(0, 4);
                var lastFour = cardno.substr(cardno.length - 4, cardno.length);
                var middle = cardno.substr(4, cardno.length - 8).replace(/[0-9]/g, "*");
                var newLink = document.createElement("a");
                newLink.setAttribute("href", "Default.aspx");
                newLink.setAttribute("onclick", 'return check("' + cardno + '")');
                text = document.createTextNode(firstFour + middle + lastFour);
                newLink.appendChild(text);
                tds[1].appendChild(newLink);
            }
        }
    }
    function check(cardno) {
        sessionStorage.setItem("cardNumber", cardno);
    }         
</script>

 Default.aspx

<div>
    <asp:Button Text="Get Card Number" runat="server" OnClientClick="return GetCard()" />
    <asp:Label ID="lblCardNumber" runat="server" />
</div>
<script type="text/javascript">
    function GetCard() {
        var card = sessionStorage.getItem("cardNumber");
        document.getElementById('lblCardNumber').innerHTML = card;
        return false;
    }
</script>

Code

CS.aspx.cs

protected void Page_Load(object sender, EventArgs e)
{
    if (!this.IsPostBack)
    {
        System.Text.StringBuilder sb = new System.Text.StringBuilder();
        sb.Append("<table id='01717458720_CardList'>");
        sb.Append("<tr>");
        sb.Append("<td id='product_type'>CREDIT CARD</td>");
        sb.Append("<td id='card_no' abbr='*'>1111234567123456</td>");
        sb.Append("<td id='card_status'>INACTIVE</td>");
        sb.Append("<td id='acct_no'>N/A</td>");
        sb.Append("<td id='name'>Mr. X</td>");
        sb.Append("</tr><tr>");
        sb.Append("<td id='product_type'>DEBIT CARD</td>");
        sb.Append("<td id='card_no'>0000000000000000</td>");
        sb.Append("<td id='card_status'>ACTIVE</td>");
        sb.Append("<td id='acct_no'>55555555555</td>");
        sb.Append("<td id='name'>Mrs. Y</td>");
        sb.Append("</tr></table>");
        lblTable.Text = sb.ToString();
    }
}

Screenshot