Модератор форума: JonMagon |
Сообщество uCoz » Вебмастеру » JavaScript, Flash и прочие технологии » JavaScript » Подскажите JS скрипт для блокировки кликабельности кнопки. |
Подскажите JS скрипт для блокировки кликабельности кнопки. |
Всем привет.
В общем есть каталог файлов, при добавлении материалов есть фильтр. В фильтре нужно выбирать качество фильма DVDrip, HDrip, BDrip и.т.д Качество нужно указывать обязательно, значить по идеи в настройках я должен поставить галачку возле этого фильтра "обязательно к заполнению" Но... В каталог добавляются не только фильмы, а ещё и игры, софт и другое. В общем нужен JS скрипт, который я оберну в условие для категории с фильмами, типа пока не выбрать в фильтре качество кнопка "добавить" будет не кликабильна. Вот сам фильтр Код <select id="ldF21" class="manFlFlt1" name="filter1" size="1"> <option style="color:#A3A3A3" value="0">- выбрать - </option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select> Вот кнопка добавления, которую нужно блокировать. Код <input id="ldF18" class="manFlSbm" type="button" onclick="document.getElementById('doSmbBt').click();document.getElementById('brief').value = document.getElementById('message').value; return !1;" value="Опубликовать"></input> Добавлено (19 Окт 2013, 15:13:40) Код <input type="checkbox" value="1" name="rule" onclick="check_rule();"></input> Код <script>function check_rule(){if (document.adduser.rule.checked==true){document.getElementById('ldF18').disabled=false;}else {alert('Вы должны выбрать качество фильма');document.getElementById('ldF18').disabled=true;}}</script> |
Вот:
Код <script> function TheSelChange() { if(document.getElementById('ldF21').value == 0) { document.getElementById('ldF18').setAttribute('disabled', 'disabled'); } else { document.getElementById('ldF18').removeAttribute('disabled'); } } </script> <select id="ldF21" class="manFlFlt1" name="filter1" size="1" onchange='TheSelChange();'> <option style="color:#A3A3A3" value="0">- выбрать -</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select> <input id="ldF18" class="manFlSbm" type="button" disabled='disabled' onclick="document.getElementById('doSmbBt').click();document.getElementById('brief').value = document.getElementById('message').value; return !1;" value="Опубликовать"></input> Сообщение отредактировал Burgem - Суббота, 19 Окт 2013, 16:03:10
|
|
Код <script> $(document).ready(function() { $('#ldF18').attr('disabled','disabled'); $('#ldF21').change(function(){ if( $(this).val() > 0){ $('#ldF18').removeAttr('disabled'); }else{ $('#ldF18').attr('disabled','disabled') } }); }); </script> Скрипт, после загрузки документа делает кнопку неактивной. Можно делать невидимой через стили, и при выборе нужного пункта добавить эффект появления. Все в твоих руках Можешь забрать этот код и вставить его себе, сам знаешь куда.
|
теперь можешь
Код <script type="text/javascript"> //Делаеть кнопку disabled по умолчанию document.getElementById('ldF18').disabled = 'disabled'; //Добавляеть в select onchange' (function(){ var __e = document.querySelector('#addEntForm select[name="filter1"]'); if ( __e ) { __e.setAttribute('onchange','TheSelChange()'); } })(); //И сама функция function TheSelChange() { if(document.getElementById('ldF21').value == '1') { document.getElementById('ldF18').setAttribute('disabled', 'disabled'); } else { document.getElementById('ldF18').removeAttribute('disabled'); } } </script> Добавлено (20 Окт 2013, 11:50:07) |
Head-Mad, Burgem, ребятки, я очень благодарен вам обеим за помощь, но оба варианта почему-то не работают, ни первый ни второй не блокируют кнопку добавления материала.
Скрипты пробовал ставить и в хед, и перед $BODY$ или после $BODY$, результата ноль, как будто ни каких скриптов и не ставил( Добавлено (20 Окт 2013, 13:34:40) Сообщение отредактировал Rad_van_Cor - Воскресенье, 20 Окт 2013, 13:31:02
|
во первых, не а, обоим
во вторых по умолчанию кнопка disabled? за это отвечает код Код document.getElementById('ldF18').disabled = 'disabled'; и последнее, надо проверить значение Код document.getElementById('ldF21').value == '1' Добавлено (20 Окт 2013, 14:23:51) Код alert(document.getElementById('ldF21').value); Например, в твоем случае будет "- выбрать -" и измени код проверки вот так Код document.getElementById('ldF21').value == '- выбрать -' Сообщение отредактировал Burgem - Воскресенье, 20 Окт 2013, 14:12:21
|
прошу прощение.
Нет, не disabled, скрипт почему-то не добавляет это значение кнопки Но селекту приписывает onchange куда в какую часть скрипта дописать "alert(document.getElementById('ldF21').value);" не знаю, я просто в JS не силён. Сообщение отредактировал Rad_van_Cor - Воскресенье, 20 Окт 2013, 14:48:54
|
...и по моему это в коде лишнее
если конечно сам добавил код. Зачем скрывать, если будешь делать disabled? Прикрепления:
9834559.png
(100.7 Kb)
|
Burgem, и так, alert выдаёт - "0"
disabled по прежнему не присваивается. Код <input id="doSmbBt" type="submit" style="display:none;"></input> Я просто сдела так, скопировал в исходном коде код кнопки добавить, и вставил после $BODY$ а стандартную кнопку скрыл "display:none;" Сделал я это для того, что мне нужно было немного подправить код кнопки, кое что в него дописать, а именно эту часть кода. Код document.getElementById('brief').value = document.getElementById('message').value; return !1; Что он делает, как видешь у меня одно поле "полное описание", а "краткое описание", визуально скрыто, так вот при клике на кнопку "Опубликовать" скрипт копирует текст из полного описания в краткое. Ну что бы всё это не делать в ручную. Добавлено (20 Окт 2013, 15:41:02) Прикрепления:
6050605.jpg
(83.5 Kb)
|
Код в код кнопки сразу вписать disabled="disabled" Код <input id="ldF18" class="manFlSbm" type="button" disabled='disabled' onclick="document.getElementById('doSmbBt').click();document.getElementById('brief').value = document.getElementById('message').value; return !1;" value="Опубликовать"></input> Раз alert выдаёт 0, значить условие проверки такое Код if(document.getElementById('ldF21').value == '0') А для копирования message в brief есть отличная jquery функция Код $(document).ready(function(){ $('#doSmbBt').click(function(){ document.getElementById('brief').value = document.getElementById('message').value; };)};); А для disabled "родной" юкозовской кнопки используй код, который я давал ранее Код document.getElementById('ldF18').disabled = true; Сообщение отредактировал Burgem - Воскресенье, 20 Окт 2013, 17:51:01
|
Burgem, ну смотри в кнопку ставлю disabled='disabled'
и ставлю вот этот скрипт Код <script type="text/javascript"> (function(){ var __e = document.querySelector('#addEntForm select[name="filter1"]'); if ( __e ) { __e.setAttribute('onchange','TheSelChange()'); } };)); function TheSelChange() { if(document.getElementById('ldF21').value == '0') { document.getElementById('ldF18').setAttribute('disabled', 'disabled'); } else { document.getElementById('ldF18').removeAttribute('disabled'); } } </script> onchange добавляется в селект, кнопка заблокирована, но когда я выбераю что-то из списка селект, disabled с кнопки не снимается. Да хрен с ним, я уже так привык делать, мне так удобней. + Я ещё текст в кнопке добавления меняю. |
попробуй разделить функции на 2 отдельных скрипта, т.е. код будет таким
Код <script type="text/javascript"> (function(){ var __e = document.querySelector('#addEntForm select[name="filter1"]'); if ( __e ) { __e.setAttribute('onchange','TheSelChange()'); } };)); </script> <script type="text/javascript"> function TheSelChange() { if(document.getElementById('ldF21').value == '0') { document.getElementById('ldF18').setAttribute('disabled', 'disabled'); } else { document.getElementById('ldF18').removeAttribute('disabled'); } } </script> |
|
| |||