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?

Answer 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
}

Answer 2

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.

Answer 3

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();
        });

Answer 4

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?