Interact with a LinkButton using JavaScript on Internet Explorer 9

Question

Interact with a LinkButton using JavaScript on Internet Explorer 9

My Repeater contains multiple LinkButtons that perform a postback when manually clicked. However, my attempts to trigger the click event on a LinkButton using JavaScript have been unsuccessful. I have tried both OnClick and OnCommand without any luck.

LinkButtons:

<asp:Repeater ID="repItems" runat="server" OnItemDataBound="repItems_OnItemDataBound">
    <ItemTemplate>
        <asp:Panel ID="pnlItem" runat="server">                       
            <asp:LinkButton ID="lnkItem" runat="server" OnClick="lnkItem_OnClick" OnCommand="lnkItem_OnCommand"></asp:LinkButton>                  
        </asp:Panel>
    </ItemTemplate>        
</asp:Repeater>

Javascript:

eval(LinkButton.attr('href'); //Causes Sys.ParameterCountException
LinkButton.click();           //Nothing happens (no click event on LinkButton)
LinkButton.trigger('click');  //Same as LinkButton.click()

If I set OnClientClick to initiate the postback, the click() functions start working, but it triggers a Sys.ParameterCountException error:

lnkItem.OnClientClick = String.Format("__doPostBack('{0}', '');", lnkItem.UniqueID);

Some suggestions included changing ScriptManager to release mode, but it did not trigger the postback, only removed the error message.

The eval(LinkButton.attr('href'); function works in Google Chrome.

javascript asp.net internet-explorer

Answer 1

Answer №1

I'm uncertain about the issue you may be facing, but I have a solution that works for me.

ASCX:

<asp:Repeater ID="repItems" runat="server">
    <ItemTemplate>
        <asp:Panel ID="pnlItem" runat="server">                       
            <asp:LinkButton ID="lnkItem" runat="server" Text='<%# Eval("Text") %>' OnClick="lnkItem_OnClick" OnCommand="lnkItem_OnCommand"></asp:LinkButton>                  
        </asp:Panel>
    </ItemTemplate>        
</asp:Repeater>

<button onclick="document.getElementById('MainContent_repItems_lnkItem_0').click(); return false;">Huzzah!</button>

Codebehind:

    protected void Page_Load(object sender, EventArgs e)
    {
        List<Item> test = new List<Item>();
        test.Add(new Item { Text = "Item 1" } );
        test.Add(new Item { Text = "Item 2" } );
        repItems.DataSource = test;
        repItems.DataBind();
    }

    protected void lnkItem_OnClick(object sender, EventArgs e)
    {
        this.Controls.Add(new Literal() { Text = ((LinkButton)sender).Text });
    }

    protected void lnkItem_OnCommand(object sender, EventArgs e)
    {
        this.Controls.Add(new Literal() { Text = ((LinkButton)sender).Text });
    }

In this example, both OnClick and OnCommand events are triggered successfully.

Answer 2

I'm uncertain about the issue you may be facing, but I have a solution that works for me.

ASCX:

<asp:Repeater ID="repItems" runat="server">
    <ItemTemplate>
        <asp:Panel ID="pnlItem" runat="server">                       
            <asp:LinkButton ID="lnkItem" runat="server" Text='<%# Eval("Text") %>' OnClick="lnkItem_OnClick" OnCommand="lnkItem_OnCommand"></asp:LinkButton>                  
        </asp:Panel>
    </ItemTemplate>        
</asp:Repeater>

<button onclick="document.getElementById('MainContent_repItems_lnkItem_0').click(); return false;">Huzzah!</button>

Codebehind:

    protected void Page_Load(object sender, EventArgs e)
    {
        List<Item> test = new List<Item>();
        test.Add(new Item { Text = "Item 1" } );
        test.Add(new Item { Text = "Item 2" } );
        repItems.DataSource = test;
        repItems.DataBind();
    }

    protected void lnkItem_OnClick(object sender, EventArgs e)
    {
        this.Controls.Add(new Literal() { Text = ((LinkButton)sender).Text });
    }

    protected void lnkItem_OnCommand(object sender, EventArgs e)
    {
        this.Controls.Add(new Literal() { Text = ((LinkButton)sender).Text });
    }

In this example, both OnClick and OnCommand events are triggered successfully.

Interact with a LinkButton using JavaScript on Internet Explorer 9

Answer №1

Similar questions

What sets apart the method of assigning event handlers using bind() versus each() in jQuery?

Navigating a dynamic table by looping through its generated tr elements

Exposing the full binary in jQuery

Solving data within an Angular Controller

Generate a novel item by organizing the key of an array of objects

Is it possible to compare every element in an array with one another using an asynchronous process in NodeJS?

How to set the element in the render method in Backbone?

Guide to connecting two geometric shapes together with the help of three.js

What is the correct way to properly import a non-relative path in TypeScript?

Converting jQuery drag and drop functionality to Angular: A step-by-step guide

utilizing a spacemouse in conjunction with autodesk forge

Ways to inspect a number within a span and adjust its color depending on the value?

Angular 2 Encounter Error When Trying to Access Undefined Property in a Function

Ways to standardize the input email address?

Troubles with a Chrome Extension for JSON

Iterating through a C# list in JavaScript

I am facing an issue where my AngularJS code is not executing properly on JSF

Using Node.js to integrate Stripe payment method

Transform one column into several columns

Implement a new aggregate function for tooltips in the Kendo chart