Jquery input validation dependent on checkbox value

I am trying to avoid a validation mess and using inline validation. I have a checkbox that is followed by three input boxes. If the checkbox is checked, the input fields have to become "required". Else not.

Here is the code:

<div class="col-xs-12">
    <div class="form-group">
        <label class="checkbox-inline">
        <input type="checkbox" id="vi" name="vi" checked="checked">
            I have Apple
        </label>
    </div>
</div>

<div class="col-xs-6">
    <div class="form-group">
        <label>Apple condition?</label> 
        <input type="input" class="form-control" id="appleCond" validate="required:'checkbox[name=vi][value=Yes]:checked'">
    </div>
</div>

<div class="col-xs-6">
    <div class="form-group">
        <label>Sourced from ?</label> 
        <input type="input" class="form-control" id="appleSource" validate="required:'checkbox[name=vi][value=Yes]:checked'">
    </div>
</div>

<div class="col-xs-6">
    <div class="form-group">
        <label>Quantity</label> 
        <input type="input" class="form-control" id="appleQuantity" validate="required:'checkbox[name=vi][value=Yes]:checked'">
    </div>
</div>
</div>

I am sure I am doing something wrong with the syntax. Can anyone point the correct syntax?