Question

I’m having some issues with some javascript/jquery and a database connection.

Basically I am trying to:

connect to a database -
update progress bar -
open a recordset - 
update progress bar.

Only issue is that the progress bar and some other text won’t update. I’ve tried looking around but can’t find an answer that suits what I am doing.

The code I have at the moment is:

<link rel="stylesheet" href="serveraddress\jquery.ui.all.css">
<script src="localaddress\jquery-1.6.2.js"></script>
<script src="localaddress\jquery.ui.core.js"></script>
<script src="localaddress\jquery.ui.widget.js"></script>
<script src="localaddress\jquery.ui.datepicker.js"></script>
<script src="localaddress\jquery.ui.progressbar.js"></script>
<script type="text/javascript" src="localaddress\jquery.selectBox.min.js"></script>
<link rel="stylesheet" href="localaddress\jquery.selectBox.css"></script>

My JavaScript code:

var global = this;
global.CrntAItem = 'Date'
function changeagent(agnttype,aitem){
    global.atype = "agnt"
    var innerHTMLstring = ""
    if(global.CrntAItem!='Date') {
        document.getElementById(CrntAItem).style.color = '#818181';}
    else{global.CrntAItem=aitem;}
    global.CrntAItem=aitem
    if(agnttype=='agnt'){
        document.body.style.cursor = 'wait'
        document.getElementById(CrntAItem).style.color = '#F79433';
        document.getElementById(CrntAItem).innerHTML = 'Loading...';
        var dbConnString =""
        var startvalue = 50
        var pgrssvalue = 0
        var SQL = "select * from 1ccAgentsQuery";
        var rs = new ActiveXObject("ADODB.Recordset"); 
        var strConn = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source ='client side database path here';Jet OLEDB:Database Password=passwordhere;Persist Security Info=False"; 
        var cn = new ActiveXObject("ADODB.Connection"); 
        cn.Open(strConn); 
        pgrssvalue = pgrssvalue + startvalue
        $( "#progressbar" ).progressbar({value: pgrssvalue})
        rs.Open(SQL,cn,1,1)
        global.pgrssvalue = global.pgrssvalue + startvalue
        $( "#progressbar" ).progressbar({value: global.pgrssvalue})

        if(rs.eof==true){alert("No Agents in Work Type");return;}
        rs.movefirst
        var x=rs.recordcount;
    }
}

Sorry if this is basic or a total mess, I’m learning as I am going and I have a few restrictions (which is why I am using certain code over others.

Some quick things for Variables:
CrntAItem is a <span> in the code and the function above works off the click.
agnttype can equal either “agnt” or “dept”

Any help would be great.

Answer 1

Try running the “heavy” tasks asynchronously by using timers.

Change the relevant block of code to this:

//....no change here....
var strConn = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source ='client side database path here';Jet OLEDB:Database Password=passwordhere;Persist Security Info=False"; 
        var cn = new ActiveXObject("ADODB.Connection"); 

//change to use timer:
window.setTimeout(function() {
    cn.Open(strConn);
    pgrssvalue = pgrssvalue + startvalue;
    $("#progressbar").progressbar({value: pgrssvalue});
    window.setTimeout(function() {
        rs.Open(SQL,cn,1,1);
        global.pgrssvalue = global.pgrssvalue + startvalue;
        $("#progressbar").progressbar({value: global.pgrssvalue});
        if(rs.eof==true)
            alert("No Agents in Work Type");
        else {
            rs.movefirst
            var x=rs.recordcount;
            //logic using x here......
        }
    }, 100);
}, 100);

Note the “logic using x here” comment – by using asynchronous code you will have to change the logic as well and do everything in the timer itself – post the code using the recordcount if you need further guidance.