Calling event click with JavaScript

Question

It is possible to call a event click with JavaScript? how?

I'm trying to call this event when a button get clicked.

I'm creating Buttons dynamically so the id's change constantly

Here is how i make the buttons dynamically and assign the event click

protected void Page_Init(object sender, EventArgs e)
        {
            ScriptManager.RegisterStartupScript(this, this.GetType(), "Pop", "showAndHide();", true);

            Button Btn_clic = (Button)sender;
            var name = Btn_clic.Text;

            List.ListUsers listArea = new List.ListUsers();
            List<Data.Area> Area = listArea.AreaList();

            List<Data.Area> ListOfEquiposOk = Area.Where(x => x.AREA == name && x.STANDBY == 0).ToList();

            List<Button> Botones = new List<Button>();

            var TeamFCH = ListOfEquiposOk.Select(x => x.TEAM).Distinct().ToList();

            foreach (var team in TeamFCH)
            {
                Button newButton = new Button();
                newButton.CommandName = "Btn" + Convert.ToString(team);
                newButton.ID = "Btn_" + Convert.ToString(team);
                newButton.Text = team;
                newButton.CommandArgument = name;

                newButton.Click += new System.EventHandler(newButton_Click);


                Botones.Add(newButton);

                GoodPanel.Controls.Add(newButton);
                newButton.CssClass = "btn-primary outline separate";
            }
        }

protected void newButton_Click(object sender, EventArgs e)
        {
            ScriptManager.RegisterStartupScript(this, this.GetType(), "Pop", "ModalGood();", true);

            Button Btnclick = (Button)sender;
            var team = Btnclick.Text;
            string name = Btnclick.CommandArgument;

            List.ListUsers listArea = new List.ListUsers();
            List<Data.Area> Area = listArea.AreaList();

            List<Data.Area> ListOfToolsOk = Area.Where(x => x.AREA == name && x.TEAM == team && x.STANDBY == 0).ToList();

            var ToolArea = ListOfToolsOk.Select(x => x.TEAM);
            Grv_Eng.DataSource = ListOfToolsOk;
            Grv_Eng.DataBind();
        }

Then why not add it to the button? <asp:Button ID="Button1" runat="server" Text="Button" OnClick="newButton_Click" />. If you have done that @Aenadon's answer should work. — VDWWD
– VDWWD, Commented Jul 4, 2017 at 20:07

VDWWD · Accepted Answer · 2017-07-04 20:15:36Z

1

If you want to assign a OnClick event, do it like this.

Button Btnclick = new Button();
Btnclick.Click += newButton_Click;
Btnclick.Text = "MyButton";
Btnclick.ID = "MyButtonID";

PlaceHolder1.Controls.Add(Btnclick);

And if you want to reference the dynamic ID, use FindControl and ClientID on the aspx page.

document.getElementById("<%= PlaceHolder1.FindControl("MyButtonID").ClientID %>").click

edited Jul 4, 2017 at 20:15

answered Jul 4, 2017 at 20:11

VDWWD

35.7k23 gold badges67 silver badges87 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

cesg.dav Over a year ago

i have like this but my event doesn't fire, i don't know why you can look at here stackoverflow.com/questions/44905518/…

VDWWD Over a year ago

Probably because you need to assign the click on EVERY page load, and that includes a PostBack. So if you assign the Click in another Button event, then you must make sure you execute it again at next page load.

cesg.dav Over a year ago

so in the page_load i need to put the event like Event(sender, e)?

VDWWD Over a year ago

I tested your snippet. It works. Just put it in Page_load. And start by getting one button to work and work from there. And don't store buttons in a List, that makes no sense. Also if you want to use CommandArgument, you need to assign a Command, not a Click

cesg.dav Over a year ago

what did you recommend instead the list of buttons? i use because in my XML there are many "TEAMS" so these is why the list

|

techfly · Accepted Answer · 2017-07-04 20:05:42Z

0

Assign an onClick listener to your button.

document.getElementById("your-id").click = function () {
    newButton_Click();
}

answered Jul 4, 2017 at 20:05

techfly

1,8663 gold badges26 silver badges36 bronze badges

4 Comments

cesg.dav Over a year ago

I'm creating the buttons dynamically, so the id change constantly

Daniel Möller Over a year ago

Add when creating the button.

Paul Over a year ago

or use document.getElementsByClassName() / .getElementsByTagName()

cesg.dav Over a year ago

@Daniel i add when i create the buttons

Aniket · Accepted Answer · 2017-07-04 20:12:54Z

0

Here you go try this for dynamically created buttons

$(document).on('click', '#id', function(){});

answered Jul 4, 2017 at 20:12

Aniket

10310 bronze badges

1 Comment

Aniket Over a year ago

if your id's change everytime assign a class to them and just replace #id with .className

hardkoded · Accepted Answer · 2017-07-04 20:48:04Z

0

You can use a data- attribute to id the buttons from javascript and then you just attach to the javascript event:

So, from the server side you can do this:

 newButton.Attributes["data-dynamic-button"] = team;

And you can implement this on the client side:

$("[data-dynamic-button]").click(function (event) {
    event.preventDefault()
    alert($(event.currentTarget).data("dynamic-button"));
});

answered Jul 4, 2017 at 20:48

hardkoded

22k3 gold badges64 silver badges77 bronze badges

Collectives™ on Stack Overflow

Calling event click with JavaScript

4 Answers 4

7 Comments

4 Comments

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

7 Comments

4 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related