Question

I have a custom validator for a specific date control. The control renders three dropdowns for day, month, and year.

The function works fine with Firefox, Chrome, and IE9/10. It fails on the iPad browser. I tried debugging using Adbode Edge Inspect but couldn’t debug the javascript.

Here is my code. Any suggestions?

$.validator.addMethod("validcustomdateday", function (value, element) {

    var elementName = $(element).attr("Id");
    var day = value.length === 1 ? "0" + value : value;
    var month = $("#" + elementName.substr(0, elementName.lastIndexOf("_")) + "_Month").val();
    month = month.length === 1 ? "0" + month : month;
    var year = $("#" + elementName.substr(0, elementName.lastIndexOf("_")) + "_Year").val();

    var dateStr = year + "-" + month + "-" + day;
    return !isNaN(Date.parse(dateStr));

});

Here are the rendered controls

<div class="control-group offset2 span6">
                <label class="control-label" for="Solicitors___0__DateOfBirth">Fecha de Nacimiento</label>
                <div class="controls">

<input id="Solicitors___0__DateOfBirth_DateOfBirth" name="Solicitors()[0].DateOfBirth.DateOfBirth" type="hidden" value="">
<select class="input-mini" data-bind="value: Solicitors()[0].DateOfBirth.Day" data-val="true" data-val-number="The field Dia must be a number." data-val-required="Debe especificar el Día" data-val-validcustomdateday="Se debe especificar una fecha válida" id="Solicitors___0__DateOfBirth_Day" name="Solicitors()[0].DateOfBirth.Day" placeholder="Dia"><option selected="selected">1</option>
<option>2</option>
<!-- Other days go here -->
<option>31</option>
</select>
<select class="input-small" data-bind="value: Solicitors()[0].DateOfBirth.Month" data-val="true" data-val-number="The field Mes must be a number." data-val-required="Debe especificar el Mes" id="Solicitors___0__DateOfBirth_Month" name="Solicitors()[0].DateOfBirth.Month"><option selected="selected" value="1">Enero</option>
<option value="2">Febrero</option>
<option value="3">Marzo</option>
<option value="4">Abril</option>
<option value="5">Mayo</option>
<option value="6">Junio</option>
<option value="7">Julio</option>
<option value="8">Agosto</option>
<option value="9">Septiembre</option>
<option value="10">Octubre</option>
<option value="11">Noviembre</option>
<option value="12">Diciembre</option>
</select>
<select class="span1" data-bind="value: Solicitors()[0].DateOfBirth.Year" data-val="true" data-val-number="The field Año must be a number." data-val-required="Debe especificar el Año" id="Solicitors___0__DateOfBirth_Year" name="Solicitors()[0].DateOfBirth.Year"><option value="1993">1993</option>
<option value="1992">1992</option>
<!-- Full Year List goes here -->
<option value="1937">1937</option>
</select>
<span class="help-inline field-validation-valid" data-valmsg-for="Solicitors()[0].DateOfBirth.Day" data-valmsg-replace="true"></span>
<span class="help-inline field-validation-valid" data-valmsg-for="Solicitors()[0].DateOfBirth.Month" data-valmsg-replace="true"></span>
<span class="help-inline field-validation-valid" data-valmsg-for="Solicitors()[0].DateOfBirth.Year" data-valmsg-replace="true"></span>
                    <span class="field-validation-valid help-inline" data-valmsg-for="Solicitors()[0].DateOfBirth" data-valmsg-replace="true"></span>
                </div>
            </div>

Answer 1

Fixed by changing Date.parse(“1993-01-01”) to Date.parse(“1993/01/01”). All safari browsers were failing to recognize the first string as a valid date