javascript to asp.net communication

Question

Hi

I have a website that uses master pages. On the master page I have a sidebar div containing an Ajax accordion control that provides site navigation. When the user clicks a link from the accordion, I pass the index of the pane on the query string. Each webform inherits from a single base class. In the Page_Load event of the base class I check the query string for the active pane index and then set the Accordion.SelectedIndex property. This prevents the accordion control from resetting to pane 0 each time the user navigated to a different page.

The above works fine when navigating directly from the Accordion control. My problem is that it's also possible for the user to Navigate from a webform - they can click the 'Edit' hyperlink of a GridView which takes them to a page containing a DetailsView of the selected record. In this case I need to determine the index of "current" accordion pane so that I can set this on the page load event of the webform containing the details view.

I am able to trap the event of the accordion being selected with the following javascript:

function pageLoad() {
        var accordion = $find('<%= Accordion1.ClientID %>' + '_AccordionExtender');
        accordion.add_selectedIndexChanged(onACESelectedIndexChanged);
    }
    function onACESelectedIndexChanged(sender, eventArgs) {
        //alert(sender.get_SelectedIndex());
}

I need to store the "SelectedIndex" somewhere so that it can be read by the page_load event of the webform containing the details view.

Do I need to use cookies for this?

Thanks

Rob.

Answer 1

Hey,

Cookies is one, but you can use a HiddenField server-side control to store the value in the hidden element in client-side JavaScript, then access that hiddenfield on the server. That's the easiest way, and works with both options. You have to use the server-side control version so that you have access to the control on the server, otherwise, you have to use the Request.Form collection.

HTH.

Answer 2

I ended up using cookies and this works fine.

I did play around with the hidden fields but found this problematic as I couldn't always be sure which of the child webforms was loaded.

I have pasted the snippets of code I added to the page_load event of the base class I use for the child webforms, and the javascript for the click of the accordion control. This may be helpful to someone that had the same problem as me.

javascript

function pageLoad() {
        var accordion = $find('<%= Accordion1.ClientID %>' + '_AccordionExtender');
        accordion.add_selectedIndexChanged(onACESelectedIndexChanged);
    }
    function onACESelectedIndexChanged(sender, eventArgs) {

        createCookie('acPane', sender.get_SelectedIndex(), 0)

    }
    function createCookie(name, value, days) {
        if (days) {
            var date = new Date();
            date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
            var expires = "; expires=" + date.toGMTString();
        }
        else var expires = "";
        document.cookie = name + "=" + value + expires + "; path=/";
    }

and now the c#

int acPane = 0;
        if (Request.Cookies["acPane"] != null)
        {
            HttpCookie ckAcPane = Request.Cookies["acPane"];
            acPane = Convert.ToInt16(ckAcPane.Value);
        }

        if (acPane >= 0)
        {
            AjaxControlToolkit.Accordion ac;
            ac = (AjaxControlToolkit.Accordion)Master.FindControl("Accordion1");
            ac.SelectedIndex = acPane;
        }