CODEWITHSUNDEEP
extjsnetsuite
Arif WB
Arif WB

Reputation: 316

How can I use an EXTJS library to load a progress bar on screen and monitor the execution time of a saved search in NetSuite?

I am trying to set up a progress bar (in a message box) on a client-side script for the Journal record type in NetSuite. This progress bar is supposed to trigger when an ACCOUNT ITEM (column field on journal record) is clicked. On CLICK, a saved search is suppose to run and when the search is complete, hide the progress bar and place results in another column field on the page.

I have already tried using the EXT JS framework to load a progress bar. I was successful with this when an account item is clicked, BUT unable to hide the bar after the search is complete.

I first declare my saved search which essentially calls the progress bar:

var saved_search = showProgressBarWithFn(search);

The function "showProgressBarWithFn(search)":

   showProgressDialogWithFn: function(search)
    {
        try
        {

            Ext.MessageBox.show({
                title: 'Please wait',
                msg: 'Loading items...',
                width:300,
                wait:true,
                waitConfig:{
                    interval: 200,
                    scope : Ext.bind(search, this), 
                    fn : function(){
            Ext.MessageBox.hide();

                    }

                }
            });

        }
        catch(e)
        {
            console.log("An unexpected error occurred" + e.message);
        }
    }

Above, I have tried to force the scope to run on the search, hence the "ext.bind" call. (Please advise if I have used this function incorrectly). I had read on the API documentation that the "scope" triggers the callback.

I expect a progress bar to show on screen, then disappear straight after the saved search has returned a result.

Any guidance to complete this task would be greatly appreciated!

Upvotes: 0

Views: 1569

Answers (1)

Arif WB
Arif WB

Reputation: 316

I have resolved this in another way and thought I'd share my answer. I firstly created a function without a callback like below.

 showProgressDialog: function(Title, message)
    {
        try
        {
            Ext.MessageBox.show({
                title: Title,
                msg: message,
                width:300,
                wait:true,
                waitConfig:{

                    interval:200,
                }
            });
        }

I then call this in my main function of the script, followed by the saved search, then simply CLOSE the dialog using "Ext.MessageBox.Hide()" with a setTimeOut call to allow a short delay for the progress bar to show on screen.

showProgressDialog('Running vendor/customer search', 'Please wait...');
var results = executeSavedSearch('customer', filters, fields);
setTimeout (function() {Ext.MessageBox.hide();},1000);

The reason for the setTimeOut() is because the saved search completes too quickly to show the progress bar and hide again. Happy to expand on this if other people have a similar issue.

Upvotes: 0

Related Questions