CODEWITHSUNDEEP
javascriptjquerydatepickerjquery-validate
user3653365
user3653365

Reputation: 65

jquery datepicker - how to make readonly and required?

I am creating a form, the customer has requested an 'eventStart' and 'eventStop' range, they also want it to be required, and don't want anyone to be able to manually change the values.

I am using jquery datePicker and jquery validate.

I have it working one way or the other, but not both.

<input class="inputs" type="text" id="eventStart"  readonly/>
<input class="inputs" type="text" id="eventStop"  readonly/>

This works perfectly, the range works, and it cannot be manually edited.

<input class="inputs" type="text" id="eventStart"  required/>
<input class="inputs" type="text" id="eventStop"  required/>

This pops up the "! Please fill out this field", but allows the date to be manually edited.

If I put both, it allows the user to skip the field (no validation.)

Upvotes: 3

Views: 8554

Answers (2)

Ph Abd
Ph Abd

Reputation: 77

i have this workaround $nextmonth = date('Y-m-d 23:59:59',strtotime("+1 month")); and for input <input type="text" class="text-input" name="project_deadline" id="project_deadline" value="<?php echo $nextmonth ?>" readonly />

Upvotes: 0

James McDonnell
James McDonnell

Reputation: 3710

In this case if you add readonly and required and it bypasses validation your options are to implement your own validation or to hook form submit or the onclick action of your submit button.

Another option is to use required only. Then hook the keydown action and stop text entry.

$("#inputs").keydown(function (event) {
    event.preventDefault();
});

This will only stop text entry and is not secure. Sneaky people can still change the value if they want. Don't forget to validate field entry on the backend.

Upvotes: 3

Related Questions