Add javascript event to input checkbox to execute in codebehind asp.net,

Question

I have a html control in aspx page.

  <input type="checkbox" name="Booking" id="chkBooking" class="css-checkbox" runat="server" /><label for="chkBooking" class="css-label">Booking</label>

I would like to add a javascript event when checkbox is clicked, and that event to be executed in codebehind, like this example here I found on the web:

TextBox1.Attributes.Add("onkeyup", displayControlName + 
    ".innerText=this.value.length;");

How can I call that event also in the code behind?

Still not clear, what should be the expected outcome when the user checks/un-checks the ``checkbox``? — Sarbbottam, Jul 22 '14 at 19:07
When the user clicks the html checkbox i want a method to be executed in the code behind of the aspx page. — user3816931, Jul 22 '14 at 19:09
i put that so i can see the control in code behind in aspx page. — user3816931, Jul 22 '14 at 19:31
Many solutions already there - http://stackoverflow.com/questions/18441194/how-to-call-a-c-sharp-function-from-javascript -- http://stackoverflow.com/questions/5828803/how-to-call-code-behind-server-method-from-a-client-side-javascript-function — Md Ashaduzzaman, Jul 22 '14 at 19:42

Martin Smellworse · Answer 1 · 2014-07-22T19:59:53.587

1

Don't really understand this question. You can set AutoPostback="true" on an asp.net Checkbox and set its onCheckedChanged event.

<asp:CheckBox id="cb" OnCheckedChanged="cb_CheckedChanged" AutoPostBack="true" runat="server">

and, in the code behind

protected void cb_CheckedChanged(object sender, EventArgs e)
{
//do whatever you want
}

alertnatively, you can wire up a javascript event to click a button if you want - but why do that when it already has the ability to do a postback?

<input type="checkbox" onclick="submitit()">
<asp:Button ID="btn" runat="server" OnClick="btn_Click" Height="0" Width="0" CssClass="hidden" />

<script type="text/javascript">
function submitit()
{
document.getElementById('btn').click();
}

Then, when the checkbox is clicked, the javascript function clicks the button, the page postbacks and btn_Click runs.

protected void btn_Click(object sender, EventArgs e)
{
//do whatever you want
}

edited Jul 22 '14 at 19:59

answered Jul 22 '14 at 19:43

Martin Smellworse

1,702
3
28
46

1

yes, but i want to use a html control because in the html control ican apply css, not in the asp checkbox – user3816931 Jul 22 '14 at 19:44
@user3816931, you can apply css in asp controls too. Try using "CssClass" attribute. – Md Ashaduzzaman Jul 22 '14 at 19:45
its not working , is there a way to just trigger a codebehind event for the html input checkbox? – user3816931 Jul 22 '14 at 19:47
You can definitely apply CSS attributes to an asp checkbox as said above using the CssClass attribute. If it is a html checkbox why don't you run a javascript function to submit a hidden button? I am editing my answer above. – Martin Smellworse Jul 22 '14 at 19:55

score 0 · Answer 2 · answered Jul 22 '14 at 19:16

0

You can add javascript on checked event

if(chkBooking.Checked)
{
    String scriptText = String.Empty;
    scriptText += "function ShowAlert(){";
    scriptText += "  alert( " + 
        " document.forms[0].TextBox1.value";
    scriptText += ")}";

    ClientScript.RegisterClientScriptBlock(this.GetType(), 
       "CounterScript", scriptText, true);
 }

Hope this helps.

answered Jul 22 '14 at 19:16

Deepak

66
1

i just want a codebehind asp.net event method to be called when the input checbox is clicked. – user3816931 Jul 22 '14 at 19:20
@user3816931 : then why you tag this question in js – Amit Kumar Jul 22 '14 at 19:26

score 0 · Answer 3 · edited May 23 '17 at 12:07

0

Create an asp:HiddenField (in this case ID is hiddenField) and fetch the checkbox value using the jQuery code below:

It works for me. you can view more from this question [question]Get checkbox value in jQuery

$('#chkBooking').click(function (e) {
    e.preventDefault();            
        $('#hiddenField').val($('#chkBooking').val());
    $("form").submit();
        });

edited May 23 '17 at 12:07

Community

1
1

answered Jul 22 '14 at 19:45

Simua

263
1
10

score 0 · Answer 4 · edited May 23 '17 at 12:31

First of all if you want to call a server side function on Button click then why not going for a server side button control and call your desired function when button's OnClick event fires.

YourPage.aspx

<asp:Button runat="server" ID="BigButton" OnClick="BigButton_Click" Text="Big Button" />

YourPage.aspx.cs

protected void BigButton_Click(object sender, EventArgs e)
    {
        //Call your function from here
    }

Note : You can add css on server side controls using CssClass attributes.

<asp:Label CssClass="bingo" ID="displayLabel" runat="server" />

Or try this answer :

How to call a C# function from javascript?

Add javascript event to input checkbox to execute in codebehind asp.net,

4 Answers4