Remote Scripting Example

This example shows how to display a header-detail form using remote scripting. It gives us the chance to navigate through the records with next, previous, move first and move last.

Contributed by aspfree
Rating:

/ 10
May 08, 2001

Rate this Article:
MEH MEH++

SEARCH ASP FREE

This method is particularly useful when we need to quickly scroll through a number of records. This example shows some basic navigation techniques but more functionality could be added by simply calling a different function from the client side to update or delete the current record.To see this example working please check www.houndware.com/dario/remote.aspThis is the client page. I used the pubs database to get each author and display every book written by her/ him.


Client side ---Remote.asp

===============================================================

<!--#include file = "../ADOVBS.INC"-->

 

<HTML><HEAD>

<TITLE>Remote Scripting Example</TITLE>

<SCRIPT Language="JavaScript" src="../_ScriptLibrary/rs.htm"></SCRIPT>

<!-- enable remote scripting -->

<script language="JavaScript">RSEnableRemoteScripting("../_ScriptLibrary");</script>

<script language="JavaScript">

// declare variables

var serverURL = "RemoteAction.asp";

var intcount =0 ;

var intLastTran =1 ;

 

function firstTran()

{

            intcount=1 ;

            getRemoteData (intcount );

}

function lastTran()

{

            intcount= intLastTran;

            getRemoteData(intcount);

}

function previousTran()

{

 

            if (intcount < 2 )

            {

                        alert ( "You have reached the begining ");

            }

            else

            {

                        intcount = intcount -1 ;

                        getRemoteData(intcount);

            }

}

function nextTran()

{

            if ( intLastTran <= intcount )

            {         

                        alert ("You have reached the end ");

            }

            else

            {

                        intcount = intcount + 1;

                        getRemoteData(intcount);        

            }

}

function getRemoteData( intcount  )

{

            status="Getting record...";

            // call server-side function with the page name , funcion and parameter

            // NOTE: if more parameters need to be passed, simply add them to the string

            // ie:      co=RSExecute(serverURL,"getRemoteData",param1,param2,param3,..);   

            co=RSExecute(serverURL,"getRemoteData",intcount);

            var row;

            var detail ;

            var trandata;

            var a ;

            var trandata = new Array() ;

            //          create an array with each row as an element

            row = co.return_value.split(";;");

           

            DataTran.innerText=""; // clear the previous value

 

                       

            detail = "<table  width=100% cellspacing=0><tr background=silver><td width=10% ><strong>Title ID</strong></td><td width=40% ><strong>Title</strong></td><td width=5% ><strong>Type</strong></td><td width=7% ><strong>Price</strong></td><td width=7% ><strong>Advance</strong></td>"; 

            for (var i=0; i <  row.length ; i++ )

            {         

 

                        col = row[i].concat();

                        col= col.split(";");

                        trandata[i]= new Array();

                        detail = detail +  "<tr>" ;                                  

                        for (var a=0 ;a <  col.length   ; a++)

                        {

 

                                    trandata[i][a]= col[a]; // setting the column value into the array

                                   

                                                if ( a > 6 )

                                                {

                                                            detail= detail +   "<td>"  + trandata[i][a] + "</td>" ;                                         

                                                }

                                   

           

                        }

                        detail = detail +  "</TR>" ;                   

                                   

            }         

           

            DataTran.innerHTML =  detail  ;

            document.all.FirstName.value=trandata[0][0];

            document.all.LastName.value=trandata[0][1];

            document.all.Phone.value=trandata[0][2];

            document.all.City.value=trandata[0][3];

            document.all.State.value=trandata[0][4];          

            document.all.Zip.value=trandata[0][5]; 

            intLastTran = trandata[0][6];

            status="Done";

}

</script >

</head>

<body bgcolor="#c9cbc0" alink=white vlink=white>

<table width=90% border=1 bgcolor=silver  bordercolordark=Black>

<tr ><td colspan=10> <table bgcolor=336699 width=100%><tr><td width=75% ><font size=6 color=white >Remote Scripting Example </font><font color=white size=3> by  <a href=mail:dmedele@houndware.com> Dario Medele</a></font></td>

