Вебформы и калькулятор Drupal webform_calculator.  

Опубликовано Ksenia-Polo - пн, 12/03/2018 - 14:12

Включение модуля  webform_calculator 

drush en webform_calculator 

Сначала нужно создать материал типа вебформы. Потом на node/nid/edit

добавить поля типа "число" конкретной ноды формы на вкладке  node/nid/webform (НЕ на станице редактирования полей типа материала webform).

создание сайтов

Потом для автоматического подсчета результата уже ввести формулу: на той же вкладке, но с типом поля "formula ",

в разделе "formula value" нужно ввести формулу расчета вида {component1} + {component2} 

В качестве компонентов использовать машинные имена компонентов чисел

друпал

получится

создание сайтов

 

Чтобы изменить текст поля с результатом до заполнения

друпал

Чтобы выключить индикатор прогресса или отредактировать текст кнопки, нужно в расширенных настройках ввести свой текст в поле кнопки на вкладке form settings 

node/nid/webform/configure

друпал

Чтобы изменить текст поля по умолчанию до заполнения для компонента типа формула, пришлось редактировать файлы модуля.  Файл был найден следующим путём:

1)с помощью F12 были найдены фразы для поиска, также в самом поле было написано placeholder...

2)был скачан модуль на локальный компьютер

3)с помощью поиска был найден файл содержащий фразу - placeholder

webform_calculator.js

/sites/all/modules/webform_calculator/webform_calculator.js

4)в нем была отредактирована строчка 96 и 97

'Enter correct value for !fields to see result.'

https://youtu.be/porwkDkWOow

Создание https://youtu.be/CpHdnawlw7k

Чтобы выглядело так

создание сайтов

Нужно в настройках UI  сделать:

https://youtu.be/yuvQGbbP5nQ

для компонентов в label display - нет

ширина поля - 20 

В настройках формы выключить progress bar, написать текст для кнопки submission button - очистить

В настройках  компонентов присвоить им классы и потом написать стили для этих классов в файле CSS темы оформления, например:

.classleft{
float: left;
  }
.classmiddle{
float: left;
  margin-left: 10px;
   margin-right: 10px;
}
  }
.classright{
  float: left;
   margin-left: 10px;
  }

Чтобы убрать рамку у текстового поля 

textarea.form-textarea{
    border: none;

Размер метки в 1297 строке

.form-item label {
  font-size: 1.2em;
}

Остальные настройки на вкладке settings:

https://youtu.be/_fXIStYpXCM

создание сайтов

Ввод

Operation/Symbol

Addition+

Subtraction-

Multiplication*

Division/

Start expression(

End expression)