jQuery的設置複選框，基於3點條件的數據

Question

檢查是否有可能基於data-id和data-tipe和data-group下面我的情況下使用jQuery檢查複選框：

更新問題

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) 
    }) 
}) 

陣列用於：

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

意思是：

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

Answer 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>

使用狀況，如果真那麼託==檢查

Answer 2

您可以指定屬性，它在選擇的值，然後使用prop設置屬性值：

$("input[data-id='1'][data-tipe='create'][data-group='a']").prop("checked", true); 

演示：

$("input[data-id='1'][data-tipe='create'][data-group='a']").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="1" data-tipe="create" data-group="a"></td> 
 
    <td><input type="checkbox" data-id="1" data-tipe="read" data-group="a"></td> 
 
    <td><input type="checkbox" data-id="1" data-tipe="update" data-group="a"></td> 
 
    <td><input type="checkbox" data-id="1" data-tipe="delete" data-group="a"></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>

Answer 3

您可以使用過濾器

$('input[type=「checkbox」]').filter(function() { 
return $(this).data("id") == "1" && $(this).data("tipe") == "create" && $(this).data("group") == "a"); 
}).prop("checked",true);