Помогите с ошибкой/конфликтом JS

Тема в разделе "JavaScript", создана пользователем 01K, 25 ноя 2013.

Модераторы: ZiX
  1. 01K

    01K

    Регистр.:
    27 июн 2013
    Сообщения:
    271
    Симпатии:
    40
    Всем привет!
    Вот уже долгое время не могу разобраться с глюком/конфликтом JS.
    Использую CMS Joomla в связке с ChonoCorms.
    Последний, хоть и навороченный компонент, но имеет узкие места.
    Озадачился я тем, что он ещё не заточен под Twitter Bootstrap, т.е. пропорционально его поля растягиваться не будут.
    Разраб написал JS скрипт/костыль, который решает этот вопрос:

    Код:
    window.addEvent('domready', function(){
      var frontforms_css, template_css, bootstrap_css;
    // remove ChronoForms CSS
      frontforms_css = $$('link[href$="frontforms.css"]')[0];
      frontforms_css.setProperty('href', '');
    // move bootstrap.css
      template_css = $$('link[href$="template.css"]')[0];
      bootstrap_css = new Element('link',
      {
      type: 'text/css',
      href: 'templates/tbr03/css/bootstrap.min_2_forms.css',
      rel: 'stylesheet'
      });
      bootstrap_css.inject(template_css, 'after');
    // update checkboxes
      var cbx_labels, cbx_for, cbx_input, cbx_float;
      cbx_labels  = $$('.cfdiv_checkboxgroup label');
      cbx_labels.each(function(item) {
      cbx_for = item.getProperty('for');
      if ( cbx_for ) {
      // this is a label for a checkbox
      if ( item.getParent().getParent().hasClass('radios_over') ) {
      item.addClass('checkbox');
      } else {
      item.addClass('checkbox inline');
      }
      cbx_input = $(cbx_for);
      cbx_input.inject(item, 'bottom');
      }
      });
    // update radio buttons
      var rad_labels, rad_for, rad_input, rad_float;
      rad_labels  = $$('.cfdiv_radio label');
      rad_labels.each(function(item) {
      rad_for = item.getProperty('for');
      if ( rad_for ) {
      // this is a label for a radio
      item.addClass('radio inline');
      rad_input = $(rad_for);
      rad_input.inject(item, 'bottom');
      }
      });
      rad_float = $$('div[style*="float:left"]');
      rad_float.each(function(item) {
      item.setProperty('style', '');
      });
    });

    Вроде бы всё работает, но кроме тех пунктов, где есть drop-down... Отключал модули, отключал библиотеки, никак разобраться не получилось.

    Короче говоря, слева есть 2 формы, этот JS удаляет их стили и добавляет дополнительный:
    bootstrap.min_2_forms.css

    На выше указанных страницах стили этих форм слетают, а точнее скрипт подгружает стиль, но он оказывается пустым, именно на этих пунктах... !!! Смотрю через FireBug.
    В общем, нуждаюсь в советах, помощи, гуру JS

    Демо шаблон тут:
     
  2. vipTelnet

    vipTelnet Постоялец

    Регистр.:
    14 янв 2013
    Сообщения:
    133
    Симпатии:
    11
    #left input[type="text"],#left textarea{ width:180px;}
    так попробуй
     
  3. 01K

    01K

    Регистр.:
    27 июн 2013
    Сообщения:
    271
    Симпатии:
    40
    Не помогает :(
    Тут что-то сам скрипт тупит, именно на определённых пунктах грузит пустой css файл, который, естественно заполненный
     
  4. vipTelnet

    vipTelnet Постоялец

    Регистр.:
    14 янв 2013
    Сообщения:
    133
    Симпатии:
    11
    #left input[type="text"],#left textarea{ width:180px !important;}
    а так?

    Я конешно понимаю что решение не универсальное, но ты просишь решить свою конкретную проблему
     
    01K нравится это.
  5. 01K

    01K

    Регистр.:
    27 июн 2013
    Сообщения:
    271
    Симпатии:
    40
    Так, кажется - да. Выравнивает инпуты. Спасибо! Уже вариант!
    Но с JS хочется всё же разобраться. Узнать, что там конфликтует :)
     
  6. vipTelnet

    vipTelnet Постоялец

    Регистр.:
    14 янв 2013
    Сообщения:
    133
    Симпатии:
    11
    да мне вообще не понятно причем тут яваскрипт
    Вам что нужно размер этих элементов динамически менять.

    Там все решается с помощью обычного css
    Да не все расширения во фронтальной части поддерживают бутстрап
    ну и что кроме бутстрапа Вам что кто то мешает свои стили написать

    или где там конфликт в консоле ни каких сообщений об ошибках не вижу
     
  7. 01K

    01K

    Регистр.:
    27 июн 2013
    Сообщения:
    271
    Симпатии:
    40
    JS выполняет 3 функции:
    1). Сдирает старые стили с ChronoFom
    2). Подгружает отдельный bootstrap.min_2_forms.css (в нём несколько строчек относящихся только к формам)
    3). Связывает стили форм из подгруженного файла.
    Дело в том, что почти везде эта связка работает, а но мною отмеченных меню пунктах происходит какой-то сбой. Файл стиля подгружается, он его содержание пустое
     
  8. vipTelnet

    vipTelnet Постоялец

    Регистр.:
    14 янв 2013
    Сообщения:
    133
    Симпатии:
    11
    файл стиля подгружается откуда с сервера, или там яваскриптом все эти стили добавляются к элементам?
     
  9. 01K

    01K

    Регистр.:
    27 июн 2013
    Сообщения:
    271
    Симпатии:
    40
    С сервера:
    kuzma.tk/templates/tbr03/css/bootstrap.min_2_forms.css
     
  10. vipTelnet

    vipTelnet Постоялец

    Регистр.:
    14 янв 2013
    Сообщения:
    133
    Симпатии:
    11
    ну так если файл грузиться пустой с сервера то и проблему нужно искать где то на стороне сервера, в процессе его генерации.