أظهار التاريخ الهجري تلقائيا بجانب التاريخ الميلادي

سلام عليكم

احتاج طريقة لما المستخدم يكتب التاريخ الميلادي في الخانة الخاصة به تلقائيا يظهر لك التاريخ الهجري في الخانة المقابلة

و العكس

مع خالص الشكر

        <div class="col-4">
            <div class=" has-success mb-4">
                <label class="label">التاريخ الميلادي</label>
                <div class="input-group">
                    <input id="Milady" required type="date" class="form-control Milady" >
                </div>
            </div>
        </div>

<div class="col-4">
    <div class=" has-success mb-4">
        <label class="label">التاريخ الهجري</label>
        <div class="input-group">
            <input disabled required type="date" class="form-control hejri" name="client" >
        </div>
    </div>
</div>