Для выполнения примера подключите к html-странице ссылки на библиотеку PP.js и таблицы визуальных стилей PP.css. Создадим числовой редактор с наименованием «NE».
<script type="text/javascript">
NE = new PP.Ui.NumberEdit({//Создаем экземпляр компонента NumberEdit
ParentNode: document.getElementById("NE1"),//Идентификатор, который содержится в теге div
Width: "170px",
Height: "21px",
Step: 10,//Шаг изменения значения
EnableGroupSeparator: true,// Разделение по разрядам
DecimalSeparator: ".",//Разделитель разрядов
GroupSeparator: ",",//Разделитель тысяч
MinValue: 0,//Минимальное значение
MaxValue: 10000,//Максимальное значение
FractionCount: 2,//Количество знаков после разделителя разрядов
Walkthrough: true//Цикличность установлена
});
NE.setFocus();//Устанавливаем фокус компоненту
</script>
После выполнения примера на html-странице будет размещен числовой редактор, имеющий следующий вид:
При нажатии на клавиши «Вверх/вниз» или кнопки прокрутки значение будет изменяться на 10 (свойство Step).
В окне редактора может быть установлено значение от 0 до 10000. При вводе недопустимого значения загорается индикатор некорректного ввода.
Если введено минимальное значение, при нажатии нижней кнопки прокрутки или клавиши «Вниз» в окне редактора будет установлено максимальное значение, которое при дальнейшей прокрутке вниз будет уменьшаться на 10. Это обусловлено тем, что для свойства Walkthrough установлено значение true.
См. также: