Dataview attached to a layout with header issue

[bracco81]

Hi

I have a dataview attached to a layout with a header and dataview is displayed over header.

Here is my code (layout is created in another page and passed to init function as root):

[code]var menuPanel = {};

menuPanel.root;

menuPanel.dataviewMenu;

menuPanel.mainCell;

menuPanel.init = function(root) {
menuPanel.root = root;
this.layout = root.attachLayout(‘1C’);
this.layout.attachHeader(“header”);
this.mainCell = this.layout.cells(‘a’);
var config = {
type: {
template: “
#nome#”,width:100,height: 100
}
};
this.dataviewMenu = mainCell.attachDataView(config); // returns folders object
var json = [{
“id”:“accetazionePanel”, “img”:“imgs/icona_carrello.jpg”, “nome”:“#accettazione#”
},{
“id”:“venditaPanel”, “img”:“imgs/icona_carrello.jpg”, “nome”:“#vendita#”

}
,{
	 "id":"magazzinoPanel", "img":"imgs/icona_carrello.jpg", "nome":"#Magazzino#"
	
	}
,{
	 "id":"statistichePanel", "img":"imgs/icona_carrello.jpg", "nome":"#Statistiche#"
	
	}
,{
	 "id":"configurazionePanel", "img":"imgs/icona_carrello.jpg", "nome":"#Configurazione#"
	
	}];
this.dataviewMenu.parse(json,"json");

};[/code]

This is an image of the problem

[Alexandra]

Hi

make sure that you have included layout css liabraries. Please attach complete demo if the issue is not solved.

[bracco81]

thank you

I have another issue:
i have attached another dataview to a layout cell and a vertical scrollbar appear even if there’s nothing to scroll (infact it is disabled as you can see in the image that i posted).
How i can solve this problem?

my code is:
note that actionCell is my layout cell.

[code]var config = {
type:{
template:“”,
padding:0,
width:40,
height:40
},
tooltip:{
template:“#descrizione#”
}
};
actionCell.hideHeader();
actionCell.setWidth(60);
actionCell.fixSize(true, true);
actionDataView = actionCell.attachDataView(config);

actionDataView.load(magazzinoPanel.url+"menu_dataview.json","json");[/code]

and json of data in dataview is:

[ {"id":"accetazionePanel", "img":"imgs/ico_exel.png","descrizione":"Esporta in Excel"}, {"id":"venditaPanel", "img":"imgs/ico_print.png","descrizione":"Stampa"}, {"id":"magazzinoPanel", "img":"imgs/ico_print_label.png","descrizione":"Stampa label"}, {"id":"statistichePanel", "img":"imgs/ico_select_all.png","descrizione":"seleziona tutto"} ]

[Darya]

Use the next config:

var config = { type:{ template:"<img src='#img#' style=''>", padding:0, width:40, height:40 }, tooltip:{ template:"<b>#descrizione#<b>" }, height: "auto" };

[bracco81]

thank you