Number Pro Attribute

Documentation

This addon is an extension of a Concrete CMS' default attribute called number attribute.

This addon creates a "Number Pro" attribute, which allows users to set min/max/step options used in input="number" HTML.

If you need an attribute whose value is between 0 - 100, use this addon and set min as 0, and max as 100.

 

In composer editing mode, you will see a input form where min/max/step options defined.

If you are using ver.9, you can optionally add big spinner buttons. (Ver.8.5.7 does not support big spinning buttons.

Big spinner buttons require Bootstrap 4/5 and jQuery.

 

Here is a sample form of Number Pro, spinning button enabled.

 

Here is a setting page for "Number Pro" attribute.

You can fill in min/max/step, blank allowed. (If min is blank, no restricition for minimum value. If max is blank, no restricition for maximum value. If step is blank, browsers offen consider as 1.)

Spinner Button option is displayed on ver.9 or later.

 

You can use "Number Pro Attribute" at pages, files, users, sites, events, and epxress.

 

Here is a sample of an express form block.

CIF Sample

<?xml version="1.0"?>
<concrete5-cif version="1.0">
 <attributekeys>
 <attributekey handle="numberpro1" name="attribute1" package="" searchable="1" indexed="0" type="numberpro" category="collection">
 <type min="5" max="20" step="5" stylemode="1">
 </type>
 </attributekey>
 <attributekey handle="numberpro2" name="attribute2" package="" searchable="1" indexed="0" type="numberpro" category="collection">
 <type min="2" max="10" step=".2" stylemode="0">
 </type>
 </attributekey>
 </attributekeys>
</concrete5-cif>

You can add <type> inside <attributekey>, where you can set;

  • min : minimum value for this attribute
  • max : maximum value for this attribute
  • step : specifies the interval
  • stylemode : 1 = "big spinner buttun enabled", 0 = "big spinner button disabled"

 

Q & A

Q: This addon supports Express?

A: Yes.
When you use number pro attributes in frontend express forms, big spinner buttons depend on your theme. Big spinner buttons  require Bootstrap 4/5 and jQuery.