En mi formulario, cuando un usuario hace clic en un botón, se agregará un nuevo campo de entrada. Necesito validar cuando el usuario presiona el botón Enviar sin completar la fecha. (Es un selector de fechas). No estoy seguro de lo que está mal,

Aquí está mi código:

 var room = 0; function room_fields() { room++; var objTo = document.getElementById('room_fields') var divtest = document.createElement("div"); divtest.setAttribute("class", "row removeclass"+room); var rdiv = 'removeclass'+room; divtest.innerHTML = '<div class="col-5 form-group"><div class="form-control-wrap"><div class="form-icon form-icon-left"><em class="icon ni ni-calendar"></em></div><input type="text" class="form-control date-picker" data-date-format="yyyy-mm-dd" placeholder="Select Intake date" name="selected_intakes" id="selected_intakes_'+room+'"></div></div><div class="col-2 form-group"><input type="button" class="btn btn-danger" value="-" onclick="remove_education_fields('+ room +');"></div>'; objTo.appendChild(divtest) setTimeout(function(){ $("#selected_intakes_"+room).datepicker(); $("#selected_dates_"+room).datepicker(); $('#selected_dates_'+room).rules('add', { required: true, }); }, 50); } function remove_education_fields(rid) { $('.removeclass'+rid).remove(); }

Mi entrada:

 <input type="text" class="form-control date-picker" data-date-format="yyyy-mm-dd" name="selected_dates" id="selected_dates_{{counter}}"> <input type="button" class="btn btn-primary" value="+" onclick="room_fields();">

Entonces, a partir de lo anterior, cuando el usuario presiona el botón, se llama room_fields y se agrega un nuevo campo. Y también estoy agregando reglas. Pero lamentablemente mi formulario no está siendo validado.

Y tenga en cuenta: no puedo usar nombres dinámicos, en su lugar estoy usando identificaciones dinámicas

Por favor ayuda