Проверка бутстрапа datepicker от бутстрапа formhelpers

Ответ 1

Обновили скрипку: https://jsfiddle.net/2rcr9j5s/1/

                $.validator.setDefaults({
                submitHandler: function() {
                    form.submit()
                }
            });

            $().ready(function() {

                var container = $('div.containerx');

                $("#Form").validate({
                    ignore: [],
                    rules:{
                       StartTime: {
                            required: true
                        }
                    },
                    messages: {
                        StartTime: {
                            required: "Select the StartTime."
                        }
                    },
                    errorContainer: container,
                    errorLabelContainer: $("span", container),

                    highlight: function ( element, errorClass, validClass ) {
                        $('#StartTime').addClass( "btn-danger" );
                        $('#Filter').addClass( "btn-danger" );
                    },
                    unhighlight: function ( element, errorClass, validClass ) {
                        $('#StartTime').removeClass( "btn-danger" );
                        $('#Filter').removeClass( "btn-danger" );
                    }
                });
            }); 

Установите параметр datepicker.

Это то, что вам нужно?

Ответ 2

В соответствии с вашим кодом кажется, что элемент ввода не находится в активном состоянии, поэтому мы должны активировать его сначала, когда вызывается функция выделения. Таким образом, мы можем добавить активный класс, чтобы сделать его активным сначала, затем применим btn-опасность. Таким образом, ваш код должен выглядеть как

highlight: function ( element, errorClass, validClass ) {
          $(element).addClass( "active" );
          $(element).addClass( "btn-danger" );
          $('#Filter').addClass( "btn-danger" );
        },
unhighlight: function ( element, errorClass, validClass ) {
          $(element).removeClass( "active" );
          $(element).removeClass( "btn-danger" );
          $('#Filter').removeClass( "btn-danger" );
        }

Обновлен скрипт: https://jsfiddle.net/anulesh91/2rcr9j5s/10/

Ответ 3

Ваш скрипт обновления: https://jsfiddle.net/2rcr9j5s/4/

Абсолютно отлично, а валидатор jQuery проверяет его только из-за класса btn-опасности, текст внутри поля ввода белый. вам просто нужно добавить

color: black; в это поле ввода, а остальная часть кода работает нормально.

Ответ 4

Я никогда не использовал этот плагин, но я быстро просмотрел документацию, и есть способ написать HTML и javascript, чтобы вы могли управлять своим собственным полем ввода. Однако я просто попытаюсь ответить на ваш вопрос так, как есть, поэтому вы не тратите много времени на перемещение кода.

Чтобы ответить на ваш вопрос, если вы проверите элемент в своем браузере, вы увидите, что имя входа - "StartTime".

Итак, все, что вам действительно нужно сделать, это отправить эту форму, получить значение для этого имени ввода и проверить его. Если это хорошая ценность, ничего не делайте. иначе запретите отправку.

var value = $("input[name='StartTime']").val();

Теперь значение переменной имеет значение для этого поля ввода. Вы можете проверить его, как хотите. Удостоверьтесь, что он не пуст, напишите регулярное выражение, чтобы убедиться, что это хороший формат и цифры имеют смысл. У вас есть значение, которое вы можете делать с ним. Небо - это предел.

Я надеюсь, что это помогло.

Ответ 5

Вы не можете использовать javascript для проверки. Используйте jquery. попробуйте это.

$.validator.setDefaults({
                    submitHandler: function() {
//////////////////////////// you can write your validation/////////////////////////////          

          var x = $("[name=StartTime]").val();
          alert(x);
///////////////////////////////////////////////////////////////////////////////////////          
                        form.submit();
                    }
                });

                $().ready(function() {

                    var container = $('div.containerx');

                    $("#Form").validate({
                        ignore: [],
                        messages: {
                            StartTime: {
                                required: "Select the StartTime."
                            }
                        },
                        errorContainer: container,
                        errorLabelContainer: $("span", container),

                        highlight: function ( element, errorClass, validClass ) {
                            $('#StartTime').addClass( "btn-danger" );
                            $('#Filter').addClass( "btn-danger" );
                        },
                        unhighlight: function ( element, errorClass, validClass ) {
                            $('#StartTime').removeClass( "btn-danger" );
                            $('#Filter').removeClass( "btn-danger" );
                        }
                    });
                });