Question

I used JQuery UI date- and time picker on my website in a form. The user can choose the date, time and he can give some additional information. But for some reason, every time the user clicks on the text input for the additional information, the date- and time picker pop-up pops open… What is wrong?

And for the record, all is includes inside a php foreach-loop. Don’t know if it has something to do with it.

Date and time picker code:

<label class="labelx">Date: </td>
<input class="inputx" type="date" id="datepicker" name="datum" value=""></p>

<label class="labelx">Hour: </td>
<input class="inputx" type="text" id="timepicker" name="hour"></p>

<label class="labex">Title: </td>
<input class="inputx" type="text" id="title" name="titel"></p>

<label class="labex">Info: </td>
<input class="inputx" type="textfield" id="text" name="info"></p>

<input type="hidden" name="submitted" value="activitypost"/>
<input type="submit" name="submitted" class="verzend" value="Add"/>

JQuery:

<script>
    $j(function() {
        $j( "#datepicker" ).datepicker({ minDate: +0});
    });
</script>
<script>
    $j(function() {
        $j( "#timepicker" ).timepicker();
    });
</script>

Answer 1

Your labels are is not closing properly. Use them like this:

<label for="datepicker" class="labelx">Date: </label>

The for attribute references the id of your <input>.

Also, remember to close your inputs, like this:

<input class="inputx" type="date" id="datepicker" name="datum" value="" />

And that </p> is not necessary, you can remove them.

I got your code working here, except your timepicker, which is not from jQuery UI:
http://jsbin.com/iqiyiy/edit