jQuery Set Checkbox to be Checked based on 3 conditions data

Is it possible to check checkbox based on data-id and data-tipe and data-group using jQuery on my case below:

Updated Question

success: function (jsonStr)
{
    var len = jsonStr.length;
    for(var i=0; i<len; i++)
    {
        var moduleID = jsonStr[i].moduleID;
        var moduleName = jsonStr[i].moduleName;
        var projectName = jsonStr[i].projectName;
        var groupID = jsonStr[i].groupID;
        var chk = jsonStr[i].chk;
        var chkModule = jsonStr[i].chkModule;
        var group = jsonStr[i].group;

        var tr_str = "<tr id='"+jsonStr[i].moduleID+"'>" +
            "<td>" + projectName + "</td>" +
            "<td>" + moduleName + "<input type='text' name='chkTipeInput[]' class='chkTipeInput"+jsonStr[i].moduleID+"'/></td>" +
            "<td align='center'><input type='checkbox' data-id='"+jsonStr[i].moduleID+"' data-group='"+jsonStr[i].groupID+"' data-tipe='CREATE' value='CREATE'/></td>" +
            "<td align='center'><input type='checkbox' data-id='"+jsonStr[i].moduleID+"' data-group='"+jsonStr[i].groupID+"' data-tipe='EDIT' value='EDIT'/></td>" +
            "<td align='center'><input type='checkbox' data-id='"+jsonStr[i].moduleID+"' data-group='"+jsonStr[i].groupID+"' data-tipe='VIEW' value='VIEW'/></td>" +
            "<td align='center'><input type='checkbox' data-id='"+jsonStr[i].moduleID+"' data-group='"+jsonStr[i].groupID+"' data-tipe='DELETE' value='DELETE'/></td>" +
            "</tr>";

            $('.dataShow2').show();
            $("#tData tbody").append(tr_str);
    }

    $(":checkbox").each(function() {
       $(this).prop("checked", $(this).attr("data-id") == chkModule && $(this).attr("data-tipe") == chk && $(this).attr("data-group") ==   group )
    })
})

Array for:

chk       = CREATE,EDIT,  EDIT,  VIEW
chkModule = MD0003,MD0003,MD0002,MD0002
group     = GR0001,GR0001,GR0001,GR0001

Means if :

if data-id="1" and data-tipe="create" and data-group="a" then check the checkbox

Answers 1

  • //$(":checkbox").each(function() {
    
    //$(this).prop("checked", $(this).attr("data-id") == 1 && $(this).attr("data-tipe") == "create" && $(this).attr("data-group") == "a")
    //})
    
    //var data = [1,"create","a"]//array of values
    
    var chk = ["CREATE", "VIEW", "EDIT", "DELETE"]
    var chkModule = ["MD0003", "MD0002", "MD0003", "MD0002"]
    var group = ["GR0001", "GR0001", "GR0001", "GR0001"]
    
    
    for (var i = 0; i < 4; i++) {
      console.log(chk[i] + " " + chkModule[i] + " " + group[i])
      $(":checkbox[data-tipe=" + chk[i] + "][data-id=" + chkModule[i] + "][data-group=" + group[i] + "]").prop("checked",true)
    }
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <table>
      <tr>
        <th>Nama</th>
        <th>Create</th>
        <th>Read</th>
        <th>Update</th>
        <th>Delete</th>
      </tr>
      <tr>
        <td>coba</td>
        <td><input type="checkbox" data-id="MD0003" data-tipe="CREATE" data-group="GR0001"></td>
        <td><input type="checkbox" data-id="MD0002" data-tipe="VIEW" data-group="GR0001"></td>
        <td><input type="checkbox" data-id="MD0003" data-tipe="EDIT" data-group="GR0001"></td>
        <td><input type="checkbox" data-id="MD0002" data-tipe="DELETE" data-group="GR0001"></td>
      </tr>
      <tr>
        <td>coba 2</td>
        <td><input type="checkbox" data-id="2" data-tipe="create" data-group="a"></td>
        <td><input type="checkbox" data-id="2" data-tipe="read" data-group="a"></td>
        <td><input type="checkbox" data-id="2" data-tipe="update" data-group="a"></td>
        <td><input type="checkbox" data-id="2" data-tipe="delete" data-group="a"></td>
      </tr>
      <tr>
        <td><input type="button" id="btnUpdate" value="Update" />
      </tr>
    </table>

    Use the condition if true then prop == check


Related Articles