Модераторы: Sardar, Aliance
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Выделить только K чекбоксов из N. При выделении, последнего - остальный блокируються. 
V
    Опции темы
Sunvas
Дата 4.11.2007, 01:27 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Соль и сахар
****


Профиль
Группа: Участник
Сообщений: 3388
Регистрация: 12.3.2006
Где: Тосно

Репутация: нет
Всего: 89
Собсно нужно создать опрос, где можно было бы выделить только K чекбоксов из N (число K должно как-то передаваться браузеру, а N чексбоксов генерирует скрипт).
Нашел тему http://forum.vingrad.ru/forum/topic-152162.html, но мне необходимо, чтобы при выделении последнего чекбокса - остальные блокировались.  smile 


--------------------
Воспитывая детей по своему образу и подобию, родители почему-то надеются, что они будут лучше их.
PM MAIL   Вверх
vasac
Дата 4.11.2007, 10:50 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
***


Профиль
Группа: Завсегдатай
Сообщений: 1060
Регистрация: 4.5.2006

Репутация: 13
Всего: 36
Примерно так:
Код

<div id="chb">
    <div>выбрано: <span id="chs" style="font-weight:bold">0</span> (максимально: <span id="chsk">3</span>)</div>
    <input type="checkbox" value="1" />
    <input type="checkbox" value="1" />
    <input type="checkbox" value="1" />
    <input type="checkbox" value="1" checked="checked" />
    <input type="checkbox" value="1" />
    <input type="checkbox" value="1" />
    <input type="checkbox" value="1" />
</div>

Код

(function () {
    var K = parseInt(document.getElementById("chsk").firstChild.nodeValue);
    var Q_SELECT = 0;
    var blocked  = false;
    var inputs = document.getElementById("chb").getElementsByTagName("input")
    for (var i = 0; i < inputs.length; i++) {
        var input  = inputs.item(i);
        if (input.getAttribute("type") != "checkbox") {
            continue;
        }
        if (input.checked) {
            Q_SELECT++;
        }
        input.onclick = (
            function(e) {
                if (this.checked) {
                    Q_SELECT++;
                } else {
                    Q_SELECT--;
                }
                isBlock();
                return true;
            }
        );
    }
    isBlock();
    function isBlock() {
        document.getElementById("chs").firstChild.nodeValue = Q_SELECT;
        var dis = (Q_SELECT >= K);
        if ((dis && blocked) || ((!dis) && (!blocked))) {
            return true;
        }
        blocked = dis;
        for (var i = 0; i < inputs.length; i++) {
            var input = inputs.item(i);
            if ((input.getAttribute("type") == "checkbox") && (!input.checked)) {
                input.disabled = dis;
            }
        }
        return true;
    }
})();



--------------------
Блог ГО | Таблица символов юникода
PM WWW   Вверх
Sunvas
Дата 4.11.2007, 11:57 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Соль и сахар
****


Профиль
Группа: Участник
Сообщений: 3388
Регистрация: 12.3.2006
Где: Тосно

Репутация: нет
Всего: 89
vasac, че-то не работает..


--------------------
Воспитывая детей по своему образу и подобию, родители почему-то надеются, что они будут лучше их.
PM MAIL   Вверх
ksnk
Дата 4.11.2007, 19:34 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


прохожий
****


Профиль
Группа: Комодератор
Сообщений: 6855
Регистрация: 13.4.2007
Где: СПб

Репутация: 84
Всего: 386
Цитата(Sunvas @  4.11.2007,  11:57 Найти цитируемый пост)
че-то не работает

А у меня в IE и FF последнем все работает... Какие симптомы? Отладку какую-то удалось провести?

P.S. Функцию необходимо разместить в методе onLoad странички 

Это сообщение отредактировал(а) ksnk - 4.11.2007, 21:10


--------------------
Человеку свойственно ошибаться, программисту свойственно ошибаться профессионально ! user posted image
PM MAIL WWW Skype   Вверх
Sunvas
Дата 4.11.2007, 21:13 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Соль и сахар
****


Профиль
Группа: Участник
Сообщений: 3388
Регистрация: 12.3.2006
Где: Тосно

Репутация: нет
Всего: 89
Так. В опере работает. Это хорошо.
А как лучше поступить, если таких дивов (с чекбоксами) может быть два и больше?


--------------------
Воспитывая детей по своему образу и подобию, родители почему-то надеются, что они будут лучше их.
PM MAIL   Вверх
vasac
Дата 6.11.2007, 08:12 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
***


Профиль
Группа: Завсегдатай
Сообщений: 1060
Регистрация: 4.5.2006

Репутация: 13
Всего: 36
Сделать мою анонимную функцию не анонимной, получающей аргументом id слоя с чекбоксами. Вызвать для каждого нужного слоя.


--------------------
Блог ГО | Таблица символов юникода
PM WWW   Вверх
Sunvas
Дата 6.11.2007, 13:59 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Соль и сахар
****


Профиль
Группа: Участник
Сообщений: 3388
Регистрация: 12.3.2006
Где: Тосно

Репутация: нет
Всего: 89
vasac,  smile 
Мои познания в JS стремяться к 0.


--------------------
Воспитывая детей по своему образу и подобию, родители почему-то надеются, что они будут лучше их.
PM MAIL   Вверх
pompei
Дата 6.11.2007, 14:42 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 155
Регистрация: 7.9.2007

Репутация: 1
Всего: 6
Вот работает везде:
Код

<HTML>
<HEAD>
    <Title> You cannot select more than 3 </Title>
<script Language="JavaScript">

