<div class="card card-custom"> <div class="card-header"> <div class="card-title"> <h3 class="card-title"> نمونه انتخابگر زمان بوت استرپ </h3> </div> </div> <!--begin::Form--> <form class="form"> <div class="card-body"> <div class="form-group row"> <label class="col-form-label text-right col-lg-3 col-sm-12">حداقل</label> <div class="col-lg-4 col-md-9 col-sm-12"> <input class="form-control" id="kt_timepicker_1" readonly placeholder="انتخاب زمان" type="text"/> </div> </div> <div class="form-group row"> <label class="col-form-label text-right col-lg-3 col-sm-12">فعلی زمان</label> <div class="col-lg-4 col-md-9 col-sm-12"> <div class="input-group timepicker"> <input class="form-control" id="kt_timepicker_2" readonly placeholder="انتخاب زمان" type="text"/> <div class="input-group-append"> <span class="input-group-text"> <i class="la la-clock-o"></i> </span> </div> </div> </div> </div> <div class="form-group row"> <label class="col-form-label text-right col-lg-3 col-sm-12">پیش فرض زمان</label> <div class="col-lg-4 col-md-9 col-sm-12"> <div class="input-group timepicker"> <div class="input-group-prepend"> <span class="input-group-text"> <i class="la la-clock-o"></i> </span> </div> <input class="form-control" id="kt_timepicker_3" readonly placeholder="انتخاب زمان" type="text"/> </div> </div> </div> <div class="form-group row"> <label class="col-form-label text-right col-lg-3 col-sm-12">زمان از پیش تعیین شده</label> <div class="col-lg-4 col-md-9 col-sm-12"> <div class="input-group timepicker"> <div class="input-group-prepend"> <span class="input-group-text"> <i class="la la-exclamation-circle"></i> </span> </div> <input class="form-control" id="kt_timepicker_4" readonly value="10:30:20 AM" type="text"/> </div> </div> </div> <div class="form-group row"> <label class="col-form-label text-right col-lg-3 col-sm-12">مودال</label> <div class="col-lg-4 col-md-9 col-sm-12"> <a href="" class="btn btn-light-success font-weight-bold" data-toggle="modal" data-target="#kt_timepicker_modal">مودال انتخابگر زمان</a> </div> </div> </div> <div class="card-footer"> <div class="row"> <div class="col-lg-9 ml-lg-auto"> <button type="reset" class="btn btn-primary mr-2">ارسال</button> <button type="reset" class="btn btn-secondary">لغو</button> </div> </div> </div> </form> <!--end::Form--> </div>
// کلاس definition var KTبوت استرپانتخاب گر زمان = function () { // خصوصی functions var demos = function () { // minimum setup دلار('#kt_timepicker_1, #kt_timepicker_1_modal').timepicker(); // minimum setup دلار('#kt_timepicker_2, #kt_timepicker_2_modal').timepicker({ minuteگام: 1, defaultزمان: '', showSeconds: true, showMeridian: false, snapToگام: true }); // default time دلار('#kt_timepicker_3, #kt_timepicker_3_modal').timepicker({ defaultزمان: '11:45:20 AM', minuteگام: 1, showSeconds: true, showMeridian: true }); // default time دلار('#kt_timepicker_4, #kt_timepicker_4_modal').timepicker({ defaultزمان: '10:30:20 AM', minuteگام: 1, showSeconds: true, showMeridian: true }); } return { // public functions init: function() { demos(); } }; }(); jQuery(document).ready(function() { KTبوت استرپانتخاب گر زمان.init(); });
<div class="card card-custom"> <div class="card-header"> <div class="card-title"> <h3 class="card-title"> اعتبارسنجی </h3> </div> </div> <!--begin::Form--> <form class="form"> <div class="card-body"> <div class="form-group row"> <label class="col-form-label text-right col-lg-3 col-sm-12">حالت معتبر</label> <div class="col-lg-4 col-md-9 col-sm-12"> <div class="input-group timepicker"> <input class="form-control is-valid" id="kt_timepicker_1_validate" readonly placeholder="انتخاب زمان" type="text"/> <div class="input-group-append"> <span class="input-group-text"><i class="la la-clock-o"></i></span> </div> <div class="valid-feedback">موفقیت! شما"ve done it.</div> </div> <span class="form-text text-muted">نمونه متنی راهنما که بدون تغییر است.</span> </div> </div> <div class="form-group row has-danger"> <label class="col-form-label text-right col-lg-3 col-sm-12">وضعیت خطا</label> <div class="col-lg-4 col-md-9 col-sm-12"> <div class="input-group timepicker"> <input class="form-control is-invalid" id="kt_timepicker_2_validate" readonly placeholder="انتخاب زمان" type="text"/> <div class="input-group-append"> <span class="input-group-text"><i class="la la-clock-o"></i></span> </div> <div class="invalid-feedback">Sorry, that username"s taken. Try another?</div> </div> <span class="form-text text-muted">نمونه متنی راهنما که بدون تغییر است.</span> </div> </div> </div> <div class="card-footer"> <div class="row"> <div class="col-lg-9 ml-lg-auto"> <button type="reset" class="btn btn-primary mr-2">ارسال</button> <button type="reset" class="btn btn-secondary">لغو</button> </div> </div> </div> </form> <!--end::Form--> </div>
// کلاس definition var KTبوت استرپانتخاب گر زمان = function () { // خصوصی functions var demos = function () { // validation state demos // minimum setup دلار('#kt_timepicker_1_validate, #kt_timepicker_2_validate').timepicker({ minuteگام: 1, showSeconds: true, showMeridian: false, snapToگام: true }); } return { // public functions init: function() { demos(); } }; }(); jQuery(document).ready(function() { KTبوت استرپانتخاب گر زمان.init(); });
