bootstrap datetimepicker+bootstrapValidator使用

1.导入相应下面Js和CSS  还需导入BootStrap中的fonts文件夹

bootstrap datetimepicker+bootstrapValidator使用_第1张图片

2.

bootstrap datetimepicker+bootstrapValidator使用_第2张图片

3.js  注意#datetimePicker

$(document).ready(

function() {

$('#datetimePicker').datetimepicker({

format : 'YYYY-MM-DD'

});

$('#datetimePicker').on(

'dp.change dp.show',

function(e) {

// Validate the date when user change it

$('#defaultForm').data('bootstrapValidator')

.revalidateField('datetimePicker');

});

$('#btn_addTrain').on('click', function() {

$('#myModal').modal('show');

});

$('#defaultForm').bootstrapValidator({

message : '字段无效!',

feedbackIcons : {

valid : 'glyphicon glyphicon-ok',

invalid : 'glyphicon glyphicon-remove',

validating : 'glyphicon glyphicon-refresh'

},

fields : {

time : {

validators : {

notEmpty : {

message : '时间不能为空!'

},

date : {

format : 'MM/DD/YYYY h:m A'

}

}

},

}

});

$('#btn_submit').click(function() {

$('#defaultForm').bootstrapValidator('validate');

bootstrapValidator.validate();

if (bootstrapValidator.isValid())

$("#defaultForm").submit();

else

return;

});

你可能感兴趣的:(bootstrap datetimepicker+bootstrapValidator使用)