List Control with Static Data - Dashboard Counter

[txsiccness]

Trying to figure out the best way to go about getting a Dashboard-like counter on a list with static data..

Essentially what I have is 2 lists..

First list with static data:

MenuName|Image|Action
Filter 1|cssIcon=fa fa-bars|Filter 1
Filter 2|cssIcon=fa fa-clock-o|Filter 2
Filter 3|cssIcon=fa fa-star|Filter 3

Second list data bound.

First list filters second list. What I am looking to do is have a counter on the first list of new entries in the second list (say where status is pending review)

So Filter 1 (2 items pending review)
Filter 2 (5 items pending review)

etc..

Anyone accomplished something similar to this? If so, what direction did you go in?

[Michael1954]

Re: List Control with Static Data - Dashboard Counter

When you click on the list you can get Filter 1 put this into a hidden input field and then use the on change event to filter list 2.

var pending = {dialog.Object}.listGetValue(UXListName, UXControlName [,rowNumber])

then use the setvalue method to set the value in the input field that will then fire the onchange event and filter list 2



List messageboard.png


Michael

[txsiccness]

Re: List Control with Static Data - Dashboard Counter

Michael,


Thank you for your response, however this is not quite what I am looking to do..

I attached an illustration of what I am trying to accomplish.

illustration.jpg *Edited

Assuming that I have a bit value for each record, we'll call it b_Rev (been reviewed).

b_Rev goes to false after being reviewed (in this case, when the onClick event is fired).

If b_Rev = true then do not show in counter, else show in counter.. Hope this makes more sense. I am not trying to get the record count of the list.


Think of this as similar to email.. When you have a new email, it shows Inbox (1) right? When you open the email - the email has been reviewed and no longer shows the counter. This is exactly what I am trying to accomplish.. Just had to figure out what analogy to use hah

[Davidk]

Re: List Control with Static Data - Dashboard Counter

I believe Riley wants a count of items pending per Filter type WHEN the page is rendered. This will give his users an idea of how many items there are for the criteria in Filter 1, 2, and 3 so that when selecting Filter 1, users will know there will be 2 items to review.

