He estado usando el selector de fecha plugin de jQuery UI. Quiero ser capaz de validar si el cuadro de texto de entrada está conectado a la actualidad tiene una fecha válida o no.

Por ejemplo:

Si alguien se decide a escribir en 02/30/2010 me gustaría ser capaz de alguna manera de pedir el plugin si que la entrada de corriente de valor es una fecha válida (que no es en este caso).

¿Alguien sabe cómo se puede hacer esto?

  • Estoy teniendo el mismo problema hoy en día. Estoy realmente sorprendido por la forma en la mitad del horno y incompletas todo en la interfaz de usuario jQuery, es que cada vez que trato de usarlo. Lo que una vasija de barro. 🙁
InformationsquelleAutor user169867 | 2010-06-30

6 Comentarios

  1. 8

    Usted puede resolver su problema haciendo clic en cuadro de texto de sólo lectura y de fijar el formato de fecha como te gusta. De manera que el Usuario no es capaz de escribir nada en el cuadro de texto, el usuario sólo seleccionar formato de fecha correcta(que juego) de selector de fecha. Por favor vea el ejemplo de abajo.

    <p>Date: <input type="text" id="datepicker" size="30" readonly="readonly"/></p>    
    <script>
    $(function() {
        $( "#datepicker" ).datepicker();
        $( "#datepicker" ).datepicker( "option", "dateFormat",'yy-mm-dd');
    });
    </script>
    • Esto es terriblemente usabilidad. Algunos usuarios prefieren escribir sus fechas de faff alrededor con un calendario!
  2. 4

    Es muy fácil

    let value = $(this).val();
    let format = $(this).datepicker('option', 'dateFormat');
    let valueIsValid = false;
    try {
        $.datepicker.parseDate(format, value);
        valueIsValid = true;
    }
    catch (e) {}
  3. 3

    Aunque esta pregunta es de casi dos años de edad, recientemente he tratado con una solución similar y encontró que el Globalizar de la biblioteca es el mejor enfoque. Por ejemplo, supongamos que usted tiene un cuadro de texto que tiene un jQueryUI selector de fecha adjunto. Cuando se pierde el enfoque en el cuadro de texto, puede utilizar Globalizar para validar el entró a la fecha. En este caso el cuadro de texto está vacío si la fecha es válida o poner en un formato estándar si la fecha es válida:

    $('#myDateTextBox').blur(function () {
        var parsedDate = Globalize.parseDate($(this).val());
        if (parsedDate == null) {
            $(this).val('');
        } 
        else {
            $(this).val(Globalize.format(parsedDate, 'd'));
        }

    La Globalize biblioteca le permite especificar una cultura (el uso de la lengua de la solicitud idealmente) por lo que el usuario puede introducir una fecha en el formato de su cultura.

    • No creo que el dateFormats por diversas culturas, incluso coinciden entre Globalizar y jQueryUi selector de fecha. En globalize.culture.fr-CA.js veo a un formato de fecha como esta: aaaa-MM-dd. En datepicker-fr-CA.js veo a un formato de fecha como esta: yy-mm-dd. No creo que el formato de fecha tokens son las mismas entre los dos. Cómo se escriben en mayúsculas, ‘M interpretado frente a minúsculas ‘m?
    • Me escribió una utilidad para generar el jQueryUI datepicker de archivos de localización para que juego con los formatos utilizados en Globalizar.
    • Ah bueno, eso tiene sentido. Buena idea. 🙂 Todavía me vuelve loco ¿por qué tokens de formato de fecha se interpretaría de forma incoherente. Sé momentJs espera de capital MMs mientras que jqueryUI Datepicker espera minúsculas mm del. Sería bueno tener un enfoque coherente…. o, al menos, algunos de los recursos que, en comparación con los tokens a través de diferentes software y mostró equivalentes.
  4. 0

    Vistazo a la dateFormat y constrainInput opciones del selector de fecha.
    http://jqueryui.com/demos/datepicker/#option-dateFormat

    • Yo no uso constrainInput porque quiero que la gente sea capaz de utilizar una barra o un guión como separador. Sin embargo, no veo cómo el uso de la que me permitiría saber si alguien entra en un día que no existe. Como Feb 30.
    • constraintInput no solucionar este problema en todos. Se me detiene la escritura de texto en el, no me deje de escribir «5».
    • podría ser vale la pena destacar, mientras que lo que usted menciona es correcto, constraintInput no impide cut & pegar texto en la entrada
  5. 0

    He añadido un «truedate» método para el validador. Me encantaría crédito quien código es este, pero no recuerdo donde la encontré.

    $.validator.addMethod("truedate", function (value) {
    function GetFullYear(year) {
    var twoDigitCutoffYear = 10 % 100;
    var cutoffYearCentury = 10 - twoDigitCutoffYear;
    return ((year > twoDigitCutoffYear) ? (cutoffYearCentury - 100 + year) : (cutoffYearCentury + year));
    }
    if (value == null || value == '')
    return true;
    var yearFirstExp = new RegExp("^\\s*((\\d{4})|(\\d{2}))([-/]|\\. ?)(\\d{1,2})\\4(\\d{1,2})\\.?\\s*$");
    try {
    m = value.match(yearFirstExp);
    var day, month, year;
    if (m != null && (m[2].length == 4)) {
    day = m[6];
    month = m[5];
    year = (m[2].length == 4) ? m[2] : GetFullYear(parseInt(m[3]));
    }
    else {
    var yearLastExp = new RegExp("^\\s*(\\d{1,2})([-/]|\\. ?)(\\d{1,2})(?:\\s|\\2)((\\d{4})|(\\d{2}))(?:\\s\u0433\\.)?\\s*$");
    m = value.match(yearLastExp);
    if (m == null) {
    return null;
    }
    day = m[3];
    month = m[1];
    year = (m[5].length == 4) ? m[5] : GetFullYear(parseInt(m[6]));
    }
    month -= 1;
    var date = new Date(year, month, day);
    if (year < 100) {
    date.setFullYear(year);
    }
    return (typeof (date) == "object" && year == date.getFullYear() && month == date.getMonth() && day == date.getDate()) ? date.valueOf() : null;
    }
    catch (err) {
    return null;
    }
    }, "Please enter an actual date.");
    $('form').validate({
    rules: {
    insurance_GL: "truedate",
    },
    messages: {
    insurance_GL: "Insurance GL date is not valid",
    }
    });

    EDITAR
    Me debe haber tomado de aquí:
    Jquery datepicker: validar la fecha mm/dd/aaaa

  6. -1

    Es posible usar JS Date para validar la fecha de la Cadena.

    var myDate = new Date(userInputString);
    if (myDate == "Invalid Date"){
    //user input is invalid
    }

    También tenga en cuenta que (myDate === "Invalid Date") devuelve false, incluso para fechas no válidas. Usando == funciona bien, sin embargo la forma correcta de verificación es (isNaN( d.getTime()))

Dejar respuesta

Please enter your comment!
Please enter your name here