Плагин jQuery Form и jQuery DatePicker не работают вместе - PullRequest
Новая
       5

Плагин jQuery Form и jQuery DatePicker не работают вместе

1 голос
/ 22 сентября 2011

Я пытаюсь использовать плагин формы jQuery. Я использую пример JSON здесь .

По какой-то причине средства выбора даты не отображаются на странице, когда я использую плагин jQuery Form. В моем файле jquery у меня есть: 

jQuery.noConflict();

jQuery(document).ready(function($) {


    $('#csf_map_form').ajaxForm(function() {
        dataType: 'json',
        success: process_json
    });


    function process_json(data) {
        alert(data.csf_map_offense_group1);
    }



    $('#csf_map_start_date').datepicker({

        dateFormat : 'mm/dd/yy',
        yearRange : '2011:2011',
        changeMonth: true,
        changeYear: true,
        defaultDate : new Date(2011, 8-1,1),
        minDate : new Date(2011, 1-1,1),
        maxDate : new Date(2011, 8-1, 25)

    });



     $('#csf_map_end_date').datepicker({
        dateFormat : 'mm/dd/yy',
        yearRange : '2011:2011',
        changeMonth: true,
        changeYear: true,
        defaultDate : new Date(2011, 8-1, 25),
        minDate : new Date(2011, 1-1,1),
        maxDate : new Date(2011, 8-1, 25)

    });

});

В моем php-файле форма выглядит так: 

 //start form
        $output .= '<form id="csf_map_form" action="path-to-file/csf_map_form_handler.php" method="post" >'; 


    //1st datepicker
            $output .= '<div>';
            $output .= '<label for="csf_map_start_date">Start Date:</label>';
            $output .= '<div id="csf_map_start_date"  style="font-size: 10px;"></div>';
            $output .= '</div>';

    //2nd datepicker    
            $output .= '<div>';
            $output .= '<label for="csf_map_end_date">End Date:</label>';
            $output .= '<div id="csf_map_end_date"  style="font-size: 10px;"></div>';             
            $output .= '</div>';  

 //radio button group div           
            $output .= '<div style="float: left; width: 150px; margin: auto; padding-left: 20px; ">'; 
            $output .= '<label for="csf_map_group1">Select Offense:</label><br />';
            $output .=  '<input type="radio" name="csf_map_group1" checked="checked" value="TINY">Tiny</input><br />';  
            $output .=  '<input type="radio" name="csf_map_group1" value="MEDIUM"/>Medium</input><br />';
            $output .=  '<input type="radio" name="csf_map_group1" value="LARGE">Large</input><br />';
            $output .= '</div>'; //end radiobuttons

            $output .='<input type="submit" value="Submit" />';

            $output .=  '</form>';

По какой-то причине ajaxForm конфликтует с указателем даты. Если я закомментирую функцию, начинающуюся с $ ('csf_map_form'). AjaxForm и функцию process_json, тогда средства выбора даты в форме будут работать нормально. Если я не прокомментирую их, тогда не появятся списки даты. Но предупреждение срабатывает при нажатии кнопки «Отправить». Он предупреждает о том, что было выбрано в радиокнопке.

Есть идеи относительно того, что происходит? Как мне заставить их играть красиво? Какую ошибку я делаю?

Спасибо.

1 Ответ

2 голосов
/ 22 сентября 2011

Ура, я понял это.

1) Я изменил встроенные указатели даты на значения по умолчанию - заменил div на указателях даты.

2) Я пропустил '#' в $ ('# csf_map_form').

3) В файле csf_map_form_handler.php я возвращал только одну часть информации формы.Когда я изменил его, чтобы вернуть даты начала и окончания и выбор радиокнопки, это сработало.

Спасибо.

...