Question

Im using the following code to add a date selection widget to my page.

    <script type='text/javascript' src='http://code.jquery.com/jquery-1.8.2.js'></script>
    <script type='text/javascript' src="http://twitter.github.com/bootstrap/assets/js/bootstrap.min.js"></script>
        <script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script>
        <script type="text/javascript">
        $(function datewidget() {
        $( "#datepicker" ).datepicker({
            dateFormat : 'dd/mm/yy',
            changeMonth : true,
            changeYear : true,
            yearRange: '-100y:c+nn',
            maxDate: '-1d'
        });
    $('#datepicker').live("change", function() {
        datewidget();
        });
    });

This function is then being applied to my input fields within my html as you can see below,

<div class="span12">
                <form method="post" name="bdayInputFormMain" action="/bdayremind_maininput/" class="form-inline">
                {% csrf_token %}
                        <input name="name" type="text" class="input-medium" placeholder="Name">
                        <input name="dob" type="text" class="input-small" placeholder="Date of Birth" id="datepicker">
                        <input name="anni" type="text" class="input-small" placeholder="Anniversy" id="datepicker">
                        <input name="name" type="text" class="input-xlarge" placeholder="Address">
                        <button type="submit" class="btn">Update</button>
                </form>

However the problem is the date selection widget only opens when I click on the Date of Birth field.

Thanks,

Answer 1

a class was used instead which resolved the issue….