Jquery檢查父行被點擊時的子行優先級

我有以下表結構。如果用戶爲Ist安裝付費，則複選框將被禁用。現在我想要jquery驗證來限制用戶點擊付款IIIrd分期付款而無需支付IInd分期付款。但用戶可以一次支付IInd安裝。它的基本優先級取決於Jquery檢查父行被點擊時的子行優先級

<script> src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"> 
 
</script> 
 
<script> 
 
$('tr input:checkbox').click(function(e) { 
 
    
 
    var table = $(e.target).closest('table'); 
 
    $('td input:checkbox', table).attr('checked', e.target.checked); 
 

 
}); 
 

 
</script>

<html> 
 
<button id="submitButton" type="submit" class="btn btn-secondary">Cick To Pay</button> 
 
<table> 
 
    <tr> 
 
    <td class="checkbox-column"> 
 
    <input type="checkbox" name="invoices[]" id="tr_14640" class="icheck-input"/> 
 
    </td> 
 
    <td>IIInd Instalment</td> 
 
    <td><button type="button" class="btn btn-primary">UnPaid</button></td> 
 
    </tr> 
 

 
    <tr> 
 
    <td class="checkbox-column"> 
 
    <input type="checkbox" name="invoices[]" id="tr_14640" class="icheck-input"/> 
 
    </td> 
 
    <td>IInd Instalment</td> 
 
    <td><button type="button" class="btn btn-primary">UnPaid</button></td> 
 
    </tr> 
 
        
 
    <tr> 
 
    <td class="checkbox-column"> 
 
    <input type="checkbox" name="invoices[]" class="icheck-input" disabled /> 
 
    </td> 
 
    <td>Ist Instalment</td> 
 
    <td><button type="button" class="btn btn-success">Paid</button> 
 
    </td> 
 
    </tr> 
 
    </table> 
 

 
</html>

感謝。

來源

2017-02-28 Keerthi K

你可以添加你嘗試過什麼JS/jQuery代碼？ –

這樣的事情？

$('tr input:checkbox').click(function(e) { 
 
    
 
    var tr = $(e.currentTarget).closest('tr'); 
 
    
 
    if($(tr).next().find('td.checkbox-column').find('input[type="checkbox"]').prop("checked") && 
 
    $(tr).next().find('button.btn-success').length > 0){ 
 
    $('td input:checkbox', tr).attr('checked', e.currentTarget.checked); 
 
    }else{ 
 
    alert("Please pay the " + $(tr).next().find('td.checkbox-column').next().text().trim() + " first."); 
 
    $(this).attr('checked', false); 
 
    } 
 
    
 
    
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<html> 
 
<button id="submitButton" type="submit" class="btn btn-secondary">Cick To Pay</button> 
 
<table> 
 
    <tr> 
 
    <td class="checkbox-column"> 
 
    <input type="checkbox" name="invoices[]" id="tr_14640" class="icheck-input"/> 
 
    </td> 
 
    <td>IIInd Instalment</td> 
 
    <td><button type="button" class="btn btn-primary">UnPaid</button></td> 
 
    </tr> 
 

 
    <tr> 
 
    <td class="checkbox-column"> 
 
    <input type="checkbox" name="invoices[]" id="tr_14640" class="icheck-input"/> 
 
    </td> 
 
    <td>IInd Instalment</td> 
 
    <td><button type="button" class="btn btn-primary">UnPaid</button></td> 
 
    </tr> 
 
        
 
    <tr> 
 
    <td class="checkbox-column"> 
 
    <input type="checkbox" name="invoices[]" class="icheck-input" disabled checked /> 
 
    </td> 
 
    <td>Ist Instalment</td> 
 
    <td><button type="button" class="btn btn-success">Paid</button> 
 
    </td> 
 
    </tr> 
 
    </table> 
 

 
</html>

來源

2017-02-28 07:57:33

Jquery檢查父行被點擊時的子行優先級

回答

相關問題