Проблема с проверкой colorbox и jQuery в браузерах WebKit - PullRequest
0 голосов
/ 08 марта 2011

Я использую JQuery 1.4.2 с плагинами Colorbox (http://colorpowered.com/colorbox/) и Validation (http://bassistance.de/jquery-plugins/jquery-plugin-validation/)) в моем проекте. У меня проблема с Chrome (10.0.648.127 beta) и Safari (5.0.1) - содержимое моего модального окна не обновляется после проверки. Я имею в виду, что когда я ввожу неправильное значение в форму (которое находится в этом модальном окне) и проверяю его, сообщение об ошибке не появляется.Валидация работает, потому что я вижу в консоли, что метод valid () возвращает хорошие значения. И когда я закрываю свой модальный режим и открываю его снова (без обновления страницы), я вижу сообщение об ошибке. И, конечно, чтобы он исчез,Я должен ввести правильное значение, и снова закрыть и снова открыть мое модальное окно.

В Firefox 3.6.13, Opera 11.01 и IE9 RC все в порядке.

Мой код JS:

$.colorbox({
            width: 1000,
            scrolling: false,
            inline: true,
            href: '#userForm',
            onComplete: function() {
                $('#userForm').validate({
                    rules: {
                        name: {
                            minlength: 4,
                            required: true,
                            remote: "ajax/ajaxUsers.php?ajaxMode=userExists"
                        },
                        pass: {
                            minlength: 6,
                            required: true
                        },
                        pass_2: {
                            equalTo: "#i_pass"
                        },
                        email: "email"
                    },
                    messages:{
                        name: {
                            minlength: 'Nazwa użytkownika powinna mieć conajmniej {0} znaki',
                            required: "Nazwa użytkownika jest wymagana",
                            remote: "Ta nazwa jest już zajęta"
                        },
                        email: "Proszę wpisać prawidłowy adres email",
                        pass:{
                            minlength: 'Hasło powinno mieć conajmniej {0} znaków',
                            required: "Proszę wpisać hasło"
                        },
                        pass_2: "Proszę powtórz hasło z powyższego pola"
                    },
                    errorClass: "invalid",
                    errorElement: "em"
                });
            }
        });

Мой HTML:

<div class="hidden">
<div id="userFormDialog" class="dialog">
    <div class="dialogHeader">
        <h2 class="modalButton">Dodaj Nowego Użytkownika</h2>
    </div>
    <div class="dialogContent">
        <form class="adminForm" action="users.php?act=add" method="post" id="userForm">
            <div class="col1">
                <fieldset>
                    <legend>Dane podstawowe:</legend>
                    <p><label for="i_name">Nazwa użytkownika*</label><input type="text" name="name" id="i_name" placeholder="Nazwa użytkownika" autofocus></p>

                    <p><label for="i_fullname">Pełna nazwa</label><input type="text" name="fullname" id="i_fullname" placeholder="Pełna nazwa"></p>

                    <p><label for="i_email">Adres email</label><input type="email" name="email" id="i_email" placeholder="Adres email"></p>

                    <p><input type="checkbox" name="status" id=i_status><label for="i_status">Aktywny?</label></p>
                </fieldset>
                <fieldset>
                    <legend>Autoryzacja</legend>
                    <p><label for="i_pass">Hasło*</label><input type="password" name="pass" id="i_pass" placeholder="Hasło"></p>

                    <p><label for="i_pass_2">Powtórz hasło*</label><input type="password" name="pass_2" id="i_pass_2" placeholder="Powtórz hasło"></p>
                </fieldset>
            </div>
            <div class="col2">
                <fieldset>
                    <legend>Dostęp do Fotoware</legend>
                    <p><label for="i_fw_u">Użytkownik Fotoware</label><input type="text" name="fw_u" id="i_fw_u" placeholder="Użytkownik Fotoware"></p>

                    <p><label for="i_fw_p">Hasło Fotoware</label><input type="password" name="fw_p" id="i_fw_p" placeholder="Hasło Fotoware"></p>
                </fieldset>
                <fieldset class="accessLevel">
                    <legend>Poziom dostępu</legend>
                    <label for="i_level">Wybierz poziom dostępu</label><select name="level" id="i_level">
                {foreach $userLevels as $level}
                    <option value="{$level@key}">{$level}</option>
                {/foreach}
                </select>
                    <ul>
                    {foreach $userPermissions as $perm}
                        <li><input type="checkbox" name="permissions[]" id="i_permissions"
                                   value="{$perm@key}"><label
                                for="i_permissions">{$perm}</label></li>
                    {/foreach}
                    </ul>
                </fieldset>
            </div>
        </form>
        Pola oznaczone gwiazdka są obowiązkowe.
    </div>
    <div class="dialogFooter">
        <button class="modalButton" id="submitUserButton">
            Zapisz
        </button>
        <button class="modalButton closeDialog">
            Anuluj
        </button>
    </div>
</div>

Есть идеи, почему так происходит?

Ответы [ 2 ]

0 голосов
/ 09 марта 2011

попробуйте войти в селектор, использованный для добавления сообщения об ошибке

, как сказал Funky Dude, пахнет как проблема с множеством #id

0 голосов
/ 09 марта 2011

может иметь отношение к тому, что вы создаете другую форму с тем же идентификатором (#userForm) при первом вызове colorbox.я бы предложил поставить colorbox в режиме iframe.

...