How can I configure dropdown widget as data filter widget

[Rayon_11]

Hi all,

I want to use dropdown widget as a data filter for my grid advanced widget data for that I created a Thing then an infotable property and a service to call that info table property and now in my mashup I added a grid widget and bind this service to grid data now I want to filter my data based on some criteria by using dropdown widget so how can I bind it like I tried to bind the same service all data property to the data property of dropdown and then in dispaly option of dropdown I selected the filter option  but I am not getting the result please help me how  I can bind properly or if any other way to filter the data

Regards,

Rayon

[Velkumar · Accepted solution]

Hi @Rayon_11 

If you are using New Grid (comes from 9.3), you can directly map the "SelectedText" property from Dropdown as Grid FilterString

So when data gets changed in the dropdown, grid will be filtered based on the dropdown value.

/VR

[Rayon_11]

Hi Velkumar,

I am using Thingworx 8.5 version

so how can I do this in this version

[Velkumar]

Hi @Rayon_11 

Could you please tell me from where you are getting data for Grid?

Based on your use case, you need to create a custom service with a query to filter InfoTable Data. 

In my example, I'm trying to filter InfoTable Property. Please find below code for reference 

let result = me.dummyInfoTable; // DUMMY DATA
if (filterValue && filterValue.length > 0) {
	// Provide your filter using the format as described in the help topic "Query Parameter for Query Services"
	let query = {
		"filters": {
			"type": "And",
			"filters": [{
				"fieldName": "name",
				"type": "EQ",
				"value": filterValue // INPUT PARAMETER
			}]
		}
	};
 
 
	let params = {
		t: me.dummyInfoTable /* INFOTABLE */ ,
		query: query /* QUERY */
	};
 
	// result: INFOTABLE
	result = Resources["InfoTableFunctions"].Query(params);
}

Mashup Bindings

/VR

[Rayon_11]

Hi @Velkumar ,

Thanks for your reply 

For now I am using Infotable property on a thing and set custom values to that Infotable and created a custom service to get the output and then bind that Custom service to the grid advanced widget and now I wanted to filter the data based on the requirement. Right now I am taking an static sample data to understand till which extent I can use dropdown,

I am also giving you a problem which I have to apply this widget if you can help me in this case 

Problem:-> Suppose I have some 1000  product in 5 category where Categories are like C1,C2,C3,C4 and C5 and each are having product like N1,N2,N3,N4,N5 where N1+...N5=1000 we can have some sub category as well to extend the filter criteria  but for now just want to go with this only Now If I select category C1 in my grid data should come like N1 similarly if I select C2 grid data should show N2 and so on.. 

So to show this kind of grid data  presentation what should be my approach to bind the data.  Is it to use dropdown or data filter widget ?

As I am new to these things please don't mind if any mistakes.

and once again thanks for your instant reply!

Best Regards!

Rayon

[Velkumar]

Hi @Rayon_11 

You can reuse the above script

let result = me.dummyInfoTable; // DUMMY DATA FROM PROPERTY
if (filterValue && filterValue.length > 0) {
	// Provide your filter using the format as described in the help topic "Query Parameter for Query Services"
	let query = {
		"filters": {
			"type": "And",
			"filters": [{
				"fieldName": "CATEGORY", // CHANGE IT BASED ON YOUR FIELD NAME
				"type": "EQ",
				"value": filterValue // SERVICE INPUT PARAMETER. PASS THIS VALUE FROM DROPDOWN ( SELECTEDTEXT )IN MASHUP
			}]
		}
	};
 
 
	let params = {
		t: me.dummyInfoTable /* INFOTABLE */ ,
		query: query /* QUERY */
	};
 
	// result: INFOTABLE
	result = Resources["InfoTableFunctions"].Query(params);
}

Mashup Binding

Please do let me know if you need more help. I can create sample entities and upload here

/VR

[Rayon_11]

Hi @Velkumar ,

It would be a great help if can connect any how like meet or zoom because I am confused with all this not properly able to configure it

this is my mail id : takeugrow@gmail.com

when you free please let me know It would be a great help 

Regards,

Rayon