Получить отмеченный checkbox, убрать неотмеченный

[fortuner]

Всем доброго дня!
Есть такая штука:
В форме, которая подгружается аяксом, есть чекбоксы. Имя каждого отмеченного чекбокса передается в текстовый input

<input type="text" id="selected_orders" name="selected_orders" class="hidden" value=""></input>

таким кодом:

<script type="text/javascript">
    var selected = [];
        $(".order_checkbox#'.$order['order_infos'
        ['id_order'].'").click(function() {
    if($(this).is(":checked"))
    {
       selected.push($(this).attr("name"));
       $("input#selected_orders").attr("value", selected.join(";"));
       $("span#checked_helper").text(selected.join("; "));
    }
    else
    {
        ..... // Как убрать имя чекбокса из input, если он не отмечен?
    }
});
</script>';

Как проверить, если имя чекбокса уже есть в input? Сейчас получается так, что если поставил галку, потом снял, а потом снова поставил, то имя добавляется два раза.
И самое главное: Как убрать имя чекбокса из input, если он не отмечен?

 

[alex_me]

Убрать - с помощью split

Примерно так
Для просмотра ссылки Войди или Зарегистрируйся

 

[fortuner]

Убрать - с помощью split

Примерно так
Для просмотра ссылки Войди или Зарегистрируйся

Спасибо гигантское!
Можно еще один нубксий вопрос по JS?
Там форма загружается аяксом, наверное поэтому скрипт не видит чекбоксы. Есть ли способ это побороть? Что-нибудь в духе document.ready?

 

[alex_me]

Скрипт поместить в объект:

                function app() {}          
                app.prototype = {
                    chkEvent: function () {
                        $(".chk").change(function (event) {
                             ......
                        });
                    },
                    myProperty1: 'World',
                    myFunction2: function () {
                        console.log('Hello');
                    },
                    myFunction3: function () {
                        console.log(this.myProperty1);
                    },
                };

                var $app = new app();

Этот код можно подгружать как библиотеку в отдельном файле или просто в <script></script>
но не внутри document ready, иначе объект $app не будет виден в других объектах

Далее, в document ready или другом объекте вызываем нужные методы $app.

$(function () {

                $app.chkEvent();
                $app.myFunction2();
                $app.myFunction3();

});

При вызове $app.chkEvent() в другом объекте событие прицепится к чекбоксам.
Если есть возможность поменять сам ajax запрос, то $app.chkEvent() нужно добавить в success или done:
Для просмотра ссылки Войди или Зарегистрируйся

            $.ajax({
                ....
                success: function () {
                     $app.chkEvent();
                },
               ....
            });

Или же прицепить, перехватив success в $app:
Для просмотра ссылки Войди или Зарегистрируйся

Для этого в прототип app добавляем метод attachAjax и вызываем его в on document ready

              function app() {}
                app.prototype = {
                    attachAjax: function () {
                        var self = this;
                        $(document).ajaxSuccess(function (event, xhr, settings) {
                            self.chkEvent();
                        });
                    },
                    chkEvent: function () {
                        ......
                    },

                };
                var $app = new app();
....

$(function () {
                $app.attachAjax();
});

Если на странице несколько ajax вызовов, желательно проверять xhr и settings перед вызовом self.chkEvent();

 

[fortuner]

Скрипт поместить в объект:

                function app() {}         
                app.prototype = {
                    chkEvent: function () {
                        $(".chk").change(function (event) {
                             ......
                        });
                    },
                    myProperty1: 'World',
                    myFunction2: function () {
                        console.log('Hello');
                    },
                    myFunction3: function () {
                        console.log(this.myProperty1);
                    },
                };

                var $app = new app();

Этот код можно подгружать как библиотеку в отдельном файле или просто в <script></script>
но не внутри document ready, иначе объект $app не будет виден в других объектах

Далее, в document ready или другом объекте вызываем нужные методы $app.

$(function () {

                $app.chkEvent();
                $app.myFunction2();
                $app.myFunction3();

});

При вызове $app.chkEvent() в другом объекте событие прицепится к чекбоксам.
Если есть возможность поменять сам ajax запрос, то $app.chkEvent() нужно добавить в success или done:
Для просмотра ссылки Войди или Зарегистрируйся

            $.ajax({
                ....
                success: function () {
                     $app.chkEvent();
                },
               ....
            });

Или же прицепить, перехватив success в $app:
Для просмотра ссылки Войди или Зарегистрируйся

Для этого в прототип app добавляем метод attachAjax и вызываем его в on document ready

              function app() {}
                app.prototype = {
                    attachAjax: function () {
                        var self = this;
                        $(document).ajaxSuccess(function (event, xhr, settings) {
                            self.chkEvent();
                        });
                    },
                    chkEvent: function () {
                        ......
                    },

                };
                var $app = new app();
....

$(function () {
                $app.attachAjax();
});

Если на странице несколько ajax вызовов, желательно проверять xhr и settings перед вызовом self.chkEvent();

Это гениально! Все работает! Огромное вам спасибище! Вы действительно очень помогли, можно вам на пару пива скинуть?
Добавлю это сообщение в избранные, чтобы не потерять
Кстати, можно передать значение переменной из php в javascript? Например:
Вот переменная, она возвращает урл скрипта:

$ajax_url = $this->context->link->getAdminLink('AdminModules').'&configure='.$this->name;

Вот так я ее вызываю сейчас, прямо в файле php:

<script type="text/javascript">
     $.ajax({
          url: \'' . $ajax_url . '\', /* Это адрес скрипта php, в котором написана функция AJAX */
          data:
          {
                ajax: true,
                action: \'SearchOrder\',
                id_order: obj.attr(\'id_order\'),
                search: obj.val()
          },
         // ... Ну и тд.
</script>

Тут все работает прекрасно, а как известно, если работает - не трогай
Но можно ли и стоит ли заморачиваться тем чтобы передать эту $ajax_url в javascript? Он просто вызывается в нескольких местах таким же образом. А хочется держать пыху отдельно, джаваскрипт отдельно.
ПС. Сейчас набегут модераторы и забанят меня за то, что я сказал "спасибо".

 

[alex_me]

На пиво не надо )
Если скрипт вызова аякса встроен в верстку, то проще передать напрямую переменной

<script>
     $.ajax({
          url: '<?= $ajax_url; ?>',
            .....
     });
</script>

А если из внешнего файла, то переменную можно вложить в любой элемент верстки, включая скрипт

// В скрипте

<script>  
         var ajax_url = '<?= $ajax_url; ?>';
// но лучше как свойство $app
         $app.ajax_url = '<?= $ajax_url; ?>';
</script>


// В атрибуте элемента
<body data-ajax-url="<?= $ajax_url; ?>">
...
<body>

// В метатеге
<head>
    <meta name="ajax-url" content="<?= $ajax_url; ?>" />
</head>

// в js файле ..

$(function () {
        var ajax_url = $('body').attr('data-ajax-url');
// или
        var ajax_url = $('meta[name="ajax-url"]').attr('content');

     $.ajax({
          url: ajax_url,
            .....
     });

});

Еще один вариант - через куки, но это не так удобно. Они в принципе для того, чтобы передавать ИЗ js в php.

Вставка скрипта в верстку - нормально, в модульных CMS это сплошь и рядом
Но желательно, чтоб этот код запускал какой-нибудь js-модуль с передачей ему параметров