You could do this client-side or server-side. Server-side would involve changing your Static Filter List to a data bound list. The List would be based on a View which returned your Filter Types and the count of pending items (coming from 2nd List's table).

Client-side, upon Render you could go through the data for the 2nd List building a count for each filter type. The Static List would have a column type of Freeform layout where you'd add a div or span with an id comprised of the Logical Row # and maybe the filter type.

Once you have the data count from the 2nd List, you'd set the innerHTML of your Static List rows.

You'd end up with something like this...

ListCnt1.PNG

From a layout like this...

<div style="display: table; width: 100%;">
	<div style="display: table-cell; vertical-align: middle;">
		<div class="{dialog.style}ListItemLabelMain" style="display: inline-block; width: 40px;">{Image}</div>
	</div>
	<div style="display: table-cell; vertical-align: middle;">
		<div class="{dialog.style}ListItemLabelSub" style="display: inline-block; text-align: left;">{MenuName}</div>
	</div>
	<div style="display: table-cell; vertical-align: middle;">
		<div id="filter{<LogicalRowNumber>}"class="{dialog.style}ListItemLabelSub" style="display: inline-block; text-align: left;">filter count</div>
	</div>
	
	<div style="display: table-cell; width: 40px; text-align: right; vertical-align: middle;">
		<img src="{images.dialog.listNav}" />
	</div>
</div>

[txsiccness]

Re: List Control with Static Data - Dashboard Counter

David,

This is exactly what I am looking for. I am trying to accomplish this on the client side.

When you say "go through the data for the 2nd List building a count for each filter type".. I'm assuming I need to loop through the list's array to find which rows have a false value for b_Rev (been reviewed) in order to get the count, how would one do so without actually selecting rows in the list? If I were actually selecting data, I would know what direction to go in.

Thanks for your help.

[Davidk]

Re: List Control with Static Data - Dashboard Counter

You'd use the UX method .getControl() to get a pointer to your List. Once you have that object, you have access to ._data which is an Array of Objects. Each Object in the Array is a row in the List. Each Object has properties representing each column of data in that row.

You'd loop through the _data Array examining each Object and building your counts.

[txsiccness]

Re: List Control with Static Data - Dashboard Counter

Got it, thanks again David :D!

[Michael1954]

Re: List Control with Static Data - Dashboard Counter

I must say that I would approach this David's way. However if you want to do it clientside then think about templating instead of the first list.


So when the "Second" list is rendered go through it and count "in progress" and "Completed" now with these two variables you can build an unordered list with templating.

Here I go through a list control and put markers on the map. The reason I choose this method was it allows me to build the map marker URL in JavaScript.
you could follow a similar loop and get the count you want.


// go through the list
var lc = {dialog.object}.getListClientSideSummaryValue('Customers','CRM_Add_Id','count');

// loop through the list
for (i = 0; i < lc; i++) {

var comp = {dialog.Object}.listGetValue('Customers','Company_Name',i );
var id = {dialog.Object}.listGetValue('Customers','Company_Id', i);
var phone = {dialog.Object}.listGetValue('Customers','Company_Phone', i);
var email = {dialog.Object}.listGetValue('Customers','Company_Email', i);
var lat = {dialog.Object}.listGetValue('Customers','CRM_ADD_Lat', i);
var long = {dialog.Object}.listGetValue('Customers','CRM_ADD_Lng', i);
var m1Obj = {dialog.object}.getControl('trip_Map');
var mview = "";
var data1 = comp;

var name = 'marker' + id;
var main = 'https://chart.googleapis.com/chart?'
var middle = 'chst=d_map_pin_icon&'
var end = 'chld=home|FFFF00'
//alert(lat + " , " + long + " - " + data1 );
var url1 = main + middle + end ;
if(i == 0){

url1 = 'https://chart.googleapis.com/chart?chst=d_map_xpin_icon&chld=pin_star%7Chome%7C00FFFF%7CFF0000';

}
var settings = {
group: 'mg1', // group that the marker is part of - an arbitrary name
icon: {
url: url1, // url of the image to use for the marker
width: false, // width of the image
height: false, // height of the image
anchor: {x: false, y: false} // anchor point of the image (this is the point in the image that will be the lat/lng of the marker)
},
title: data1, // mouse over help text
detail: {
has: true, // whether or not the marker has a "detail". The "detail" is a popup that provides the user with more information when they click on the marker.
data: data1 // the data to display to the user
},
overlay: {
has: false, // whether or not the marker has an "overlay". The "overlay" is a circle drawn on the map under the marker.
value: '1mi', // the value to use for the size of the "overlay". This can be a string with the suffix "m", "km", "mi", or "ft" for radius, and "sq m", "sq km", "sq mi", "sq ft" for area.
fill: {
color: '', // color for the fill
opacity: 1 // opacity of the fill - 0 is transparent and 1 is opaque.
},
stroke: {
color: '', // color for the stroke
width: 1, // width of the stroke (in pixels)
opacity: 1 // opacity of the stroke - 0 is transparent and 1 is opaque.
}
},
draggable: false, // specify if the user can drag the marker on the map
animation: false, // specify the animation for the marker - values can be: false, 'drop', and 'bounce'
emphasize: false, // number of milliseconds to emphasize (bounce) the marker on creation


//The 'data' object is passed into all events. You can get the lat/lng of the event location from this object. For example
//var lat = data.latLng.lat();
//var lng = data.latLnd.lng();


};



m1Obj.addMarker(name,[lat,long],settings);

}

m1Obj.viewMarkerGroups('mg1');

[Michael1954]

Re: List Control with Static Data - Dashboard Counter

Just a note to show David to the rescue again.

Here is some templating David helped with.


http://www.alphasoftware.com/alphafo...915#post706915

[txsiccness]

Re: List Control with Static Data - Dashboard Counter

Michael,

Alternative solutions are always a great contribution to the community - thank you for sharing.

My client actually changed his mind and just wanted a total record count of the items listed for each filter, LOL.. So I got out of having to do this, however I did get working the way David suggested.. and working well I might add.

Thanks you two.

Cheers.

[Michael1954]

Re: List Control with Static Data - Dashboard Counter

Yes and David solution is the one I would use from choice.