checkboxlist and javascript

[Stimp]

I have a checkboxlist (chkMyList) which is created from a (name, value)
pair from a database table.

I have a read-only textbox which will be used to hold a total of
all the numerical values of each checkbox that is checked, and this
value will change dynamically via javascript when a box is ticked or unticked.

e.g.
<script language="javascript">
function GetCost() {
var iTotalCost;
iTotalCost = 0;

if (document.form.chkMyList_0.checked){
iTotalCost = iTotalCost + 15;}
if (document.form.chkMyList_1.checked){
iTotalCost = iTotalCost + 18;}

....etc...
document.form.txtTotalCost.value = iTotalCost;
}
</script>

<asp:checkboxlist id="chkMyList" runat="server" />
<asp:textbox id="txtTotalCost" runat="server" ReadOnly="True" />


...but when I try to add the 'onchange=GetCost();' to chkMyList in the
Page_Load():

chkMyList.Attributes.Add("onChange", "GetCost();")

...it doesn't add it to the individual checkboxes, but rather to the
<table> generated for the checkboxes by the checkboxlist function.

Hence it doesn't work.

Is there any way to add the javascript to each checkbox in the
checkboxlist as they are generated?

Also a better suggestion for the javascript function would be most
appreciated (Ideally I'd like a function that takes in the checkbox
value, rather than having to hardcode a load of 'if' statements etc)

Thanks in advance!
Peter

 

[google]

Hello Peter,

Would the following javascript work, perhaps:

var text_to_add;
function addValue(text_to_add) {
document.getElementById("the_textbox_id").value =
document.getElementById("the_textbox_id").value + text_to_add;
}

This just adds the value of the textbox to the new value. You would
just call the function in the checkbox onclick() event.

Chris S.
Implied By Design LLC.
http://www.impliedbydesign.com
Free Web Design Tools
http://www.impliedbydesign.com/free-software-scripts.html

 

[Stimp]

Hello Peter,

Would the following javascript work, perhaps:

var text_to_add;
function addValue(text_to_add) {
document.getElementById("the_textbox_id").value =
document.getElementById("the_textbox_id").value + text_to_add;
}

This just adds the value of the textbox to the new value. You would
just call the function in the checkbox onclick() event.

Thanks! I'll give it a shot first thing in the morning.. any idea how I
could attach the 'onclick' to each checkbox as the checkboxlist is
generated?

Peter

 

[[email protected]]

You can create a composite asp.net control and make it render in JavaScript as you want.. see my control below:

public class CustomCheckBox: CheckBox
{

/// <summary>
/// Gets or sets the on change client script.
/// </summary>
/// <value>The on change client script.</value>
public string OnChangeClientScript
{
get { return _onChangeClientScript; }
set { _onChangeClientScript = value; }
}
private string _onChangeClientScript;


/// <summary>
/// Gets or sets the value.
/// </summary>
/// <value>The value.</value>
public string Value
{
get { return _value; }
set { _value = value; }
}
private string _value;

/// <summary>
/// Displays the <see cref="T:System.Web.UI.WebControls.CheckBox"></see> on the client.
/// </summary>
/// <param name="writer">A <see cref="T:System.Web.UI.HtmlTextWriter"></see> that contains the output stream to render on the client.</param>
protected override void Render(HtmlTextWriter writer)
{
string onchangeAttribute = string.Empty;
if (!string.IsNullOrEmpty(OnChangeClientScript))
{
onchangeAttribute= string.Format(System.Globalization.CultureInfo.InvariantCulture,
"onchange='{0}'", OnChangeClientScript);
}
string valueAttribute = string.Empty;
if (!string.IsNullOrEmpty(Value))
{
valueAttribute = string.Format(System.Globalization.CultureInfo.InvariantCulture,
"value='{0}'", Value);
}

writer.Write(string.Concat(
"<span title='", this.ToolTip, "' style='display:inline-block;width:",
this.Width.ToString(), ";'>"));
writer.Write(string.Concat(
"<input id='", this.ClientID,"' ",
"type='checkbox' name='", this.ClientID, "' ",
onchangeAttribute, valueAttribute, " />"));
writer.Write(string.Concat(
"<label for='", this.ClientID, "'>",
this.Text, "</label></span>"));
}

}

 

[Denham]

Checkboxlist

Have to loop through all checkboxes as they are rendered as separate items in a table

protected void Page_Load(object sender, EventArgs e)
{
for (int i = 0; i < cboColumns.Items.Count; i++)
{
cboColumns.Items.Attributes.Add("onClick", "fieldsChanged();");
}
}

 

[Denham]

Should be in the Page_PreRender event instead of Page_Load event