var checkboxes = [];
var selectedElements = 0;

function clickOnCheckbox( checkbox ) {
    if (checkbox.checked) selectedElements++; else selectedElements--;
    for (var i = 0; i < checkboxes.length; i++) {
        var cb = checkboxes[i];
        if (!cb.checked) {
            cb.disabled = selectedElements >= 3;
        }
    }
}

function pageLoaded() {
    checkboxes.push( document.getElementById( "chbox01" ) );
    checkboxes.push( document.getElementById( "chbox02" ) );
    checkboxes.push( document.getElementById( "chbox03" ) );
    checkboxes.push( document.getElementById( "chbox04" ) );
    checkboxes.push( document.getElementById( "chbox05" ) );
    checkboxes.push( document.getElementById( "chbox06" ) );
    checkboxes.push( document.getElementById( "chbox07" ) );
    checkboxes.push( document.getElementById( "chbox08" ) );
    checkboxes.push( document.getElementById( "chbox09" ) );
    checkboxes.push( document.getElementById( "chbox10" ) );
    checkboxes.push( document.getElementById( "chbox11" ) );
    checkboxes.push( document.getElementById( "chbox12" ) );
    checkboxes.push( document.getElementById( "chbox13" ) );
    checkboxes.push( document.getElementById( "chbox14" ) );
}

</Script>
</HEAD>
<BODY onload="pageLoaded();">
    <H1>You cannot select more than 3</H1>
    
    Checkbox 01 <input type="checkbox" id="chbox01" onclick="clickOnCheckbox( this );" /> <br/>
    Checkbox 02 <input type="checkbox" id="chbox02" onclick="clickOnCheckbox( this );" /> <br/>
    Checkbox 03 <input type="checkbox" id="chbox03" onclick="clickOnCheckbox( this );" /> <br/>
    Checkbox 04 <input type="checkbox" id="chbox04" onclick="clickOnCheckbox( this );" /> <br/>
    Checkbox 05 <input type="checkbox" id="chbox05" onclick="clickOnCheckbox( this );" /> <br/>
    Checkbox 06 <input type="checkbox" id="chbox06" onclick="clickOnCheckbox( this );" /> <br/>
    Checkbox 07 <input type="checkbox" id="chbox07" onclick="clickOnCheckbox( this );" /> <br/>
    Checkbox 08 <input type="checkbox" id="chbox08" onclick="clickOnCheckbox( this );" /> <br/>
    Checkbox 09 <input type="checkbox" id="chbox09" onclick="clickOnCheckbox( this );" /> <br/>
    Checkbox 10 <input type="checkbox" id="chbox10" onclick="clickOnCheckbox( this );" /> <br/>
    Checkbox 11 <input type="checkbox" id="chbox11" onclick="clickOnCheckbox( this );" /> <br/>
    Checkbox 12 <input type="checkbox" id="chbox12" onclick="clickOnCheckbox( this );" /> <br/>
    Checkbox 13 <input type="checkbox" id="chbox13" onclick="clickOnCheckbox( this );" /> <br/>
    Checkbox 14 <input type="checkbox" id="chbox14" onclick="clickOnCheckbox( this );" /> <br/>
    
</BODY>
</HTML>


Копи пасте и готово!!!!


Это сообщение отредактировал(а) pompei - 6.11.2007, 14:48
--------------------
А всё оказывается гораздо проще: пассивные наноструктуры - активные наноструктуры - системы наносистем - молекулярные наносистемы - сингулярность! По пять лет на каждый этап.
PM MAIL   Вверх
vasac
Дата 6.11.2007, 15:36 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
***


Профиль
Группа: Завсегдатай
Сообщений: 1060
Регистрация: 4.5.2006

Репутация: 13
Всего: 36
pompei, прочитайте всё тему и последний вопрос.

Sunvas,
Код

(function () {
    var K = parseInt(document.getElementById("chsk").firstChild.nodeValue);
    var Q_SELECT = 0;
    var blocked  = false;
    var inputs = document.getElementById("chb").getElementsByTagName("input")
    ...
    }
})();


заменить на:

Код

function func(id, K) {
    var Q_SELECT = 0;
    var blocked  = false;
    var inputs = document.getElementById(id).getElementsByTagName("input")
    ...
}


Вызвать для каждого слоя, указывая их idы:
Код

func("id1", 3);
func("id2", 3);
func("id3", 7);


И, возможно, будет работать smile


--------------------
Блог ГО | Таблица символов юникода
PM WWW   Вверх
Sunvas
Дата 6.11.2007, 19:44 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Соль и сахар
****


Профиль
Группа: Участник
Сообщений: 3388
Регистрация: 12.3.2006
Где: Тосно

Репутация: нет
Всего: 89
vasac, спасибо. Ответ исчерпывающий.


--------------------
Воспитывая детей по своему образу и подобию, родители почему-то надеются, что они будут лучше их.
PM MAIL   Вверх
  
 Ответ в темуСоздание новой темы Создание опроса
Форум для вопросов, которые имеются в справочниках, но их поиск вызвал затруднения, или для разработчика требуется совет или просьба отыскать ошибку. Напоминаем: 1) чётко формулируйте вопрос, 2) приведите пример того, что уже сделано, 3) укажите явно, нужен работающий пример или подсказка о том, где найти информацию.
 
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | JavaScript: Общие вопросы | Следующая тема »

Подписаться на тему | Подписка на этот форум | Скачать/Распечатать тему


 




[ Время генерации скрипта: 0.0678 ]   [ Использовано запросов: 22 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
 По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.