Any ways to dynamically change blockOffset ?

Suite and Optimus Suite 5
#1

Hi,
I have a form which use a “block” and I would like to change the blockOffset dynamically, is there any ways we can change it once the form was initially built?

formData = [
      { type: "fieldset", name: "theInfo", label: "", inputWidth: "auto", list:
      [
            {type: "settings", labelWidth: 30, inputWidth: 130},
            {type:"input", name: 'inp1', label:'inp1'},
            {type:"input", name: 'inp2', label:'inp2'},
            {type:"input", name: 'inp3', label:'inp3'},
            {type:"input", name: 'inp4', label:'inp4'},
            {type:"input", name: 'inp5', label:'inp5'},
            {type:"input", name: 'inp6', label:'inp6'},
            {type:"input", name: 'inp7', label:'inp7'},
            {type:"input", name: 'inp8', label:'inp8'},
            {type:"input", name: 'inp9', label:'inp9'},
            {type:"block", id:'myBlock', width:200, blockOffset:10,
                list:
                [
                    {type:"input", name: 'inp10', label:'inp10'},
                    {type:"input", name: 'inp11', label:'inp11'}
                ]
            }
       ]}
];
myForm = new dhtmlXForm("myForm", formData);

// This doesn't exist but is what i would like to be able to do?
myForm.getItem ('myBlock').blockOffset = 40;

Thanks!

#2

Hi

  1. check your syntax

{ type: "block", id: "myBlock" ... } // should be { type: "block", name: "myBlock" ... }

  1. add once, this is “form” extension for block, make sure form.js loaded

dhtmlXForm.prototype.getItem = function(id){ return this.doWithItem(id,"getItem"); }; dhtmlXForm.prototype.items.block.getItem = function(item){ return item; };

  1. change padding, should be called after form init

var b = myForm.getItem("myBlock"); // item's "name" attr should be here, check 1) b.firstChild.firstChild.style.paddingLeft = "10px"; // your initial "blockOffset:10" is here

#3

Thanks! this work, but I am curious what it actually means, how do you determine you need to go to firstChild.firstChild.style ? I can put breakpoint and seek for it, but I guess there is an explanation?

thanks!

#4

Form told me :slight_smile:

block as any other item is a bit complex and have several childNodes. when you specify blockOffset - it applied on firstChild.firstChild, returned item - main parent node of whole item (block in your case). for “input” for example it depends on label-position and can be childNodes[0] or childNodes[1]