динамически добавлять несколько JQuery UI DatePickers на страницу - PullRequest
Новая
       26

динамически добавлять несколько JQuery UI DatePickers на страницу

2 голосов
/ 01 июля 2010

У меня есть форма, которая изначально загружается с одним средством выбора даты из jquery-ui.Затем пользователь может нажать «Добавить», чтобы добавить больше дат.Эти новые поля даты должны добавляться в DOM, но, видимо, нет.Я знаю, что мне нужно или нужно использовать .live () или .bind (), но у меня возникли проблемы с лучшим способом сделать это.Ниже приведен код, который у меня есть.Спасибо за любые идеи. 

        // add a formfield
    function addFormField() {
        var id = document.getElementById("DateID").value;                       

        // add date form to page
        $("td#dateDiv").append("<p id='row" + id + "'> Calendar Dates " + id + " <br> <input type='text' size='20' class='hasDatepicker' name='inputDate[]' id='inputDate" + id + "'>&nbsp;&nbsp<a href='#' onClick='removeFormField(\"#row" + id + "\"); return false;'>Remove</a><p>");

        $('#row' + id).highlightFade({
            speed:1000
        });

        id=(id-1) + 2;
        document.getElementById("DateID").value = id;
    }

    function removeFormField(id) {
        $(id).remove();
    }       

    $("#addDate").live("click", function(){
          addFormField();
    });

1 Ответ

3 голосов
/ 01 июля 2010

Сначала убедитесь, что ваша функция addFormField фактически вставляет новое поле в форму. Затем назовите .datepicker(); для любых новых полей.

Внутри addFormField: 

$("td#dateDiv").append(...

$("td#dateDiv").find(".hasDatepicker").datepicker();
...