<td>

            <a href="Javascript:lastTran()" > Last Record</a>

            <a href="Javascript:nextTran()" > Next Record</a>

            <a href="Javascript:previousTran()" >Previous Record </a>

            <a href="Javascript:firstTran()" >First Record </a>

</td></tr></table>

</td></tr>

<tr><td colspan =10>

<table width=100% cellspacing=0  bordercolordark="black">

<tr ><td valign=bottom><strong>First Name</strong></td><td>

<input type= text name=FirstName value="">  

</td></tr>

<tr ><td><strong>Last Name</strong></td><td>

<input type= text name=LastName value="">   

</td>

</td></tr>

<tr><td><strong>Phone</strong></td> <td>

<input type= text name=Phone value="">          </td>

</tr><tr><td><strong>City</strong></td><td>

<input type = text name=City value="">

</td></tr>

<tr><td><strong>State</strong></td><td>

<input type = text name=State value="">

</td></tr>

<tr><td><strong>Zip</strong></td><td>

<input type = text name=Zip value="">

</td></tr>

</table>

</td></tr>

<tr><td colspan =10>

<table width ="100%" border="1" bordercolordark="Black">

<tr bgcolor=336699 ><td colspan=10> <table width=100%><tr><td width=50% ><font color=white ><strong>Titles</strong></font></td><td>

</td></tr></table><tr><td colspan=10 >

<DIV ID="Detail">

<p ID="DataTran"></p>

</DIV>

 </td></tr>

</td></tr><tr><td>

</td></tr></table>

</BODY>

</HTML>

 

End of client side

 

 

 

 

 

===============================================================

Server side  -- RemoteAction.asp

 

 

<%@ LANGUAGE=VBSCRIPT %>

<% RSDispatch %>

<!--#include file = "../ADOVBS.INC"-->

<!--#include file="../_ScriptLibrary/rs.asp"-->

<html>

<head>

<title>SiS</title>

<SCRIPT RUNAT=SERVER Language=javascript>

function Description()

{

            this.getRemoteData= Function('intcount','return getRemoteData(intcount)');

}

            public_description = new Description();

</SCRIPT>

<SCRIPT RUNAT=SERVER Language=VBScript >

function getRemoteData(intcount )

// This sql string is made of the elements of the header, the total number of records in the header ,

// and the details. Also the parameter passed (intcount) will indicate which record the client requested

             

            strsql = " select a.au_fname, a.au_lname, a.phone, a.city , a.state,a.zip, (select count(*) from authors ) as total, isnull(t.title_id,'_')as title_id ,isnull(t.title,'_') as title "  &_

            " , isnull(t.type,'_') as type  ,isnull(convert(varchar(100),t.price),'_')as price ,isnull(convert(varchar(100),t.advance),'_') as advance "  &_

            " from authors a left " &_

            " join titleauthor ta on a.au_id = ta.au_id " &_

            " left join titles t on ta.title_id = t.title_id " &_

            " where a.au_id  in " &_

            " ( select top 1 au_id  from authors where au_id in ( select top " & intcount & "  au_id " &_

            " from authors order by au_fname asc ) order by au_fname desc ) " &_

            " order by au_fname asc "

           

           

            strconn = "Driver={SQL Server};Description=SIS;SERVER=111.111.111.111;UID=sa;PWD=;DATABASE=pubs"

           

            set rs= server.CreateObject("ADODB.Recordset")

           

            rs.Open strsql,strconn, adOpenStatic,adLockOptimistic

 

            if rs.eof and rs.bof then

                        strTemp= "No data found"

            else

                        // separate rows using ";;" and columns using  ";"

                       

                         strTemp =  rs.Getstring(,,";",";;")

            end if

            // asign the string to the function

           

            getRemoteData = strTemp

    rs.Close

    set rs.ActiveConnection = nothing

    set rs = nothing

end function

</script>

</head>

<body>

</body>

</html>

 

end of server side