Using checkboxes with ASP.NET and Javascript

Question

I have Javascript code that does this:

var oObjchbox = document.getElementById("CheckBox_" + countyId);


The countyId comes from an image map that is pre-made.

The checkboxes on the other hand are created by ASP.NET. My first try was to use an asp.repeater with asp:checkBox, but that did not do the trick since ASP.NET insists on creating own IDs. The other try was to use HTML INPUT without runat=server, but then the checkboxes did not survive a roundtrip.

Does anyone have a solution to this problem? I found a similar problem over here http://www.velocityreviews.com/forums/t301617-hijack-databoundliteralcontrol.html but no one answered his question.

Answer 1

You can use jquery for solve this problem, it provide functionality to select elements by custom query, for example

$("[id*=CheckBox1") - return all elements where end of id is CheckBox1.

$("[id^=CheckBox1") - return all elements where start of id is CheckBox1.

and you can find by contains word and many other selectors.

For more information jquery.com, you will like it =)

Answer 2

If your goal is to detect the selected Checkboxes on the server, why not create a hidden field and update client side by concatenating the country id with each click to create a delimited list such as usa;ca;nl? Read that value on the postback, parse, and you have the countries that have been selected.

In your PageLoad issue the following: RegisterHiddenField("txtCountryCodes","");

Answer 3

If the problem is getting the ID from the Checkbox within a Repeater then this article might help, Select All Checkboxes in a GridView. It shows how to generate a Client Side select all feature on an ASP.Net Gridview.

The issue you are dealing with is not an uncommon one. You want to access a control that is in a control that repeats layout (GridView, Repeater, DataList and the like) using JavaScript.

The thing to remember is that you can access the generated ClientId during the DataBound events (RowDataBound, ItemDataBound) which can then be used on the client side.

Then on the return trip as this is a standard control you should be able to find it. However if you are using a Repeater then Updating data might require a bit more work as the control itself is more designed for read-only type displays.

If the problem is mapping each control to a predefined StateCode then in the ItemDataBound or RowDataBound(if you change from Repeater to Something else) events you could wire a call to a JavaScript method with 1 or 2 parameters depending on the need. Either the currentCheckBoxId and the appropriate StateCode separately or already concatenated and use that as a lookup type feature.

Sorry for the two answers, but the question seemed a little vague as to what you were actually trying to do, maybe I just need another cup of coffee. Hope one of these ideas help.