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

Last Reply 10 months ago By pandeyism

Posted 10 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.

 

 

 

Posted 10 months ago Modified on 10 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