Setting OnClick on button in html table dynamically

Question

I'm creating a table dynamically, each row will contain a button and this button is going to call a function, each button will handle different parameters, for example,

    string Parameter1 = "MyValue";
    string Parameter2 = "MyOthervalue";

    HtmlInputButton input = new HtmlInputButton();
    input.ID = "Button1";
    input.Value = "button";
    input.Attributes.Add("onclick", "MyFunction(" + Parameter1 + "," + Parameter2 + ");");

    td = new HtmlTableCell();
    td.Align = "center";
    td.Controls.Add(input);
    tr.Cells.Add(td);

When user clicks the button I need to run MyFunction and then refresh the page to see the changes.

I know that maybe I could open a second page and send the parameters in the URL, but I'd like to use the code in the same page and then reload the page.

What's the best approach.

Thanks,

EDIT.

I was able to solve it in the following way:

    input = new Button();
    input.Text = "Click Me";
    input.CommandArgument = "3|Parameter3";
    input.Command += new CommandEventHandler(Button_Handler);

    td = new HtmlTableCell();
    td.Align = "center";
    td.Controls.Add(input);

    tr.Cells.Add(td);
    tbTable.Rows.Add(tr);



public void Button_Handler(object sender, CommandEventArgs e)
{
    Button mybutton = (Button)sender;
    string[] Parameters = e.CommandArgument.ToString().Split('|');
    mybutton.Text = Parameters[0] + "-" + Parameters[1];
    //Call MyFunction(Parameters[0], Parameters[1]);

}

You want to postback in MyFunction on client side?

phnkha
– phnkha

2013-01-11 07:38:00 +00:00
Commented Jan 11, 2013 at 7:38 — phnkha
– phnkha, Commented Jan 11, 2013 at 7:38

phnkha · Accepted Answer · 2013-01-11 07:42:41Z

1

I have a trick that you can use a hidden button and hidden field:

HTML:

<script type="text/javascript">
    function MyFunction() {
        // do something
        document.getElementById("<%= hid.ClientID %>").value = "some value";

        // trigger hidden button click
        document.getElementById("<%= hiddenButton.ClientID %>").click();
    }
</script>

<asp:HiddenField ID="hid" runat="server" />
<asp:Button ID="hiddenButton" runat="server" OnClick="hiddenButton_Click" style="display:none" />

Code behind:

protected void hiddenButton_Click(object sender, EventArgs e)
{
     // your business goes here
     string value = hid.Value;
}

answered Jan 11, 2013 at 7:42

phnkha

7,9102 gold badges26 silver badges31 bronze badges

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

1 Comment

m0dest0 Over a year ago

Please notice that "some value" on MyFunction implementation should be a parameter because the page is going to handle multiple records (probably hundreds) and each row in the table will contain a button so the idea is that MyFunction receives the value, different for each button, and process.

OJ Raqueño · Accepted Answer · 2013-01-11 07:45:05Z

1

If MyFunction is a javascript function, you can add location.reload() at the end of it in order to reload the page.

answered Jan 11, 2013 at 7:45

OJ Raqueño

4,5912 gold badges20 silver badges31 bronze badges

Comments

eMi · Accepted Answer · 2013-01-11 07:55:16Z

Here I made some example code on how to add the clickevents dynamically:

  void Page_Load(Object sender, EventArgs e)
  {
    HtmlInputButton NewButtonControl = new HtmlInputButton("submit");
    NewButtonControl.ID = "NewButtonControl";
    NewButtonControl.Value = "Click Me";

    // Create an EventHandler delegate for the method you want to handle the event
    // and then add it to the list of methods called when the event is raised.
    NewButtonControl.ServerClick += new System.EventHandler(this.Button_Click);

    // Add the new HtmlInputButton control to the Controls collection of the
    // PlaceHolder control. 
    ControlContainer.Controls.Add(NewButtonControl);
  }

  void Button_Click(Object sender, EventArgs e)
  {
    // Display a simple message. 
    Message.InnerHtml = "Thank you for clicking the button.";
  }

To refresh the page u could call a Javascript Function, something like that:

<script type="text/javascript">
  function reloadPage()
  {
    window.location.reload()
  }
</script>

or try this:

Response.Redirect(Request.Url.AbsoluteUri);

I hope it helps

Collectives™ on Stack Overflow

Setting OnClick on button in html table dynamically

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related