Question

I am learning jquery and would like to learn how to convert this server side code to jquery function. Any help is appreciated.

Protected Sub ChartstoDisplay_SelectedIndexChanged(sender As Object, e As System.EventArgs) Handles ChartstoDisplay.SelectedIndexChanged
    For i As Integer = 0 To ChartstoDisplay.Items.Count - 1
        If ChartstoDisplay.Items(i).Selected Then
            ChartstoDisplay.Items(i).Attributes.Add("style", "color:DarkGreen;")
        Else
            ChartstoDisplay.Items(i).Attributes.Add("style", """")
        End If
    Next
End Sub

I’ve tried this to no avail.

function checkboxSelection() {          
    foreach (ListItem li in ChartstoDisplay.Items)
    {
        li.Attributes["class"] = "checkBoxListItems";
    }
    $('#ChartstoDisplayAll').click(function() {
    $(".checkBoxListItems").each(
        function(intIndex) {
            if ($(this).find('input').attr('checked') === true)
                    $(this).attr.add("style","color:DarkGreen;");
        });
    });
}

Answer 1

with help from here and others here is the solution

$(document).ready(function () {
      $('#ChartstoDisplayAll').change(
          function () {
              if ($('#ChartstoDisplayAll').is(':checked')) {
                  $(this).next().addClass("selected");
                  $('#buttons').addClass("buttonsshow").removeClass('buttonshide');
                  $("#cbxArea input[type=checkbox]").each(function () {
                      $(this).prop("checked", true);
                      $(this).siblings("label").toggleClass("selected");
                  });
              } else {
                  $('#buttons').addClass("buttonshide").removeClass('buttonsshow');
                  $(this).next().removeClass("selected");
                  $("#cbxArea input[type=checkbox]").each(function () {
                      $(this).prop("checked", false);
                      $(this).siblings("label").removeClass("selected");
                  });
              }
          });
  });