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 0 down vote favorite

So I'm using the JQuery datatables.net(www.datatables.net) and having alot of success. But recently I tried to add some checkbox columns but am not having much success. Visually everything is working but when I actually check/uncheck it does not change the underlying value underneath, either when I inspect the element with chrome or catch it in javascript. Do I need to update the table or something to refresh the DOM object?

Javascript creating datatable:

$('#userGroupSettings').dataTable({
"bJQueryUI": true,
"aoColumns": [
/* ID */
    {
    "bVisible": false
},
/* Group Name */null,
/* Display Group */null,
/* Group Minimised*/null,
/* Send Fault Email*/null],
"aaSorting": [[1, "asc"]]

});

asp mvc razor code for creating the table:

<table id="userGroupSettings">
    <thead>
        <th>Group ID</th>
        <th>Group Name</th>
        <th>Display Group</th>
        <th title="When loading the webpage this will determine if the group is minimised or not">Group Minimised</th>
        <th title="Send me a fault email when an issue occurs in this group">Send Fault Email</th>
    </thead>
    <tbody>
    @foreach (MvcApplication2.Models.UserGroup group in user.Groups)
    {
        <tr>
            <td>@group.GroupID</td>
            <td>@group.GroupName</td>
            <td><input class="SettingsDisplayGroup" type="checkbox" name="displayGroup" value="@group.DisplayGroup" @(group.DisplayGroup ? "checked=\"checked\"" : "")/></td>
            <td><input class="SettingsMinimiseGroup" type="checkbox" name="minimiseGroup" value="@group.GroupMinimised" @(group.GroupMinimised ? "checked=\"checked\"" : "")/></td>
            <td><input class="SettingsSendFaultEmail" type="checkbox" name="sendFaultEmail" value="@group.SendFaultEmail" @(group.SendFaultEmail ? "checked=\"checked\"" : "")/></td>
        </tr>
    }
    </tbody>
</table>
<button id="saveUserGroupSettings">Save</button>

Any help appreciated

share|improve this question
I'm pretty sure the debugging tool just doesn't update the html. I have checkboxes same way as you do and they are working fine. I'm using FF and firebug and html doesn't update either but it is working as expected. Are they working fine when you post them? – sormii Sep 18 '12 at 7:21

2 Answers

up vote 0 down vote accepted

So I fixed the issue. The main problem I had was when I was accessing the data I was converting a string into a javascript element and because it did not have the checked="checked" property it was set to false:

$($('#userGroupSettings').dataTable().fnGetData(i)[2])

So instead of looping through the datatables with fnGetData I had to use the javascript table row elements and search through them this way:

$('#userGroupSettings tbody tr').each(function () {
    var isChecked = $(this).find('.SettingsDisplayGroup')[0].checked;
}

I think because i was creating a new jquery element from the datatables content(a string), the checked property had not been set there

Just to note that if you have any datatables.net hidden columns then you will not be able to access them like.

share|improve this answer
up vote 1 down vote

A checked checkbox simply means that it's value will be sent as post, it doesn't need to change anything else. Of course if you have multiple checkboxes with the same name, if one of the checkboxes is checked it's value will be sent

share|improve this answer

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.