Tell me more ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote -1 down vote favorite

how to make a checkbox checked/unchecked based on the value sent to the Javascript function? Pls check this how to call the showModalPopup function.

I have a gridview:

<asp:GridView ID="GV1" runat="server" DataSourceID="DS1" >
  <Columns>

    <asp:BoundField HeaderText="ID" DataField="ID"/>

    <asp:TemplateField ShowHeader="False">
      <ItemTemplate>
        <asp:LinkButton ID="Edit_LinkButton" runat="server" CausesValidation="False" >
          <asp:Image ID="Edit_Linkbutton_Image" runat="server" ImageUrl="~/edit.png"></asp:Image>
        </asp:LinkButton>
      </ItemTemplate>
    </asp:TemplateField>

    <asp:TemplateField HeaderText="Status" Visible="False">
      <ItemTemplate>
        <asp:Label ID="Status" runat="server" Text='<%# Bind("Status") %>'></asp:Label>
      </ItemTemplate>
    </asp:TemplateField>

  </Columns>
</asp:GridView>

And then I attach a Javascript function to the LinkButton through code-behind:

Dim myLinkButton As LinkButton

For i As Integer = 0 To GV1.Rows.Count - 1
  Dim CheckBox1 As String = TryCast(GV1.Rows(i).FindControl("Status"), Label).Text

  myLinkButton = DirectCast(GV1.Rows(i).Cells(1).FindControl("Edit_LinkButton"), LinkButton)
  myLinkButton.Attributes.Add("onclick", "shopModalPopup('" & .Rows(i).Cells(0).Text & "', '" & CheckBox1 & "'); return false;")
Next

Rows(i).Cells(0) is the first column on the Gridview, it is "ID".

Then, the Javascript function to call the modal-box is:

<script>
                var grid_modal_options = {
                    height: 450,
                    width: 550,
                    modal: true
                };

                function shopModalPopup(Field1, Check1) {
                    var DataField1 = Field1; //--> ID
                    var CheckField1 = Check1; //--> Status

                    grid_modal_options.open = function () {
                        $('#dialog-form #Textbox1').val(DataField1);
                        $('#dialog-form #Checkbox1').checked = CheckField1;
                    };

                    $("#dialog-form").dialog(grid_modal_options);
                    $("#dialog-form").parent().appendTo('form:first');
                }
</script>

And the code for display the modal-box:

<div id="dialog-form" title="Modal-box" style="display: none;">
    <asp:TextBox ID="Textbox1" runat="server" Text="" Enabled="false">
    <asp:CheckBox ID="Checkbox1" runat="server"/>
</div>

The code above doesn't check the checkbox but for the textbox value assigned succesfully. I need the checkbox one is also assigned by the javascript. How can I do that? Thank you very much.

share|improve this question
I don't see where you're calling shopModalPopup. – Marc Apr 24 '12 at 13:34
You should read the API docs. Once your code is working correctly, toss it over to codereview.stackexchange.com since it could use quite a few stylistic improvements. – Matt Ball Apr 24 '12 at 13:35
And if you're using unique ids to reference your DOM elements, you don't need to make them any more specific than just the ID – Marc Apr 24 '12 at 13:37
Pls have a check on stackoverflow.com/questions/10291047/… . I just don't want to make it redundant to rewrite the same code here. Sorry for missing to enclose the link.. – mrjimoy_05 Apr 24 '12 at 13:57

3 Answers

up vote 0 down vote accepted

Use the .prop() command: 

$("#dialog-form #Checkbox1").prop("checked", CheckField1);

http://api.jquery.com/prop/

share|improve this answer
I think it should be right but it doesn't work. Am I missing something? Pls see the link provided above to know how to call the function on the Javascript. Thanks :) – mrjimoy_05 Apr 24 '12 at 13:59
@mrjimoy_05 - what does CheckField1 return? alert(CheckField1), this should return true in order to set the checkbox value property. – Darren Davies Apr 24 '12 at 14:10
The CheckField1 return the true/false value. I checked it and return the right value, but still can't check/uncheck the checkbox. – mrjimoy_05 Apr 24 '12 at 14:24
@mrjimoy_05 try: $("#Checkbox1").prop("checked", CheckField1); If that doesn't work try: alert($("#dialog-form #Checkbox1")); and see if that returns the object. – Darren Davies Apr 24 '12 at 14:30
I tried and it returns the object. But still can't set the check/uncheck on the checkbox... – mrjimoy_05 Apr 24 '12 at 14:37
show 2 more comments
up vote 0 down vote

You can use .val(), with the value of the checkbox as a single-item array to check a checkbox:

$('#dialog-form #Checkbox1').val([ "Checkbox1" ]);

Make sure the checkbox specifices "Checkbox1" as its value.

share|improve this answer
Thanks for the code, but it doesn't work. Pls see the link provided above to make clear how to call the function on the Javascript. :) – mrjimoy_05 Apr 24 '12 at 13:58
@Does you checkbox have a value attribute? – Ates Goral Apr 24 '12 at 14:04
No, it doesn't... Or I misunderstood what you mean? – mrjimoy_05 Apr 24 '12 at 14:23
Sorry for being too terse. What I meant was, you need to add a value attribute to your checkbox for val to work. This is not the most concise way to check a checkbox, but I like it because it uses val, similar to other field types. – Ates Goral Apr 24 '12 at 14:38
You means: <asp:CheckBox ID="Checkbox1" text="" runat="server"/> ? – mrjimoy_05 Apr 24 '12 at 14:56
show 3 more comments
up vote 0 down vote

Pretty sure it should be like this:

$('#dialog-form #Checkbox1').attr('checked', true);
share|improve this answer
Thanks, but it doesn't work. Pls see the link provided above to make clear how to call the function on the Javascript. :) – mrjimoy_05 Apr 24 '12 at 13:59

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.