view: 'layout' cols: hide & show problems

Discontinued products DHTMLX Touch
#1

Hi,

I’am developing a web app for the ipad.

The app has one row (vertical) with multiple cols (horizontal).

The horizontal cols contains several menu’s (grouplists) and toolbars with input boxes.

When the app starts i hide all cols in the middle exept for the most left and most right one.
I gave each horizontal col an id and based on its id i’am trying to hide the current col en show the next col.

I am running into all kind of problems:

When i hide the first col (most left one) the last col (most right one) gets empty.
All loaded menu’s (grouplists) are empty after hiding and showing again.

Is there a better solution to do this?
Is there anything to be aware of while hiding en showing cols?

Regards,

William

#2

Not quite sure but maybe multiview will be a better solution. ( multiview can have multiple views insides, but show only one at a time )

If you still have problem with elements hiding - please provide demo or link to the page where issue can be reconstructed.

#3

@stanislav

I have made a copy from the development server to:

bbqweer.eu/ipad/test.html

Hide/show the sub menu works fine.
Hide/show the main menu hides the right column with id ‘testing’ as well.

What is going wrong?

Regards,

William

#4

hi stanislav,

Thanks again: multiview works fine:

bbqweer.eu/ipad/test4.html

Although i don’t understand why hiding the first colum gives a problem:

bbqweer.eu/ipad/test.html

Regards,

William

#5

Problem confirmed, fixed build will be available later today, or tomorrow. ( the problem is in sizing-after-hide logic )

#6

Hi stanislav,

Please look at:

bbqweer.eu/ipad/test5.html

It seems that this element:

elements: [
{
id: ‘search’,
view: ‘input’,
type: ‘text’,
placeholder: ‘Zoek contactpersoon’
}]

is not available while the cell where the element belongs to is not visible.

Therefore the scrips returns an error at the following statements:

$$(“search”).getInput().setAttribute(‘autocorrect’,‘off’);
$$(“search”).getInput().setAttribute(‘autocapitalize’,‘off’);
$$(“search”).getInput().setAttribute(‘autocomplete’,‘off’);

dhx.extend($$(“search”), dhx.KeyEvents);
$$(“search”).attachEvent(“onKeyPress”,function(key){
if (key == 13) {
alert($$(“search”).getValue());
$$(“search”).setValue(’’);
}
});

All others events connected to other invisible components like buttons, lists en grouplists don’t give problems so far.

Is this a bug or is something wrong with the script?

Regards,

William

#7

It is expected, the component itself is exists, but it doesn’t render anything in invisible state

change your code as

$$("search").attachEvent("onAfterRender", function(){ $$("search").getInput().setAttribute('autocorrect','off'); $$("search").getInput().setAttribute('autocapitalize','off'); $$("search").getInput().setAttribute('autocomplete','off'); });

#8

Thanks stanislav,

Works fine!

Regards,

William

#9

Fix for the “hide first column” scenario is attached.
codebase_touch_110711.zip (55.1 KB)