CalcBuilder Forum

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