bootstrap Validierungsdatum DD.MM.YYYY jquery

Question

Ich möchte mein erstes Feld auf dem Formular createViewModal, datepickerCreateModal in dd.mm.yyyy Format validieren. Ich war für einige regex gesucht und ich fand es:

/(0[1-9]|[12][0-9]|3[01])\.(0[1-9]|1[012])\.(19|20)\d\d/ 

Aber es scheint, dass dieser REGEX ist ziemlich gut - es zieht nur zwei Ziffern von einem Jahr ("20" statt "2016")

Können Sie schreiben mir eine volle Regex für dd.mm.yyyy (11.05.2016)? Ich denke, dass ich Callback-Funktion mit diesem Regex durch Bootstrap-Validator erstellen kann.

Wenn jemand schon diese Regex oder eine ähnliche Lösung hat, würde ich mich freuen, es zu hören!

<div class="modal fade" id="createViewModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
    <div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal"> 
     <span aria-hidden="true">&times;</span><span class="sr-only">Close</span> 
     </button> 
     <h4 class="modal-title" id="myModalLabel">New SAR</h4> 
     </div> 
     <div class="modal-body"> 
     <div id="formregister"> 
      <form action="" class="form-horizontal" role="form" id="createViewModal"> 
      <p class="qc-errmsg" style="display: none;">&nbsp;</p> 
      <div class="form-group"> 
       <label for="Date" class="col-sm-2 control-label">Date</label> 
       <div class="col-sm-10"> 
       <input type="text" class="form-control" id="datepickerCreateModal" name="Date" placeholder="Date"> 
       </div> 
      </div> 
      <div class="form-group"> 
       <label for="Client" class="col-sm-2 control-label">Client</label> 
       <div class="col-sm-10"> 
       @Html.DropDownList("Client1", (SelectList)ViewBag.ClientID, "", new { @class = "form-control", tabindex = "1", id = "client" }) 
       </div> 
      </div> 
      <div class="form-group"> 
       <label for="EventType" class="col-sm-2 control-label">Event Type</label> 
       <div class="col-sm-10"> 
       @Html.DropDownList("Eventtype", (SelectList)ViewBag.EventTypeID, "", new { @class = "form-control", tabindex = "2", id = "event" }) 
       </div> 
      </div> 
      <div class="form-group"> 
       <div class="col-sm-offset-2 col-sm-10"> 
       <button type="button" class="close1 btn btn-default" data-dismiss="modal">Close</button> 
       <button type="submit" value="cart" class="btn btn-primary">Save Changes</button> 
       </div> 
      </div> 
      </form> 
     </div> 
     <!-- form register --> 
     <div id="successfulpost" style="font: bold 12px Verdana, Arial, Helvetica, sans-serif; color: #ff0000; display: none;"> 
      <p class="jst-txt"> 
      <span>Thank you,</span> for showing your Interest !! 
      </p> 
      <p class="jst-txt">Our property advisor shall get in touch with you very shortly..</p> 
     </div> 
     </div> 
     <!-- model body--> 
    </div> 
    </div> 
</div> 
<script> 
    $(function() { 
     $('#createViewModal').bind('show', function() { 
      $("#datepickerCreateModal").val($(this).val() + "."); 
     }); 
    }); 
    function clearCreateModal() { 
     $('#event').val(0); 
     $('#client').val(0); 
     $('#datepickerCreateModal').val(""); 
     $('#datepickerCreateModal').focus(); 
    } 
    $('.close,.close1').click(function() { 
     $('#client').val(0); 
     $('#event').val(0); 
     $('#datepickerCreateModal').val(''); 
     $('#createViewModal').data('bootstrapValidator').resetForm(); 
    }); 
    $('#dateFrom, #dateTo,#datepickerCreateModal,#datepickerEditModal').datepicker({ 
     todayBtn: "linked", 
     daysOfWeekHighlighted: "0,6", 
     calendarWeeks: true, 
     autoclose: true, 
     format: "dd.mm.yyyy" 
    }); 
    $.fn.dataTable.ext.search.push(
     function (settings, data, dataIndex) { 
      var minDate = $('#datepicker10').val(); 
      var maxDate = $('#datepicker11').val(); 
      var ageInputs = data[1].split('.'); 
      var age = new Date(ageInputs[2], ageInputs[1] - 1, ageInputs[0]); 
      //var getdate = date.getDate(); 
      var min; 
      if (minDate.indexOf(".") > -1) { 
       var input = minDate.split('.'); 
       var count = input.length; 
       if (count > 2) { 
        min = new Date(input[2], input[1] - 1, input[0]); 
       } 
      } 
      var max = new Date(maxDate.split('.')[2], maxDate.split('.')[1] - 1, maxDate.split('.')[0]); 
      if ((isNaN(min) && isNaN(max)) || 
      (isNaN(min) && age <= max) || 
      (min <= age && isNaN(max)) || 
      (min <= age && age <= max)) { 
       return true; 
      } 
      return false; 
     } 
); 
    var t; 
    $(document).ready(function() { 
     'use strict'; 
     $('#createViewModal').bootstrapValidator({ 
      // To use feedback icons, ensure that you use Bootstrap v3.1.0 or later 
      feedbackIcons: { 
       valid: 'glyphicon glyphicon-ok', 
       invalid: 'glyphicon glyphicon-remove', 
       validating: 'glyphicon glyphicon-refresh' 
      }, 
      fields: { 
       Date: { 
        message: 'Date is not valid', 
        validators: { 
         notEmpty: { 
          message: 'Date is required and cannot be empty' 
          //}, 
          //stringLength: { 
          // min: 6, 
          // max: 30, 
          // message: 'The Album Name must be more than 6 and less than 30 characters long' 
          //}, 
          //regexp: { 
          // regexp: /(0[1-9]|[12][0-9]|3[01])\.(0[1-9]|1[012])\.(19|20)\d\d/, 
          // message: 'The Album Name can only consist of alphabetical and number' 
         } 

        } 

        //form.submit(); 
       }, 
       Client1: { 
        message: 'Client is not valid', 
        validators: { 
         notEmpty: { 
          message: 'Client is required and cannot be empty' 
         } 
        } 
       }, 
       Eventtype: { 
        message: 'Event type is not valid', 
        validators: { 
         notEmpty: { 
          message: 'Event type is required and cannot be empty' 
         } 
        } 
       } 

      } 
     }).on('success.form.bv', function (e) { 
      // Prevent form submission 
      //$('#success_message').slideDown({ opacity: "show" }, "slow") // Do something ... 
      $('#createViewModal').data('bootstrapValidator').resetForm(); 

      // Prevent form submission 
      e.preventDefault(); 

      // Get the form instance 
      var $form = $(e.target); 

      // Get the BootstrapValidator instance 
      var bv = $form.data('bootstrapValidator'); 

      // Use Ajax to submit form data 
      $.post($form.attr('action'), $form.serialize(), function (result) { 
       console.log(result); 
      }, 'json'); 

      $.ajax({... }); 
      // Do whatever you want here ... 
     }); 
     t = $('#example').DataTable({ 
      "iDisplayLength": 1000, 
      //dom: 'Bfrtip', 
      buttons: [ 
       'copy', 'csv', 'excel', 'pdf', 'print' 
      ], 
      "columnDefs": [ 
       { 
        "targets": [0], 
        "visible": false, 
        "searchable": false 
       }, 
       { "width": "200px", "targets": 6 } 
      ] 
     }); 
     yadcf.init(t, 
      [ 
       { 
        column_number: 0, 
        filter_type: "multi_select", 
        select_type: 'select2' 
       }, 
       { 
        column_number: 3, 
        filter_type: "multi_select", 
        select_type: 'chosen' 
       }, 
       { 
        column_number: 4, 
        filter_type: "multi_select", 
        select_type: 'chosen' 
       } 
      ] 
    ); 
    }); 
