How to Hide some items in dataview

Hi,
I have a dataview with html template.
In my html template i have two check boxes and some text. then i have added 6 items into the dataview using view.add method.
But i dnt need the checkboxes in first two items.
How can i hide them in first two items?

Thanks,
Naresh adla

Hi
You can use ‘type’ and puut your template in it.

Little color sample for you:

data = new dhtmlXDataView({ container:"data_container", type:{ template: "<span style='background-color: #Type#'> #Version# : #Maintainer#", height:60 } }); data.parse([ { "id": "1", "Version": "DHTMLX", "Maintainer": "DHTMLX Docs & Samples Explorer", "Type": 'blue' },{ "id": "2", "Version": "DHTMLX", "Maintainer": "DHTMLX Docs & Samples Explorer", "Type": 'blue' },{ "id": "3", "Version": "DHTMLX", "Maintainer": "DHTMLX Docs & Samples Explorer", "Type": 'green' },{ "id": "4", "Version": "DHTMLX", "Maintainer": "DHTMLX Docs & Samples Explorer", "Type": 'blue' }], "json");

Hi,

But i dnt need the checkboxes in first two items.

You can use a function as a template ( viewtopic.php?f=8&t=28837&start=10#p92022 ). So, you can check item property (or properties) and return different html string: with or without checkboxes.

Thanks for your reply Darya and Alexandra,

Your answers are helped me alot.
I have one more doubt when i am using dataview.set() method the previous values set to undefined.

Is this method not for override the existing data.

Initially i have my dataview like this
sampledataview—“id”:“343”,
“name”:“dhtmlx”,
“type”:“webtech”

Then i have executed this method sampledataview.set(343,{"“type”:“web”});

Then the item became like this
sampledataview—“id”:“undefined”,
“name”:“undefined”,
“type”:“webtech”

What is the problem?

Thanks,
Naresh Adla

small correction in previous problem

Then the item became like this
sampledataview—“id”:“undefined”,
“name”:“undefined”,
“type”:“web”

type attribute overridden and rest set to undefined

Thanks

Yeah i got the solution,

I have to do like sampledataview.get(343).type=“web”;
and sampledataview.refresh(343);

Thanks,

i have total 3 items in my dataview.
and i have added checkboxes to the dataview using with add method to 2nd and 3rd items.
i clicked on 2nd item and checked the two checkboxes then i selected 3rd item then my checkboxes in 2nd item set to unchecked!

What is the problem?

Code as follows:

Excel_data_view.add({
“id”:“1”,
“image”:“defaultxml.jpg”,
“Name”:“Microsoft Excel XML”,
“Description”:“Microsoft Excel XML”
});
Excel_data_view.add(
{
“id”:“2”,
“image”:“defaultxml.jpg”,
“Name”:“Microsoft Excel XML”,
“Description”:“Microsoft Excel XML”,
“checkboxes”:‘Treat SOURCE as Sequential file stage
Treat TARGET as Sequential file stage’,
“srcTyp”:""
});
Excel_data_view.add(
{
“id”:“3”,
“image”:“defaultxml.jpg”,
“Name”:“Microsoft Excel XML”,
“Description”:“Microsoft Excel XML”,
“checkboxes”:‘Treat SOURCE as Sequential file stage
Treat TARGET as Sequential file stage’
});

Excel_data_view.attachEvent(“onItemClick”, function (id, ev, html){
//alert(id,ev,html);
if ((ev.target || ev.srcElement).tagName == “INPUT”) {
(ev.target || ev.srcElement).checked ? Excel_data_view.get(id).srcTyp=“abc” : Excel_data_view.get(id).srcTyp="";
//Excel_data_view.refresh(id);
}
return true;
});

and i have added checkboxes to the dataview using with add method to 2nd and 3rd items.

Checkboxes should be added in template as well as other html. Data should contain obly data from database, you can also add some new fields if they needed.

for example data of dataview can be:

var dataset = [ {id:1, value:"value1",checkbox:1}, {id:2, value:"value2",checkbox:1}, {id:3, value:"value3",checkbox:0}, ];

if you want to show checkbox only for items with checkbox property, you need to set condition in template function:

dataView = new dhtmlXDataView({ ... template: function(item){ var html = ""; if(item.checkbox) html += "<input type='checkbox'>"; html += item.value; return html; } });

here is the example in DataView package:
dhtmlxDataView/samples/02_templates/02_js.html

Hi Alexandra,
Thanks for your reply.

Stil i have not understand the checkbox issue in dataview.
Here is what i am doing :

I am using a div as template;
Div structure is :

<div id="dataview_list_template">
	<img src='images/#image#' class='export_icon' style=''>
	<div>
		<div class='export_info'>
			<div>
				<span class='xml_name'> #Name# </span>
			</div>
			<div>
				<span class='xml_description'> #Description# </span>
			</div>
			<div>
				<span class='hiddenitems'> #id# </span>
				<span class='hiddenitems'> #ExportURL# </span>
			</div>
		</div>
	</div>
</div>


And i am using the same template for all dataviews.
and my data views are in tabs.

Total my application is like below
1.I have a window
2.I have added tabbar to window in which i have 3 tabs.
3.for each tab i am attaching a dataview
	var dataview1 = tab1.attachDataView({
			container: "dataview_list_template",
			edit:true,
			type:{
				template: "html->books_list_template",
				height:125,
				width: 550
			}
	});same for tab2 and tab3.
4.Then i have added 3 items in each dataview using add method
	dataview1.add(
	{
		"id":"1",
		"image":"inf/normal.png",
		"Name":"Informatica Normal",
		"Description":"Informatica Normal",
		"ExportURL":"myservlet.ads?action=something"
	});same for other 2 dataview2 and dataview3 which are in tabs 2 and 3 respectively.
	
5.Upto here is good. But i need 2 checkboxes in my dataview3 which is in tab3. that too in 2nd and 3rd items of dataview3.(not in 1st item.:slight_smile:)

6.and if i click the checkbox and then select another item in that dataview the previously checked checkbox should not be unchecked.

So this is what my requirement like...
Can you please understand this and give my your last and prefect sollution.. :slight_smile:


Thanks ,
Naresh Adla

Hi,

I have attached the working demo. Hope it will help to solve the issue
dataview.zip (18.4 KB)

Hi,
thanks for this hint, how would I then go change the check/uncheck state of a specific checkbox of one of the item in the data view? Based on something outside of the dataview, i need to go change the state of a checkbox.

thanks

Hi,

You can set check/uncheck property for the items you need and then call refresh() method for these items. refresh method causes item redraw and template will be applied with necessary values:

var item1 = myDataView.item(“id1”);
item1.checked = true;
myDataView.refresh(“id1”);