wfsy1985
/
ggadmin


			
				
					
						
						
							1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556
							<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Required By Condition</title>
    <link rel="stylesheet" href="demo.css">

    <script src="https://cdn.jsdelivr.net/jquery/1.12.3/jquery.min.js"></script>
    <script src="../dist/jquery.validator.min.js?local=en"></script>
</head>

<body>

<form id="form1" class="form" data-validator-option="{timely:3,focusCleanup:true}">
    <h3>required( dependency-expression )</h3>
    <div class="form-item">
        <label for="isCompany"><input type="checkbox" id="isCompany" checked>Company</label>
    </div>
    <div class="form-item">
        <input type="text" name="companyName" data-rule="required(#isCompany:checked)">
    </div>
    <div class="form-item">
        <button type="submit">Submit</button>
    </div>
</form>

<form id="form2" class="form">
    <h3>required( dependency-callback )</h3>
    <div class="form-item">
        <label><input type="checkbox" id="isPersonal" checked>Personal</label>
    </div>
    <div class="form-item">
        <input type="text" name="email">
    </div>
    <div class="form-item">
        <button type="submit">Submit</button>
    </div>
</form>

<script>
$('#form2').validator({
    timely: 3,
    focusCleanup: true,
    rules: {
        isPersonal: function() {
            return $('#isPersonal').prop('checked');
        }
    },
    fields: {
        email: 'required(isPersonal); email'
    }
});
</script>

</body>
</html>