Display Record Count in a UX

[Pizzadude]

I have a UX based on a MySql table.

I want to display text "Record 3. Found 15 of 98000"
3 is the 3rd record in the result set, currently being displayed.
15 is the number of records in the current result set.
98000 is the total number of rows in the table.

This is similar to the message being displayed in the slider that is available in the Load_Primary_keys_for_Parent_Table action in the onDialogInitialize event. It uses placeholders {recordNumber} and {recordcount}.

But I want to do this independently of a slider or list control.

I believe the data I am after is in the e object.

Can anyone tell me the best way to do this?

[Pizzadude]

Re: Display Record Count in a UX

Anyone?

[Pizzadude]

Re: Display Record Count in a UX

Here is a related question....

In the Action Javascript "Get Primary Key List" builder, there is an "After Search" client-side event. It says it takes e as an argument. e.recordsInQuery contains the number of records in the query.

How do I pass e.recordsInQuery into a Javascript function?

[Davidk]

Re: Display Record Count in a UX

I think this is what you're looking for...

http://www.youtube.com/watch?v=L2EQGJIqkrE

Here are all the bits and pieces...

function jsAfterSearch(e){

	if (e.recordsInQuery>0){
		{dialog.Object}._recInfo.queryRecCount = e.recordsInQuery
	} else {
		{dialog.Object}._recInfo.queryRecCount = {dialog.Object}._recInfo.totalRecCount;
	}

	updateRecordInfo();
	
}

function updateRecordInfo(){

	$("recInfo").innerHTML = "Record " + {dialog.Object}._currentRecordNumber + ". Found " + {dialog.Object}._recInfo.queryRecCount + " of " + {dialog.Object}._recInfo.totalRecCount;		

}

Client-side Event : afterRecordNaviagate

updateRecordInfo();

Client-side Event : onRenderComplete

{dialog.Object}._recInfo = {};
{dialog.Object}._recInfo.totalRecCount = {dialog.object}._primaryKeyList.length;
{dialog.Object}._recInfo.queryRecCount = {dialog.Object}._recInfo.totalRecCount
updateRecordInfo();

[Pizzadude]

Re: Display Record Count in a UX

Excellent. Can't thank you enough.

One more question comes up in my application. What about when the number of records changes?

This will get the number of records in the mySql table named "loads", and display it in a div:

function totalRecordCountInLoadsTable as c (e as p)
dim cn as sql::Connection
dim rs as sql::ResultSet
sql = <<%a%
SELECT COUNT(*)
FROM loads
%a%
cn.open("::Name::FreightzoneMySql")
cn.execute(sql)
rs = cn.ResultSet
count = rs.data(1)
cn.close()

dim countAllRecords as c
countAllRecords = "$('totalRecords').innerHTML='of ' + '" + js_escape(count) +"';"

totalRecordCountInLoadsTable = countAllRecords

END FUNCTION

It works just fine. But only needs to fire on INSERT and DELETE.

In afterDialogValidate, Save Submitted Date To Tables builder, there are server side events: AfterRecordInsertFunction and AfterRecordDeleteFunction. Using totalRecordCountInLoadsTable does not seem to do anything.

How can I fire this only on INSERT or DELETE?

Or is there a better way?

[Davidk]

Re: Display Record Count in a UX

I'm not sure about the server-side events in the afterDialogValidate event. I believe they'll only fire if afterDialogValidate runs... which, of course, makes sense. On an Insert... it runs because a Submit occurs. But on a delete the afterRecordDelete doesn't run because the afterDialogValidate doesn't run. Have to check on this.

So... let's do this another way.

In the Client-side afterDeleteParentRecord event...

{dialog.Object}._recInfo.totalRecCount = --{dialog.Object}._recInfo.totalRecCount
{dialog.Object}._recInfo.queryRecCount = --{dialog.Object}._recInfo.queryRecCount;
updateRecordInfo();

Here we are decrementing the total record count and query record count when a record has been deleted.

In the Server-side afterDialogValidate event... AFTER the ExecuteServerSideAction...

e.javascript = e.javascript + "afterInsRecord('" + e.rtc.primaryTableEditMode + "');"

Here... AFTER your your normal ExecuteServerSideAction, we append our own javascript function... and we pass into that function e.rtc.primaryTableEditMode which will have a value of Enter or Update.

function afterInsRecord(editMode){

	if (editMode=='Enter'){
		{dialog.Object}._recInfo.totalRecCount = ++{dialog.Object}._recInfo.totalRecCount;
		{dialog.Object}._recInfo.queryRecCount = ++{dialog.Object}._recInfo.queryRecCount;		
	        updateRecordInfo();
	}
	
	if ({dialog.Object}._recInfo.currSearchParam){
		{dialog.Object}.setValue('txtSearchFor',{dialog.Object}._recInfo.currSearchParam);
		{dialog.object}.buttonClick('BTNSEARCH');
	}

}

When afterDialogValidate runs... for an update or insert... then this function will be called. We know if it's Enter or Update. If it's enter then we're adding a new record and so increment our counts. If it's an Update then we don't want to increment.

Here's another wrinkle. Let's say you did a search. You've got 23 of 88 records... and you add a new record. Now... all this depends on how you want your app to behave... but... since you've got an active search you may want that "process" to continue. The javascript function afterInsRecord checks to see if there is a current search going on, just by checking the search textbox. If there is, then we save the current search param, add the new record and re-execute the search. Not all that is going on in this function... but that's the general idea.

In the Search textbox, client-side onBlur event I put this... which saves the search value.

var currSearch = {dialog.Object}.getValue('txtSearchFor');
{dialog.Object}._recInfo.currSearchParam = currSearch;

The afterInsRecord javascript function checks for a search, puts it back in place (because a New Record action clears it) and executes the search again.

It's getting kinda complicated so I'm guessing there's an easier way to do all this. However... this is a great exercise in seeing how all the calls and tools fit together. It's very cool.

[Pizzadude]

Re: Display Record Count in a UX

I'm not sure about the server-side events in the afterDialogValidate event. I believe they'll only fire if afterDialogValidate runs... which, of course, makes sense. On an Insert... it runs because a Submit occurs. But on a delete the afterRecordDelete doesn't run because the afterDialogValidate doesn't run. Have to check on this.

It would be interesting to know what these events are for.

As for updating the total records count, I agree that the solution you propose is kinda complicated. I believe for my application, I would probably go the easier route of making the user click a button to show the total record count. This is not an ideal solution, so I will see how your solution fits.

Of course, if a record is added or deleted, and it affects the results of the current search, the records in query number should also be updated. It looks like your solution addresses this.

I mentioned that I would like to do all of this independently of a list or slider. But it would be interesting to know exactly how the slider message gets updated.

As an additional wrinkle, I have some ajax callbacks that I use in this UX. So the Action Javascript "Get Primary Key List" is not being used. So I have modified your original posed solution by using two spans:
<span id="recInfo"</span>
<span id="recordsInQuery"</span>

With a separate function to update one or both as needed:
function updateRecordInfoOnNavigate(){

$("recInfo").innerHTML = "Record " + {dialog.Object}._currentRecordNumber;

}

function updateRecordInfoOnSearch(){

$("recInfo").innerHTML = "Record " + {dialog.Object}._currentRecordNumber;
$("recordsInQuery").innerHTML = "Found " + {dialog.Object}._recInfo.queryRecCount;

}

In a callback, I use this to get the record count in the query:
SELECT
COUNT(1),

and update the recordsINQuery with this:
"$('recordsInQuery').innerHTML='Found ' + '" + js_escape(queryCount) +"';"

This all seems to work just fine.