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

01K

Мой дом здесь!
Регистрация
27 Июн 2013
Сообщения
693
Реакции
324
Всем привет!
Вот уже долгое время не могу разобраться с глюком/конфликтом 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

Демо шаблон тут:
 
#left input[type="text"],#left textarea{ width:180px;}
так попробуй
 
Не помогает :(
Тут что-то сам скрипт тупит, именно на определённых пунктах грузит пустой css файл, который, естественно заполненный
 
#left input[type="text"],#left textarea{ width:180px !important;}
а так?

Я конешно понимаю что решение не универсальное, но ты просишь решить свою конкретную проблему
 
  • Нравится
Реакции: 01K
Так, кажется - да. Выравнивает инпуты. Спасибо! Уже вариант!
Но с JS хочется всё же разобраться. Узнать, что там конфликтует :)
 
да мне вообще не понятно причем тут яваскрипт
Вам что нужно размер этих элементов динамически менять.

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

или где там конфликт в консоле ни каких сообщений об ошибках не вижу
 
JS выполняет 3 функции:
1). Сдирает старые стили с ChronoFom
2). Подгружает отдельный bootstrap.min_2_forms.css (в нём несколько строчек относящихся только к формам)
3). Связывает стили форм из подгруженного файла.
Дело в том, что почти везде эта связка работает, а но мною отмеченных меню пунктах происходит какой-то сбой. Файл стиля подгружается, он его содержание пустое
 
файл стиля подгружается откуда с сервера, или там яваскриптом все эти стили добавляются к элементам?
 
С сервера:
kuzma.tk/templates/tbr03/css/bootstrap.min_2_forms.css
 
ну так если файл грузиться пустой с сервера то и проблему нужно искать где то на стороне сервера, в процессе его генерации.
 
Назад
Сверху