</script> 

Answer 1

Erster Versuch zu verwenden, versuchen immer \d\d\.\d\d\.\d\d\d\d ist.

Es ist zu breit, offensichtlich. Lass es uns polieren.

^(0[1-9]|[12]\d|3[01])\.(0[1-9]|1[012])\.((?:19|20)\d\d)$

Es hat immer noch falsch positive wie 31.02.1999 Daten

Answer 2

Versuchen Sie, diese Regex zu verwenden:

Es funktioniert für mich

^(?:(?:31(\/|-|\.)(?:0?[13578]|1[02]))\1|(?:(?:29|30)(\/|-|\.)(?:0?[1,3-9]|1[0-2])\2))(?:(?:1[6-9]|[2-9]\d)?\d{2})$|^(?:29(\/|-|\.)0?2\3(?:(?:(?:1[6-9]|[2-9]\d)?(?:0[48]|[2468][048]|[13579][26])|(?:(?:16|[2468][048]|[3579][26])00))))$|^(?:0?[1-9]|1\d|2[0-8])(\/|-|\.)(?:(?:0?[1-9])|(?:1[0-2]))\4(?:(?:1[6-9]|[2-9]\d)?\d{2})$ 

wenn Sie Textbox verwenden, dann jQuery masking

Answer 3

Der Grund ist es nur die ersten beiden Ziffern des Jahres zieht, ist, dass sie die einzigen, die in der dritten Erfassungsgruppe sind. Um dies zu beheben, können Sie einfach schließen die verbleibenden zwei Stellen in dem umschließenden dritten ():

(0[1-9]|[12][0-9]|3[01])\.(0[1-9]|1[012])\.(19|20)\d\d 
             ^ ^
(0[1-9]|[12][0-9]|3[01])\.(0[1-9]|1[012])\.(19\d\d|20\d\d) 
             ^   ^

See it in action

Rätsel gelöst.

---

das gesagt ist, wenn Sie mit unterschiedlichen Tagen pro Monat perfekt Validierung wollen, Schaltjahre und was nicht, lassen Sie mich Ihnen eine leichte Variation auf einem previous answer of mine. Fertig?

((?:0[1-9]|[12]\d|3[01])(?=\.(?:0[13578]|1[02]))|(?:0[1-9]|[12]\d|30)(?=\.(?:0[469]|11))|(?:0[1-9]|1\d|2[0-8]|29(?=\.\d{2}\.\d*(?:(?:(?!\d{2}00)(?=\d{2}(?:[13579][26]|[02468][048])))|(?=(?:[13579][26]|[02468][048])00))\d{4}(?!\d)))(?=\.02))\.(\d{2})\.(\d{4,}) 

Experiment yourself

Ah, die Menschheit!

Lange Geschichte kurz - ja, es ist in der Tat komplex. Lesen Sie die ursprüngliche Antwort, wenn Sie mehr Einsicht benötigen.

---

Alternativ können Sie den Weg kürzer (aber immer noch umständlich) Regex verwenden, die alles richtig, außer für Schaltjahre bestätigt:

((?:0[1-9]|[12]\d|3[01])(?=\.(?:0[13578]|1[02]))|(?:0[1-9]|[12]\d|30)(?=\.(?:0[469]|11))|(?:0[1-9]|1\d|2[0-9])(?=\.02))\.(\d{2})\.(\d{4,}) 

Experiment yourself