Forum


Calc Builder Support

Calc Builder support
Forums
Public write access is disabled. Please login

Slider controls 24.08.2012 11:47

Hello,
as we have received during last days several questions about slider
integration with fields of calcbuilder, here you have instructions to
make a third party js library work together with number or text fields
(many thanks to Keith for sharing the final solution).
The library can be found here:

http://www.dhtmlx.com/docs/download.shtml


You should download the slider control and upload/include the script
libraries and styles (codebase folder), adding them to your template and
setting the right paths, insert inside a script tag:


window.dhx_globalImgPath="../../codebase/imgs/";


And import the following js files:

codebase/dhtmlxcommon.js
codebase/dhtmlxslider.js
codebase/ext/dhtmlxslider_start.js


Also include the stylesheet:

codebase/dhtmlxslider.css



Then use the 'Javascript events' tabs at calcbuilder to link the fields.
It executes on onload event, so all fields are already present at the page.
To identify each input field, please check the 'fields and code'
section, to find out the ID number of the field you want to link. The
html id of each field would be

fld_x

where 'x' is the ID number. Then use that identifier to link the slider,
for ex, a text field with ID=8 :


var sld1 = new dhtmlxSlider("fld_wrapper_8", {
size:400,
skin: "dhx_skyblue",
vertical:false,
step:100,
min:20000,
max:900000,
value:20000
});
sld1.linkTo("fld_8");
sld1.init();

Hope this helps, regards

Edited by MSTeam - 24.08.2012 11:56
Moonsoft Team
www.moonsoft.es
Are you satisfied with our products/services/support?
Please help us to keep improving, add a review at  joomla extensions site and  magento connect

Our clients' feedback