Problem with search using pagination in a data table

View: New views
8 Messages — Rating Filter:   Alert me  

Problem with search using pagination in a data table

by sumeenkaur :: Rate this Message:

Reply to Author | View Threaded | Show Only this Message

Hi


Check on the link http://oleg.sleeplms.net/

Click 'Lab Management'. Click 'Referral and test'. Click any test.
An edit page opens where one can see the button 'Select Patient'.
Click that button.

A yui data table is created with a search feature. Since the table has more than 20 records, it displays pagination.

The search feature works in the following way:
I enter say 'F' in search input box and the data table list reduces to all patients with letter F in their last name.

Search works fine on the first page but if i go second page by clicking 2, and repeat the above steps, i get the following error.

I[T] is undefined
on datatable-min.js at Line 16

But if i enter some more data in the search input box, it works fine.

I can not figure out how to fix this. Any help would be appreciated.

Here is the code.

YAHOO.namespace ("protech");

var Dom = YAHOO.util.Dom;
var Event = YAHOO.util.Event;
var myDataTable = null;
var myDataSource = null;
var parameters = null;
var ind;
var jsonstring=null;
var fieldsArray = [];
var texttosearch='';
var textinsearch='';
var search='';
var pag=null;
var oRecord_temp=[];
var oRecord_index=0;
var specialChars = ['@','#',':', ' ', '$','%','^','&','*','(',')','=','-','_','}','{',']','[','>','<','\'','"','.',';','?','/','!','+','\\','|',',','`','~','\n','\r'];


function reducesearchlist(temp){
    texttosearch  = Dom.get('queryInput'+temp).value;
        if (texttosearch==''){
                clearfilter(temp);
        }else{
                testsearch(temp);
               
        }
       
}



function testsearch(temp){
    texttosearch  = Dom.get('queryInput'+temp).value;
    textinsearchvalue = Dom.get('search_columns'+temp).value;
    arr = Dom.get('search_columns'+temp).options;
    textinsearch = arr[textinsearchvalue].text;
    search='yes';
    var oCallback2 = {
        success : function(oRequest, oResponse, oPayload){
            myDataTable.onDataReturnInitializeTable(oRequest, oResponse, oPayload);
            var newState = {
                totalRecords :  oPayload.totalRecords
            };
            pag.setState(newState);
        },
                failure:function(oRequest, oResponse, oPayload){
                },
        scope : myDataTable,
        argument : myDataTable.getState()
    };
       
    for (sp=0;sp<specialChars.length;sp++){
        temp=textinsearch.split(specialChars[sp]);
        splen = temp.length;
               
        for (spl=1;spl<=splen;spl++){
            textinsearch =  textinsearch.replace(specialChars[sp],'');
        }
    }
    queryString = "&insearch="+textinsearch+"&dir=asc&startIndex=0&results=25";
 
    myDataSource.sendRequest('&sort='+fieldsArray[0].key+'&search='+search+'&query=' + texttosearch+queryString, oCallback2,myDataTable,true);
       
}


function test(temp,cmd){

    search="";
    textinsearch="";
    texttosearch="";
    var ind = temp;

    var elementid = Dom.get('reference'+ind);
    Dom.setStyle(elementid,'display','none');

    var searchid = Dom.get('search'+ind);
    Dom.setStyle(searchid,'display','');

    var okcancelid = Dom.get('okcancel'+ind);
    Dom.setStyle(okcancelid,'display','');

    var tablediv = 'dynamicdata'+ind;


    var entityID = Dom.get('hid_entity').value;



    var instanceID = Dom.get('hid_ins').value;


    if(gup('reportName')){
        reportID = gup('reportName');
    }

    if(gup('module')){
        var module = gup('module');
    }

    var columnHeaders = [];

    var header_array = [];
       
    if(!header_array) return;
    var myColumnDefs = [];
    var summaryAddresses = [];
    //var fieldsArray = [];
       

    var formatUrl = function(elCell, oRecord, oColumn, sData) {
        if(sData){
             
            //elCell.innerHTML = "<a href='" + oRecord.getData("editurl") + "'>" + sData + "</a>";
                                                       
            elCell.innerHTML = '<span instance="' + oRecord.getData("instance_index_temp") + '">' + sData + '</span>';
                               
        }
    };
       
    registerStr = '';
    var st =cmd + '~~|~~' + ind + '~~|~~' + registerStr;
    // Custom parser
    var lmsParser = function(sData) {
        if(sData){
            var array = sData.split("/");
            temp=new Date(array[0] + " " + array[1] + ", " + array[2]);
            return temp;
        }
    };
       
       
    if(module == 'lms'){
        //parameters = {entityID: 7, pageName: 'module', asynchronous: true, func:'gettableheaders',module:'lms'};
        var parameters= {
            refID:temp,
            pageName:'module',
            asynchronous: true,
            func:'getreferencetableheaders',
            module:'lms'
        };
    }
    else if(module == 'reportcreator'){
        var parameters = {
            reportName: reportName,
            pageName: 'module',
            asynchronous: true,
            func:'getreporttableheaders',
            module:'reportcreator'
        };
    }

    new Ajax.Request('index.php',
    {
        method:'get',
        parameters: parameters,
        onSuccess: function(transport){
            var response = transport.responseText || "Error";
     
            header_array = eval(response);
            if(header_array.length) {
                for(i=0;i<header_array.length;i++){
                       
                    var clean_header =  header_array[i].name.replace(/ /g,'');
                    clean_header =  clean_header.replace(/:/g,'');
                    for (sp=0;sp<specialChars.length;sp++){
                        temp=clean_header.split(specialChars[sp]);
                        splen = temp.length;
                                               
                        for (spl=1;spl<=splen;spl++){
                            clean_header =  clean_header.replace(specialChars[sp],'');
                        }
                    }
                                       
                    summaryAddresses[i] = header_array[i].address;
             
                    if(header_array[i].AtomicTypeID==7){
                        fieldsArray[i] = {
                            key:clean_header
                        };
                        myColumnDefs[i] = {
                            key:clean_header,
                            label:header_array[i].name,
                            sortable:true,
                            formatter:formatUrl
                        };
                    }
                    else{
                        fieldsArray[i] = {
                            key:clean_header
                        };
                        myColumnDefs[i] = {
                            key:clean_header,
                            label:header_array[i].name,
                            sortable:true,
                            formatter:formatUrl
                        };
                    }
                }
                fieldsArray[i]={
                    key:"editurl"
                };
                i++;
                fieldsArray[i]={
                    key:"instance_index_temp"
                };
                jsonString = Object.toJSON(summaryAddresses);
                       
                //We have our header array. Now, let's get the data for the table
                myDataSource = new YAHOO.util.DataSource("index.php?module=lms&func=getreferencetabledata&addresses="+jsonString+'&');
                               
                myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
       
                myDataSource.responseSchema = {
                    resultsList: "records",
                    fields: fieldsArray,
                    metaFields: {
                        totalRecords: "totalRecords" // Access to value in the server response
                    }
                };

                // Paginator configurations

                pag = new YAHOO.widget.Paginator({
                    rowsPerPage : 20,
                    alwaysVisible : false,
                    template:YAHOO.widget.Paginator.TEMPLATE_ROWS_PER_PAGE,
                    rowsPerPageOptions: [20,50,100]
                });

   

                // DataTable configuration

                var myConfigs = {
                    initialRequest: "&sort="+fieldsArray[0].key+"&search="+search+"&query="+texttosearch+"&insearch="+textinsearch+"&dir=asc&startIndex=0&results=25", // Initial request for first page of data
                    dynamicData: true, // Enables dynamic server-driven data
                    sortedBy : {
                        key:fieldsArray[0].key,
                        dir:YAHOO.widget.DataTable.CLASS_ASC
                    }, // Sets UI initial sort arrow
                    selectionMode:"single",
                    paginator:pag
                };
       
                myDataTable = new YAHOO.widget.DataTable(tablediv, myColumnDefs, myDataSource, myConfigs);
   
                // Subscribe to events for row selection
                myDataTable.subscribe("rowMouseoverEvent", myDataTable.onEventHighlightRow);
                myDataTable.subscribe("rowMouseoutEvent", myDataTable.onEventUnhighlightRow);
                myDataTable.subscribe("rowClickEvent", myDataTable.onEventSelectRow);
       
                // Update totalRecords on the fly with value from server
                myDataTable.handleDataReturnPayload = function(oRequest, oResponse, oPayload) {
                    oPayload.totalRecords = oResponse.meta.totalRecords;
                            var rowsperpg = pag.getRowsPerPage();
                                        var noofpages  = oPayload.totalRecords/rowsperpg;
                                        if (noofpages>1){
                                                expandSearch(ind);
                                        }
                    return oPayload;
                }
   
       
                // Override function for custom server-side sorting
                myDataTable.sortColumn = function(oColumn) {
                    // Default descending
                    var sDir = "asc"
                 
                    // If already sorted, sort in opposite direction
                    if(oColumn.key === myDataTable.get("sortedBy").key) {
                        sDir = (myDataTable.get("sortedBy").dir === YAHOO.widget.DataTable.CLASS_ASC) ?
                        "desc" : "asc";
                    }

                    // Pass in sort values to server request
                    var newRequest = "&search="+search+"&query="+texttosearch+"&insearch="+textinsearch+"&sort=" + oColumn.key + "&dir=" + sDir + "&startIndex=0"+"&results=25";
                 
                    // Create callback for data request
                    var oCallback = {
                        success : function(oRequest, oResponse, oPayload){
                            myDataTable.onDataReturnInitializeTable(oRequest, oResponse, oPayload);
                            var newState = {
                                totalRecords :  oPayload.totalRecords
                            };
                            pag.setState(newState);
                        },
                       
                        scope: myDataTable,
                        argument: {
                            // Pass in sort values so UI can be updated in callback function
                            sorting: {
                                key: oColumn.key,
                                dir: (sDir === "desc") ? YAHOO.widget.DataTable.CLASS_DESC : YAHOO.widget.DataTable.CLASS_ASC
                            }
                        }
                    }
                 
                    // Send the request
                    myDataSource.sendRequest(newRequest, oCallback,myDataTable,true);
                };
       
                return {
                    ds: myDataSource,
                    dt: myDataTable
                };


             
                     
     
            }

        }
    });
}




Re: Problem with search using pagination in a data table

by Satyam-3 :: Rate this Message:

Reply to Author | View Threaded | Show Only this Message

The error is in minified code, there is no way to make sense of it.  Can
you change datatable-min.js and use datatable.js instead?

Satyam

sumeenkaur escribió:

> Hi
>
>
> Check on the link http://oleg.sleeplms.net/
>
> Click 'Lab Management'. Click 'Referral and test'. Click any test.
> An edit page opens where one can see the button 'Select Patient'.
> Click that button.
>
> A yui data table is created with a search feature. Since the table has more than 20 records, it displays pagination.
>
> The search feature works in the following way:
> I enter say 'F' in search input box and the data table list reduces to all patients with letter F in their last name.
>
> Search works fine on the first page but if i go second page by clicking 2, and repeat the above steps, i get the following error.
>
> I[T] is undefined
> on datatable-min.js at Line 16
>
> But if i enter some more data in the search input box, it works fine.
>
> I can not figure out how to fix this. Any help would be appreciated.
>
> Here is the code.
>
> YAHOO.namespace ("protech");
>
> var Dom = YAHOO.util.Dom;
> var Event = YAHOO.util.Event;
> var myDataTable = null;
> var myDataSource = null;
> var parameters = null;
> var ind;
> var jsonstring=null;
> var fieldsArray = [];
> var texttosearch='';
> var textinsearch='';
> var search='';
> var pag=null;
> var oRecord_temp=[];
> var oRecord_index=0;
> var specialChars = ['@','#',':', ' ', '$','%','^','&','*','(',')','=','-','_','}','{',']','[','>','<','\'','"','.',';','?','/','!','+','\\','|',',','`','~','\n','\r'];
>
>
> function reducesearchlist(temp){
>     texttosearch  = Dom.get('queryInput'+temp).value;
> if (texttosearch==''){
> clearfilter(temp);
> }else{
> testsearch(temp);
>
> }
>
> }
>
>
>
> function testsearch(temp){
>     texttosearch  = Dom.get('queryInput'+temp).value;
>     textinsearchvalue = Dom.get('search_columns'+temp).value;
>     arr = Dom.get('search_columns'+temp).options;
>     textinsearch = arr[textinsearchvalue].text;
>     search='yes';
>     var oCallback2 = {
>         success : function(oRequest, oResponse, oPayload){
>             myDataTable.onDataReturnInitializeTable(oRequest, oResponse, oPayload);
>             var newState = {
>                 totalRecords :  oPayload.totalRecords
>             };
>             pag.setState(newState);
>         },
> failure:function(oRequest, oResponse, oPayload){
> },
>         scope : myDataTable,
>         argument : myDataTable.getState()
>     };
>
>     for (sp=0;sp<specialChars.length;sp++){
>         temp=textinsearch.split(specialChars[sp]);
>         splen = temp.length;
>
>         for (spl=1;spl<=splen;spl++){
>             textinsearch =  textinsearch.replace(specialChars[sp],'');
>         }
>     }
>     queryString = "&insearch="+textinsearch+"&dir=asc&startIndex=0&results=25";
>  
>     myDataSource.sendRequest('&sort='+fieldsArray[0].key+'&search='+search+'&query=' + texttosearch+queryString, oCallback2,myDataTable,true);
>
> }
>
>
> function test(temp,cmd){
>
>     search="";
>     textinsearch="";
>     texttosearch="";
>     var ind = temp;
>
>     var elementid = Dom.get('reference'+ind);
>     Dom.setStyle(elementid,'display','none');
>
>     var searchid = Dom.get('search'+ind);
>     Dom.setStyle(searchid,'display','');
>
>     var okcancelid = Dom.get('okcancel'+ind);
>     Dom.setStyle(okcancelid,'display','');
>
>     var tablediv = 'dynamicdata'+ind;
>
>
>     var entityID = Dom.get('hid_entity').value;
>
>
>
>     var instanceID = Dom.get('hid_ins').value;
>
>
>     if(gup('reportName')){
>         reportID = gup('reportName');
>     }
>
>     if(gup('module')){
>         var module = gup('module');
>     }
>
>     var columnHeaders = [];
>
>     var header_array = [];
>
>     if(!header_array) return;
>     var myColumnDefs = [];
>     var summaryAddresses = [];
>     //var fieldsArray = [];
>
>
>     var formatUrl = function(elCell, oRecord, oColumn, sData) {
>         if(sData){
>    
>             //elCell.innerHTML = "<a href='" + oRecord.getData("editurl") + "'>" + sData + "</a>";
>
>             elCell.innerHTML = '<span instance="' + oRecord.getData("instance_index_temp") + '">' + sData + '</span>';
>
>         }
>     };
>
>     registerStr = '';
>     var st =cmd + '~~|~~' + ind + '~~|~~' + registerStr;
>     // Custom parser
>     var lmsParser = function(sData) {
>         if(sData){
>             var array = sData.split("/");
>             temp=new Date(array[0] + " " + array[1] + ", " + array[2]);
>             return temp;
>         }
>     };
>
>
>     if(module == 'lms'){
>         //parameters = {entityID: 7, pageName: 'module', asynchronous: true, func:'gettableheaders',module:'lms'};
>         var parameters= {
>             refID:temp,
>             pageName:'module',
>             asynchronous: true,
>             func:'getreferencetableheaders',
>             module:'lms'
>         };
>     }
>     else if(module == 'reportcreator'){
>         var parameters = {
>             reportName: reportName,
>             pageName: 'module',
>             asynchronous: true,
>             func:'getreporttableheaders',
>             module:'reportcreator'
>         };
>     }
>
>     new Ajax.Request('index.php',
>     {
>         method:'get',
>         parameters: parameters,
>         onSuccess: function(transport){
>             var response = transport.responseText || "Error";
>      
>             header_array = eval(response);
>             if(header_array.length) {
>                 for(i=0;i<header_array.length;i++){
>
>                     var clean_header =  header_array[i].name.replace(/ /g,'');
>                     clean_header =  clean_header.replace(/:/g,'');
>                     for (sp=0;sp<specialChars.length;sp++){
>                         temp=clean_header.split(specialChars[sp]);
>                         splen = temp.length;
>
>                         for (spl=1;spl<=splen;spl++){
>                             clean_header =  clean_header.replace(specialChars[sp],'');
>                         }
>                     }
>
>                     summaryAddresses[i] = header_array[i].address;
>              
>                     if(header_array[i].AtomicTypeID==7){
>                         fieldsArray[i] = {
>                             key:clean_header
>                         };
>                         myColumnDefs[i] = {
>                             key:clean_header,
>                             label:header_array[i].name,
>                             sortable:true,
>                             formatter:formatUrl
>                         };
>                     }
>                     else{
>                         fieldsArray[i] = {
>                             key:clean_header
>                         };
>                         myColumnDefs[i] = {
>                             key:clean_header,
>                             label:header_array[i].name,
>                             sortable:true,
>                             formatter:formatUrl
>                         };
>                     }
>                 }
>                 fieldsArray[i]={
>                     key:"editurl"
>                 };
>                 i++;
>                 fieldsArray[i]={
>                     key:"instance_index_temp"
>                 };
>                 jsonString = Object.toJSON(summaryAddresses);
>
>                 //We have our header array. Now, let's get the data for the table
>                 myDataSource = new YAHOO.util.DataSource("index.php?module=lms&func=getreferencetabledata&addresses="+jsonString+'&');
>
>                 myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
>        
>                 myDataSource.responseSchema = {
>                     resultsList: "records",
>                     fields: fieldsArray,
>                     metaFields: {
>                         totalRecords: "totalRecords" // Access to value in the server response
>                     }
>                 };
>
>                 // Paginator configurations
>
>                 pag = new YAHOO.widget.Paginator({
>                     rowsPerPage : 20,
>                     alwaysVisible : false,
>                     template:YAHOO.widget.Paginator.TEMPLATE_ROWS_PER_PAGE,
>                     rowsPerPageOptions: [20,50,100]
>                 });
>
>    
>
>                 // DataTable configuration
>
>                 var myConfigs = {
>                     initialRequest: "&sort="+fieldsArray[0].key+"&search="+search+"&query="+texttosearch+"&insearch="+textinsearch+"&dir=asc&startIndex=0&results=25", // Initial request for first page of data
>                     dynamicData: true, // Enables dynamic server-driven data
>                     sortedBy : {
>                         key:fieldsArray[0].key,
>                         dir:YAHOO.widget.DataTable.CLASS_ASC
>                     }, // Sets UI initial sort arrow
>                     selectionMode:"single",
>                     paginator:pag
>                 };
>
>                 myDataTable = new YAHOO.widget.DataTable(tablediv, myColumnDefs, myDataSource, myConfigs);
>    
>                 // Subscribe to events for row selection
>                 myDataTable.subscribe("rowMouseoverEvent", myDataTable.onEventHighlightRow);
>                 myDataTable.subscribe("rowMouseoutEvent", myDataTable.onEventUnhighlightRow);
>                 myDataTable.subscribe("rowClickEvent", myDataTable.onEventSelectRow);
>        
>                 // Update totalRecords on the fly with value from server
>                 myDataTable.handleDataReturnPayload = function(oRequest, oResponse, oPayload) {
>                     oPayload.totalRecords = oResponse.meta.totalRecords;
>            var rowsperpg = pag.getRowsPerPage();
> var noofpages  = oPayload.totalRecords/rowsperpg;
> if (noofpages>1){
> expandSearch(ind);
> }
>                     return oPayload;
>                 }
>    
>
>                 // Override function for custom server-side sorting
>                 myDataTable.sortColumn = function(oColumn) {
>                     // Default descending
>                     var sDir = "asc"
>
>                     // If already sorted, sort in opposite direction
>                     if(oColumn.key === myDataTable.get("sortedBy").key) {
>                         sDir = (myDataTable.get("sortedBy").dir === YAHOO.widget.DataTable.CLASS_ASC) ?
>                         "desc" : "asc";
>                     }
>
>                     // Pass in sort values to server request
>                     var newRequest = "&search="+search+"&query="+texttosearch+"&insearch="+textinsearch+"&sort=" + oColumn.key + "&dir=" + sDir + "&startIndex=0"+"&results=25";
>
>                     // Create callback for data request
>                     var oCallback = {
>                         success : function(oRequest, oResponse, oPayload){
>                             myDataTable.onDataReturnInitializeTable(oRequest, oResponse, oPayload);
>                             var newState = {
>                                 totalRecords :  oPayload.totalRecords
>                             };
>                             pag.setState(newState);
>                         },
>
>                         scope: myDataTable,
>                         argument: {
>                             // Pass in sort values so UI can be updated in callback function
>                             sorting: {
>                                 key: oColumn.key,
>                                 dir: (sDir === "desc") ? YAHOO.widget.DataTable.CLASS_DESC : YAHOO.widget.DataTable.CLASS_ASC
>                             }
>                         }
>                     }
>
>                     // Send the request
>                     myDataSource.sendRequest(newRequest, oCallback,myDataTable,true);
>                 };
>
>                 return {
>                     ds: myDataSource,
>                     dt: myDataTable
>                 };
>
>
>              
>            
>      
>             }
>
>         }
>     });
> }
>
>
>
>
>
> ------------------------------------
>
> Yahoo! Groups Links
>
>
>
> ------------------------------------------------------------------------
>
>
> No virus found in this incoming message.
> Checked by AVG - www.avg.com
> Version: 9.0.698 / Virus Database: 270.14.47/2478 - Release Date: 11/03/09 08:36:00
>
>  

Re: Problem with search using pagination in a data table

by sumeenkaur :: Rate this Message:

Reply to Author | View Threaded | Show Only this Message

ok..if i replace it with datatable.js, i get this error

allRecords[i] is undefined at datatable.js on Line 7220

Let me know if u find anyhting





--- In ydn-javascript@..., Satyam <satyam@...> wrote:

>
> The error is in minified code, there is no way to make sense of it.  Can
> you change datatable-min.js and use datatable.js instead?
>
> Satyam
>
> sumeenkaur escribió:
> > Hi
> >
> >
> > Check on the link http://oleg.sleeplms.net/
> >
> > Click 'Lab Management'. Click 'Referral and test'. Click any test.
> > An edit page opens where one can see the button 'Select Patient'.
> > Click that button.
> >
> > A yui data table is created with a search feature. Since the table has more than 20 records, it displays pagination.
> >
> > The search feature works in the following way:
> > I enter say 'F' in search input box and the data table list reduces to all patients with letter F in their last name.
> >
> > Search works fine on the first page but if i go second page by clicking 2, and repeat the above steps, i get the following error.
> >
> > I[T] is undefined
> > on datatable-min.js at Line 16
> >
> > But if i enter some more data in the search input box, it works fine.
> >
> > I can not figure out how to fix this. Any help would be appreciated.
> >
> > Here is the code.
> >
> > YAHOO.namespace ("protech");
> >
> > var Dom = YAHOO.util.Dom;
> > var Event = YAHOO.util.Event;
> > var myDataTable = null;
> > var myDataSource = null;
> > var parameters = null;
> > var ind;
> > var jsonstring=null;
> > var fieldsArray = [];
> > var texttosearch='';
> > var textinsearch='';
> > var search='';
> > var pag=null;
> > var oRecord_temp=[];
> > var oRecord_index=0;
> > var specialChars = ['@','#',':', ' ', '$','%','^','&','*','(',')','=','-','_','}','{',']','[','>','<','\'','"','.',';','?','/','!','+','\\','|',',','`','~','\n','\r'];
> >
> >
> > function reducesearchlist(temp){
> >     texttosearch  = Dom.get('queryInput'+temp).value;
> > if (texttosearch==''){
> > clearfilter(temp);
> > }else{
> > testsearch(temp);
> >
> > }
> >
> > }
> >
> >
> >
> > function testsearch(temp){
> >     texttosearch  = Dom.get('queryInput'+temp).value;
> >     textinsearchvalue = Dom.get('search_columns'+temp).value;
> >     arr = Dom.get('search_columns'+temp).options;
> >     textinsearch = arr[textinsearchvalue].text;
> >     search='yes';
> >     var oCallback2 = {
> >         success : function(oRequest, oResponse, oPayload){
> >             myDataTable.onDataReturnInitializeTable(oRequest, oResponse, oPayload);
> >             var newState = {
> >                 totalRecords :  oPayload.totalRecords
> >             };
> >             pag.setState(newState);
> >         },
> > failure:function(oRequest, oResponse, oPayload){
> > },
> >         scope : myDataTable,
> >         argument : myDataTable.getState()
> >     };
> >
> >     for (sp=0;sp<specialChars.length;sp++){
> >         temp=textinsearch.split(specialChars[sp]);
> >         splen = temp.length;
> >
> >         for (spl=1;spl<=splen;spl++){
> >             textinsearch =  textinsearch.replace(specialChars[sp],'');
> >         }
> >     }
> >     queryString = "&insearch="+textinsearch+"&dir=asc&startIndex=0&results=25";
> >  
> >     myDataSource.sendRequest('&sort='+fieldsArray[0].key+'&search='+search+'&query=' + texttosearch+queryString, oCallback2,myDataTable,true);
> >
> > }
> >
> >
> > function test(temp,cmd){
> >
> >     search="";
> >     textinsearch="";
> >     texttosearch="";
> >     var ind = temp;
> >
> >     var elementid = Dom.get('reference'+ind);
> >     Dom.setStyle(elementid,'display','none');
> >
> >     var searchid = Dom.get('search'+ind);
> >     Dom.setStyle(searchid,'display','');
> >
> >     var okcancelid = Dom.get('okcancel'+ind);
> >     Dom.setStyle(okcancelid,'display','');
> >
> >     var tablediv = 'dynamicdata'+ind;
> >
> >
> >     var entityID = Dom.get('hid_entity').value;
> >
> >
> >
> >     var instanceID = Dom.get('hid_ins').value;
> >
> >
> >     if(gup('reportName')){
> >         reportID = gup('reportName');
> >     }
> >
> >     if(gup('module')){
> >         var module = gup('module');
> >     }
> >
> >     var columnHeaders = [];
> >
> >     var header_array = [];
> >
> >     if(!header_array) return;
> >     var myColumnDefs = [];
> >     var summaryAddresses = [];
> >     //var fieldsArray = [];
> >
> >
> >     var formatUrl = function(elCell, oRecord, oColumn, sData) {
> >         if(sData){
> >    
> >             //elCell.innerHTML = "<a href='" + oRecord.getData("editurl") + "'>" + sData + "</a>";
> >
> >             elCell.innerHTML = '<span instance="' + oRecord.getData("instance_index_temp") + '">' + sData + '</span>';
> >
> >         }
> >     };
> >
> >     registerStr = '';
> >     var st =cmd + '~~|~~' + ind + '~~|~~' + registerStr;
> >     // Custom parser
> >     var lmsParser = function(sData) {
> >         if(sData){
> >             var array = sData.split("/");
> >             temp=new Date(array[0] + " " + array[1] + ", " + array[2]);
> >             return temp;
> >         }
> >     };
> >
> >
> >     if(module == 'lms'){
> >         //parameters = {entityID: 7, pageName: 'module', asynchronous: true, func:'gettableheaders',module:'lms'};
> >         var parameters= {
> >             refID:temp,
> >             pageName:'module',
> >             asynchronous: true,
> >             func:'getreferencetableheaders',
> >             module:'lms'
> >         };
> >     }
> >     else if(module == 'reportcreator'){
> >         var parameters = {
> >             reportName: reportName,
> >             pageName: 'module',
> >             asynchronous: true,
> >             func:'getreporttableheaders',
> >             module:'reportcreator'
> >         };
> >     }
> >
> >     new Ajax.Request('index.php',
> >     {
> >         method:'get',
> >         parameters: parameters,
> >         onSuccess: function(transport){
> >             var response = transport.responseText || "Error";
> >      
> >             header_array = eval(response);
> >             if(header_array.length) {
> >                 for(i=0;i<header_array.length;i++){
> >
> >                     var clean_header =  header_array[i].name.replace(/ /g,'');
> >                     clean_header =  clean_header.replace(/:/g,'');
> >                     for (sp=0;sp<specialChars.length;sp++){
> >                         temp=clean_header.split(specialChars[sp]);
> >                         splen = temp.length;
> >
> >                         for (spl=1;spl<=splen;spl++){
> >                             clean_header =  clean_header.replace(specialChars[sp],'');
> >                         }
> >                     }
> >
> >                     summaryAddresses[i] = header_array[i].address;
> >              
> >                     if(header_array[i].AtomicTypeID==7){
> >                         fieldsArray[i] = {
> >                             key:clean_header
> >                         };
> >                         myColumnDefs[i] = {
> >                             key:clean_header,
> >                             label:header_array[i].name,
> >                             sortable:true,
> >                             formatter:formatUrl
> >                         };
> >                     }
> >                     else{
> >                         fieldsArray[i] = {
> >                             key:clean_header
> >                         };
> >                         myColumnDefs[i] = {
> >                             key:clean_header,
> >                             label:header_array[i].name,
> >                             sortable:true,
> >                             formatter:formatUrl
> >                         };
> >                     }
> >                 }
> >                 fieldsArray[i]={
> >                     key:"editurl"
> >                 };
> >                 i++;
> >                 fieldsArray[i]={
> >                     key:"instance_index_temp"
> >                 };
> >                 jsonString = Object.toJSON(summaryAddresses);
> >
> >                 //We have our header array. Now, let's get the data for the table
> >                 myDataSource = new YAHOO.util.DataSource("index.php?module=lms&func=getreferencetabledata&addresses="+jsonString+'&');
> >
> >                 myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
> >        
> >                 myDataSource.responseSchema = {
> >                     resultsList: "records",
> >                     fields: fieldsArray,
> >                     metaFields: {
> >                         totalRecords: "totalRecords" // Access to value in the server response
> >                     }
> >                 };
> >
> >                 // Paginator configurations
> >
> >                 pag = new YAHOO.widget.Paginator({
> >                     rowsPerPage : 20,
> >                     alwaysVisible : false,
> >                     template:YAHOO.widget.Paginator.TEMPLATE_ROWS_PER_PAGE,
> >                     rowsPerPageOptions: [20,50,100]
> >                 });
> >
> >    
> >
> >                 // DataTable configuration
> >
> >                 var myConfigs = {
> >                     initialRequest: "&sort="+fieldsArray[0].key+"&search="+search+"&query="+texttosearch+"&insearch="+textinsearch+"&dir=asc&startIndex=0&results=25", // Initial request for first page of data
> >                     dynamicData: true, // Enables dynamic server-driven data
> >                     sortedBy : {
> >                         key:fieldsArray[0].key,
> >                         dir:YAHOO.widget.DataTable.CLASS_ASC
> >                     }, // Sets UI initial sort arrow
> >                     selectionMode:"single",
> >                     paginator:pag
> >                 };
> >
> >                 myDataTable = new YAHOO.widget.DataTable(tablediv, myColumnDefs, myDataSource, myConfigs);
> >    
> >                 // Subscribe to events for row selection
> >                 myDataTable.subscribe("rowMouseoverEvent", myDataTable.onEventHighlightRow);
> >                 myDataTable.subscribe("rowMouseoutEvent", myDataTable.onEventUnhighlightRow);
> >                 myDataTable.subscribe("rowClickEvent", myDataTable.onEventSelectRow);
> >        
> >                 // Update totalRecords on the fly with value from server
> >                 myDataTable.handleDataReturnPayload = function(oRequest, oResponse, oPayload) {
> >                     oPayload.totalRecords = oResponse.meta.totalRecords;
> >            var rowsperpg = pag.getRowsPerPage();
> > var noofpages  = oPayload.totalRecords/rowsperpg;
> > if (noofpages>1){
> > expandSearch(ind);
> > }
> >                     return oPayload;
> >                 }
> >    
> >
> >                 // Override function for custom server-side sorting
> >                 myDataTable.sortColumn = function(oColumn) {
> >                     // Default descending
> >                     var sDir = "asc"
> >
> >                     // If already sorted, sort in opposite direction
> >                     if(oColumn.key === myDataTable.get("sortedBy").key) {
> >                         sDir = (myDataTable.get("sortedBy").dir === YAHOO.widget.DataTable.CLASS_ASC) ?
> >                         "desc" : "asc";
> >                     }
> >
> >                     // Pass in sort values to server request
> >                     var newRequest = "&search="+search+"&query="+texttosearch+"&insearch="+textinsearch+"&sort=" + oColumn.key + "&dir=" + sDir + "&startIndex=0"+"&results=25";
> >
> >                     // Create callback for data request
> >                     var oCallback = {
> >                         success : function(oRequest, oResponse, oPayload){
> >                             myDataTable.onDataReturnInitializeTable(oRequest, oResponse, oPayload);
> >                             var newState = {
> >                                 totalRecords :  oPayload.totalRecords
> >                             };
> >                             pag.setState(newState);
> >                         },
> >
> >                         scope: myDataTable,
> >                         argument: {
> >                             // Pass in sort values so UI can be updated in callback function
> >                             sorting: {
> >                                 key: oColumn.key,
> >                                 dir: (sDir === "desc") ? YAHOO.widget.DataTable.CLASS_DESC : YAHOO.widget.DataTable.CLASS_ASC
> >                             }
> >                         }
> >                     }
> >
> >                     // Send the request
> >                     myDataSource.sendRequest(newRequest, oCallback,myDataTable,true);
> >                 };
> >
> >                 return {
> >                     ds: myDataSource,
> >                     dt: myDataTable
> >                 };
> >
> >
> >              
> >            
> >      
> >             }
> >
> >         }
> >     });
> > }
> >
> >
> >
> >
> >
> > ------------------------------------
> >
> > Yahoo! Groups Links
> >
> >
> >
> > ------------------------------------------------------------------------
> >
> >
> > No virus found in this incoming message.
> > Checked by AVG - www.avg.com
> > Version: 9.0.698 / Virus Database: 270.14.47/2478 - Release Date: 11/03/09 08:36:00
> >
> >
>



Re: Re: Problem with search using pagination in a data table

by Satyam-3 :: Rate this Message:

Reply to Author | View Threaded | Show Only this Message

If you could change that in the working example, we could put a
breakpoint at the point of failure and see the state of the variables
and the call stack.

sumeenkaur escribió:

> ok..if i replace it with datatable.js, i get this error
>
> allRecords[i] is undefined at datatable.js on Line 7220
>
> Let me know if u find anyhting
>
>
>
>
>
> --- In ydn-javascript@..., Satyam <satyam@...> wrote:
>  
>> The error is in minified code, there is no way to make sense of it.  Can
>> you change datatable-min.js and use datatable.js instead?
>>
>> Satyam
>>
>> sumeenkaur escribió:
>>    
>>> Hi
>>>
>>>
>>> Check on the link http://oleg.sleeplms.net/
>>>
>>> Click 'Lab Management'. Click 'Referral and test'. Click any test.
>>> An edit page opens where one can see the button 'Select Patient'.
>>> Click that button.
>>>
>>> A yui data table is created with a search feature. Since the table has more than 20 records, it displays pagination.
>>>
>>> The search feature works in the following way:
>>> I enter say 'F' in search input box and the data table list reduces to all patients with letter F in their last name.
>>>
>>> Search works fine on the first page but if i go second page by clicking 2, and repeat the above steps, i get the following error.
>>>
>>> I[T] is undefined
>>> on datatable-min.js at Line 16
>>>
>>> But if i enter some more data in the search input box, it works fine.
>>>
>>> I can not figure out how to fix this. Any help would be appreciated.
>>>
>>> Here is the code.
>>>
>>> YAHOO.namespace ("protech");
>>>
>>> var Dom = YAHOO.util.Dom;
>>> var Event = YAHOO.util.Event;
>>> var myDataTable = null;
>>> var myDataSource = null;
>>> var parameters = null;
>>> var ind;
>>> var jsonstring=null;
>>> var fieldsArray = [];
>>> var texttosearch='';
>>> var textinsearch='';
>>> var search='';
>>> var pag=null;
>>> var oRecord_temp=[];
>>> var oRecord_index=0;
>>> var specialChars = ['@','#',':', ' ', '$','%','^','&','*','(',')','=','-','_','}','{',']','[','>','<','\'','"','.',';','?','/','!','+','\\','|',',','`','~','\n','\r'];
>>>
>>>
>>> function reducesearchlist(temp){
>>>     texttosearch  = Dom.get('queryInput'+temp).value;
>>> if (texttosearch==''){
>>> clearfilter(temp);
>>> }else{
>>> testsearch(temp);
>>>
>>> }
>>>
>>> }
>>>
>>>
>>>
>>> function testsearch(temp){
>>>     texttosearch  = Dom.get('queryInput'+temp).value;
>>>     textinsearchvalue = Dom.get('search_columns'+temp).value;
>>>     arr = Dom.get('search_columns'+temp).options;
>>>     textinsearch = arr[textinsearchvalue].text;
>>>     search='yes';
>>>     var oCallback2 = {
>>>         success : function(oRequest, oResponse, oPayload){
>>>             myDataTable.onDataReturnInitializeTable(oRequest, oResponse, oPayload);
>>>             var newState = {
>>>                 totalRecords :  oPayload.totalRecords
>>>             };
>>>             pag.setState(newState);
>>>         },
>>> failure:function(oRequest, oResponse, oPayload){
>>> },
>>>         scope : myDataTable,
>>>         argument : myDataTable.getState()
>>>     };
>>>
>>>     for (sp=0;sp<specialChars.length;sp++){
>>>         temp=textinsearch.split(specialChars[sp]);
>>>         splen = temp.length;
>>>
>>>         for (spl=1;spl<=splen;spl++){
>>>             textinsearch =  textinsearch.replace(specialChars[sp],'');
>>>         }
>>>     }
>>>     queryString = "&insearch="+textinsearch+"&dir=asc&startIndex=0&results=25";
>>>  
>>>     myDataSource.sendRequest('&sort='+fieldsArray[0].key+'&search='+search+'&query=' + texttosearch+queryString, oCallback2,myDataTable,true);
>>>
>>> }
>>>
>>>
>>> function test(temp,cmd){
>>>
>>>     search="";
>>>     textinsearch="";
>>>     texttosearch="";
>>>     var ind = temp;
>>>
>>>     var elementid = Dom.get('reference'+ind);
>>>     Dom.setStyle(elementid,'display','none');
>>>
>>>     var searchid = Dom.get('search'+ind);
>>>     Dom.setStyle(searchid,'display','');
>>>
>>>     var okcancelid = Dom.get('okcancel'+ind);
>>>     Dom.setStyle(okcancelid,'display','');
>>>
>>>     var tablediv = 'dynamicdata'+ind;
>>>
>>>
>>>     var entityID = Dom.get('hid_entity').value;
>>>
>>>
>>>
>>>     var instanceID = Dom.get('hid_ins').value;
>>>
>>>
>>>     if(gup('reportName')){
>>>         reportID = gup('reportName');
>>>     }
>>>
>>>     if(gup('module')){
>>>         var module = gup('module');
>>>     }
>>>
>>>     var columnHeaders = [];
>>>
>>>     var header_array = [];
>>>
>>>     if(!header_array) return;
>>>     var myColumnDefs = [];
>>>     var summaryAddresses = [];
>>>     //var fieldsArray = [];
>>>
>>>
>>>     var formatUrl = function(elCell, oRecord, oColumn, sData) {
>>>         if(sData){
>>>    
>>>             //elCell.innerHTML = "<a href='" + oRecord.getData("editurl") + "'>" + sData + "</a>";
>>>
>>>             elCell.innerHTML = '<span instance="' + oRecord.getData("instance_index_temp") + '">' + sData + '</span>';
>>>
>>>         }
>>>     };
>>>
>>>     registerStr = '';
>>>     var st =cmd + '~~|~~' + ind + '~~|~~' + registerStr;
>>>     // Custom parser
>>>     var lmsParser = function(sData) {
>>>         if(sData){
>>>             var array = sData.split("/");
>>>             temp=new Date(array[0] + " " + array[1] + ", " + array[2]);
>>>             return temp;
>>>         }
>>>     };
>>>
>>>
>>>     if(module == 'lms'){
>>>         //parameters = {entityID: 7, pageName: 'module', asynchronous: true, func:'gettableheaders',module:'lms'};
>>>         var parameters= {
>>>             refID:temp,
>>>             pageName:'module',
>>>             asynchronous: true,
>>>             func:'getreferencetableheaders',
>>>             module:'lms'
>>>         };
>>>     }
>>>     else if(module == 'reportcreator'){
>>>         var parameters = {
>>>             reportName: reportName,
>>>             pageName: 'module',
>>>             asynchronous: true,
>>>             func:'getreporttableheaders',
>>>             module:'reportcreator'
>>>         };
>>>     }
>>>
>>>     new Ajax.Request('index.php',
>>>     {
>>>         method:'get',
>>>         parameters: parameters,
>>>         onSuccess: function(transport){
>>>             var response = transport.responseText || "Error";
>>>      
>>>             header_array = eval(response);
>>>             if(header_array.length) {
>>>                 for(i=0;i<header_array.length;i++){
>>>
>>>                     var clean_header =  header_array[i].name.replace(/ /g,'');
>>>                     clean_header =  clean_header.replace(/:/g,'');
>>>                     for (sp=0;sp<specialChars.length;sp++){
>>>                         temp=clean_header.split(specialChars[sp]);
>>>                         splen = temp.length;
>>>
>>>                         for (spl=1;spl<=splen;spl++){
>>>                             clean_header =  clean_header.replace(specialChars[sp],'');
>>>                         }
>>>                     }
>>>
>>>                     summaryAddresses[i] = header_array[i].address;
>>>              
>>>                     if(header_array[i].AtomicTypeID==7){
>>>                         fieldsArray[i] = {
>>>                             key:clean_header
>>>                         };
>>>                         myColumnDefs[i] = {
>>>                             key:clean_header,
>>>                             label:header_array[i].name,
>>>                             sortable:true,
>>>                             formatter:formatUrl
>>>                         };
>>>                     }
>>>                     else{
>>>                         fieldsArray[i] = {
>>>                             key:clean_header
>>>                         };
>>>                         myColumnDefs[i] = {
>>>                             key:clean_header,
>>>                             label:header_array[i].name,
>>>                             sortable:true,
>>>                             formatter:formatUrl
>>>                         };
>>>                     }
>>>                 }
>>>                 fieldsArray[i]={
>>>                     key:"editurl"
>>>                 };
>>>                 i++;
>>>                 fieldsArray[i]={
>>>                     key:"instance_index_temp"
>>>                 };
>>>                 jsonString = Object.toJSON(summaryAddresses);
>>>
>>>                 //We have our header array. Now, let's get the data for the table
>>>                 myDataSource = new YAHOO.util.DataSource("index.php?module=lms&func=getreferencetabledata&addresses="+jsonString+'&');
>>>
>>>                 myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
>>>        
>>>                 myDataSource.responseSchema = {
>>>                     resultsList: "records",
>>>                     fields: fieldsArray,
>>>                     metaFields: {
>>>                         totalRecords: "totalRecords" // Access to value in the server response
>>>                     }
>>>                 };
>>>
>>>                 // Paginator configurations
>>>
>>>                 pag = new YAHOO.widget.Paginator({
>>>                     rowsPerPage : 20,
>>>                     alwaysVisible : false,
>>>                     template:YAHOO.widget.Paginator.TEMPLATE_ROWS_PER_PAGE,
>>>                     rowsPerPageOptions: [20,50,100]
>>>                 });
>>>
>>>    
>>>
>>>                 // DataTable configuration
>>>
>>>                 var myConfigs = {
>>>                     initialRequest: "&sort="+fieldsArray[0].key+"&search="+search+"&query="+texttosearch+"&insearch="+textinsearch+"&dir=asc&startIndex=0&results=25", // Initial request for first page of data
>>>                     dynamicData: true, // Enables dynamic server-driven data
>>>                     sortedBy : {
>>>                         key:fieldsArray[0].key,
>>>                         dir:YAHOO.widget.DataTable.CLASS_ASC
>>>                     }, // Sets UI initial sort arrow
>>>                     selectionMode:"single",
>>>                     paginator:pag
>>>                 };
>>>
>>>                 myDataTable = new YAHOO.widget.DataTable(tablediv, myColumnDefs, myDataSource, myConfigs);
>>>    
>>>                 // Subscribe to events for row selection
>>>                 myDataTable.subscribe("rowMouseoverEvent", myDataTable.onEventHighlightRow);
>>>                 myDataTable.subscribe("rowMouseoutEvent", myDataTable.onEventUnhighlightRow);
>>>                 myDataTable.subscribe("rowClickEvent", myDataTable.onEventSelectRow);
>>>        
>>>                 // Update totalRecords on the fly with value from server
>>>                 myDataTable.handleDataReturnPayload = function(oRequest, oResponse, oPayload) {
>>>                     oPayload.totalRecords = oResponse.meta.totalRecords;
>>>            var rowsperpg = pag.getRowsPerPage();
>>> var noofpages  = oPayload.totalRecords/rowsperpg;
>>> if (noofpages>1){
>>> expandSearch(ind);
>>> }
>>>                     return oPayload;
>>>                 }
>>>    
>>>
>>>                 // Override function for custom server-side sorting
>>>                 myDataTable.sortColumn = function(oColumn) {
>>>                     // Default descending
>>>                     var sDir = "asc"
>>>
>>>                     // If already sorted, sort in opposite direction
>>>                     if(oColumn.key === myDataTable.get("sortedBy").key) {
>>>                         sDir = (myDataTable.get("sortedBy").dir === YAHOO.widget.DataTable.CLASS_ASC) ?
>>>                         "desc" : "asc";
>>>                     }
>>>
>>>                     // Pass in sort values to server request
>>>                     var newRequest = "&search="+search+"&query="+texttosearch+"&insearch="+textinsearch+"&sort=" + oColumn.key + "&dir=" + sDir + "&startIndex=0"+"&results=25";
>>>
>>>                     // Create callback for data request
>>>                     var oCallback = {
>>>                         success : function(oRequest, oResponse, oPayload){
>>>                             myDataTable.onDataReturnInitializeTable(oRequest, oResponse, oPayload);
>>>                             var newState = {
>>>                                 totalRecords :  oPayload.totalRecords
>>>                             };
>>>                             pag.setState(newState);
>>>                         },
>>>
>>>                         scope: myDataTable,
>>>                         argument: {
>>>                             // Pass in sort values so UI can be updated in callback function
>>>                             sorting: {
>>>                                 key: oColumn.key,
>>>                                 dir: (sDir === "desc") ? YAHOO.widget.DataTable.CLASS_DESC : YAHOO.widget.DataTable.CLASS_ASC
>>>                             }
>>>                         }
>>>                     }
>>>
>>>                     // Send the request
>>>                     myDataSource.sendRequest(newRequest, oCallback,myDataTable,true);
>>>                 };
>>>
>>>                 return {
>>>                     ds: myDataSource,
>>>                     dt: myDataTable
>>>                 };
>>>
>>>
>>>              
>>>            
>>>      
>>>             }
>>>
>>>         }
>>>     });
>>> }
>>>
>>>
>>>
>>>
>>>
>>> ------------------------------------
>>>
>>> Yahoo! Groups Links
>>>
>>>
>>>
>>> ------------------------------------------------------------------------
>>>
>>>
>>> No virus found in this incoming message.
>>> Checked by AVG - www.avg.com
>>> Version: 9.0.698 / Virus Database: 270.14.47/2478 - Release Date: 11/03/09 08:36:00
>>>
>>>
>>>      
>
>
>
>
> ------------------------------------
>
> Yahoo! Groups Links
>
>
>
> ------------------------------------------------------------------------
>
>
> No virus found in this incoming message.
> Checked by AVG - www.avg.com
> Version: 9.0.698 / Virus Database: 270.14.47/2478 - Release Date: 11/03/09 08:36:00
>
>  

Re: Problem with search using pagination in a data table

by sumeenkaur :: Rate this Message:

Reply to Author | View Threaded | Show Only this Message

Ok I have changes that in the working  example. Let me know if u find something.

--- In ydn-javascript@..., Satyam <satyam@...> wrote:

>
> If you could change that in the working example, we could put a
> breakpoint at the point of failure and see the state of the variables
> and the call stack.
>
> sumeenkaur escribió:
> > ok..if i replace it with datatable.js, i get this error
> >
> > allRecords[i] is undefined at datatable.js on Line 7220
> >
> > Let me know if u find anyhting
> >
> >
> >
> >
> >
> > --- In ydn-javascript@..., Satyam <satyam@> wrote:
> >  
> >> The error is in minified code, there is no way to make sense of it.  Can
> >> you change datatable-min.js and use datatable.js instead?
> >>
> >> Satyam
> >>
> >> sumeenkaur escribió:
> >>    
> >>> Hi
> >>>
> >>>
> >>> Check on the link http://oleg.sleeplms.net/
> >>>
> >>> Click 'Lab Management'. Click 'Referral and test'. Click any test.
> >>> An edit page opens where one can see the button 'Select Patient'.
> >>> Click that button.
> >>>
> >>> A yui data table is created with a search feature. Since the table has more than 20 records, it displays pagination.
> >>>
> >>> The search feature works in the following way:
> >>> I enter say 'F' in search input box and the data table list reduces to all patients with letter F in their last name.
> >>>
> >>> Search works fine on the first page but if i go second page by clicking 2, and repeat the above steps, i get the following error.
> >>>
> >>> I[T] is undefined
> >>> on datatable-min.js at Line 16
> >>>
> >>> But if i enter some more data in the search input box, it works fine.
> >>>
> >>> I can not figure out how to fix this. Any help would be appreciated.
> >>>
> >>> Here is the code.
> >>>
> >>> YAHOO.namespace ("protech");
> >>>
> >>> var Dom = YAHOO.util.Dom;
> >>> var Event = YAHOO.util.Event;
> >>> var myDataTable = null;
> >>> var myDataSource = null;
> >>> var parameters = null;
> >>> var ind;
> >>> var jsonstring=null;
> >>> var fieldsArray = [];
> >>> var texttosearch='';
> >>> var textinsearch='';
> >>> var search='';
> >>> var pag=null;
> >>> var oRecord_temp=[];
> >>> var oRecord_index=0;
> >>> var specialChars = ['@','#',':', ' ', '$','%','^','&','*','(',')','=','-','_','}','{',']','[','>','<','\'','"','.',';','?','/','!','+','\\','|',',','`','~','\n','\r'];
> >>>
> >>>
> >>> function reducesearchlist(temp){
> >>>     texttosearch  = Dom.get('queryInput'+temp).value;
> >>> if (texttosearch==''){
> >>> clearfilter(temp);
> >>> }else{
> >>> testsearch(temp);
> >>>
> >>> }
> >>>
> >>> }
> >>>
> >>>
> >>>
> >>> function testsearch(temp){
> >>>     texttosearch  = Dom.get('queryInput'+temp).value;
> >>>     textinsearchvalue = Dom.get('search_columns'+temp).value;
> >>>     arr = Dom.get('search_columns'+temp).options;
> >>>     textinsearch = arr[textinsearchvalue].text;
> >>>     search='yes';
> >>>     var oCallback2 = {
> >>>         success : function(oRequest, oResponse, oPayload){
> >>>             myDataTable.onDataReturnInitializeTable(oRequest, oResponse, oPayload);
> >>>             var newState = {
> >>>                 totalRecords :  oPayload.totalRecords
> >>>             };
> >>>             pag.setState(newState);
> >>>         },
> >>> failure:function(oRequest, oResponse, oPayload){
> >>> },
> >>>         scope : myDataTable,
> >>>         argument : myDataTable.getState()
> >>>     };
> >>>
> >>>     for (sp=0;sp<specialChars.length;sp++){
> >>>         temp=textinsearch.split(specialChars[sp]);
> >>>         splen = temp.length;
> >>>
> >>>         for (spl=1;spl<=splen;spl++){
> >>>             textinsearch =  textinsearch.replace(specialChars[sp],'');
> >>>         }
> >>>     }
> >>>     queryString = "&insearch="+textinsearch+"&dir=asc&startIndex=0&results=25";
> >>>  
> >>>     myDataSource.sendRequest('&sort='+fieldsArray[0].key+'&search='+search+'&query=' + texttosearch+queryString, oCallback2,myDataTable,true);
> >>>
> >>> }
> >>>
> >>>
> >>> function test(temp,cmd){
> >>>
> >>>     search="";
> >>>     textinsearch="";
> >>>     texttosearch="";
> >>>     var ind = temp;
> >>>
> >>>     var elementid = Dom.get('reference'+ind);
> >>>     Dom.setStyle(elementid,'display','none');
> >>>
> >>>     var searchid = Dom.get('search'+ind);
> >>>     Dom.setStyle(searchid,'display','');
> >>>
> >>>     var okcancelid = Dom.get('okcancel'+ind);
> >>>     Dom.setStyle(okcancelid,'display','');
> >>>
> >>>     var tablediv = 'dynamicdata'+ind;
> >>>
> >>>
> >>>     var entityID = Dom.get('hid_entity').value;
> >>>
> >>>
> >>>
> >>>     var instanceID = Dom.get('hid_ins').value;
> >>>
> >>>
> >>>     if(gup('reportName')){
> >>>         reportID = gup('reportName');
> >>>     }
> >>>
> >>>     if(gup('module')){
> >>>         var module = gup('module');
> >>>     }
> >>>
> >>>     var columnHeaders = [];
> >>>
> >>>     var header_array = [];
> >>>
> >>>     if(!header_array) return;
> >>>     var myColumnDefs = [];
> >>>     var summaryAddresses = [];
> >>>     //var fieldsArray = [];
> >>>
> >>>
> >>>     var formatUrl = function(elCell, oRecord, oColumn, sData) {
> >>>         if(sData){
> >>>    
> >>>             //elCell.innerHTML = "<a href='" + oRecord.getData("editurl") + "'>" + sData + "</a>";
> >>>
> >>>             elCell.innerHTML = '<span instance="' + oRecord.getData("instance_index_temp") + '">' + sData + '</span>';
> >>>
> >>>         }
> >>>     };
> >>>
> >>>     registerStr = '';
> >>>     var st =cmd + '~~|~~' + ind + '~~|~~' + registerStr;
> >>>     // Custom parser
> >>>     var lmsParser = function(sData) {
> >>>         if(sData){
> >>>             var array = sData.split("/");
> >>>             temp=new Date(array[0] + " " + array[1] + ", " + array[2]);
> >>>             return temp;
> >>>         }
> >>>     };
> >>>
> >>>
> >>>     if(module == 'lms'){
> >>>         //parameters = {entityID: 7, pageName: 'module', asynchronous: true, func:'gettableheaders',module:'lms'};
> >>>         var parameters= {
> >>>             refID:temp,
> >>>             pageName:'module',
> >>>             asynchronous: true,
> >>>             func:'getreferencetableheaders',
> >>>             module:'lms'
> >>>         };
> >>>     }
> >>>     else if(module == 'reportcreator'){
> >>>         var parameters = {
> >>>             reportName: reportName,
> >>>             pageName: 'module',
> >>>             asynchronous: true,
> >>>             func:'getreporttableheaders',
> >>>             module:'reportcreator'
> >>>         };
> >>>     }
> >>>
> >>>     new Ajax.Request('index.php',
> >>>     {
> >>>         method:'get',
> >>>         parameters: parameters,
> >>>         onSuccess: function(transport){
> >>>             var response = transport.responseText || "Error";
> >>>      
> >>>             header_array = eval(response);
> >>>             if(header_array.length) {
> >>>                 for(i=0;i<header_array.length;i++){
> >>>
> >>>                     var clean_header =  header_array[i].name.replace(/ /g,'');
> >>>                     clean_header =  clean_header.replace(/:/g,'');
> >>>                     for (sp=0;sp<specialChars.length;sp++){
> >>>                         temp=clean_header.split(specialChars[sp]);
> >>>                         splen = temp.length;
> >>>
> >>>                         for (spl=1;spl<=splen;spl++){
> >>>                             clean_header =  clean_header.replace(specialChars[sp],'');
> >>>                         }
> >>>                     }
> >>>
> >>>                     summaryAddresses[i] = header_array[i].address;
> >>>              
> >>>                     if(header_array[i].AtomicTypeID==7){
> >>>                         fieldsArray[i] = {
> >>>                             key:clean_header
> >>>                         };
> >>>                         myColumnDefs[i] = {
> >>>                             key:clean_header,
> >>>                             label:header_array[i].name,
> >>>                             sortable:true,
> >>>                             formatter:formatUrl
> >>>                         };
> >>>                     }
> >>>                     else{
> >>>                         fieldsArray[i] = {
> >>>                             key:clean_header
> >>>                         };
> >>>                         myColumnDefs[i] = {
> >>>                             key:clean_header,
> >>>                             label:header_array[i].name,
> >>>                             sortable:true,
> >>>                             formatter:formatUrl
> >>>                         };
> >>>                     }
> >>>                 }
> >>>                 fieldsArray[i]={
> >>>                     key:"editurl"
> >>>                 };
> >>>                 i++;
> >>>                 fieldsArray[i]={
> >>>                     key:"instance_index_temp"
> >>>                 };
> >>>                 jsonString = Object.toJSON(summaryAddresses);
> >>>
> >>>                 //We have our header array. Now, let's get the data for the table
> >>>                 myDataSource = new YAHOO.util.DataSource("index.php?module=lms&func=getreferencetabledata&addresses="+jsonString+'&');
> >>>
> >>>                 myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
> >>>        
> >>>                 myDataSource.responseSchema = {
> >>>                     resultsList: "records",
> >>>                     fields: fieldsArray,
> >>>                     metaFields: {
> >>>                         totalRecords: "totalRecords" // Access to value in the server response
> >>>                     }
> >>>                 };
> >>>
> >>>                 // Paginator configurations
> >>>
> >>>                 pag = new YAHOO.widget.Paginator({
> >>>                     rowsPerPage : 20,
> >>>                     alwaysVisible : false,
> >>>                     template:YAHOO.widget.Paginator.TEMPLATE_ROWS_PER_PAGE,
> >>>                     rowsPerPageOptions: [20,50,100]
> >>>                 });
> >>>
> >>>    
> >>>
> >>>                 // DataTable configuration
> >>>
> >>>                 var myConfigs = {
> >>>                     initialRequest: "&sort="+fieldsArray[0].key+"&search="+search+"&query="+texttosearch+"&insearch="+textinsearch+"&dir=asc&startIndex=0&results=25", // Initial request for first page of data
> >>>                     dynamicData: true, // Enables dynamic server-driven data
> >>>                     sortedBy : {
> >>>                         key:fieldsArray[0].key,
> >>>                         dir:YAHOO.widget.DataTable.CLASS_ASC
> >>>                     }, // Sets UI initial sort arrow
> >>>                     selectionMode:"single",
> >>>                     paginator:pag
> >>>                 };
> >>>
> >>>                 myDataTable = new YAHOO.widget.DataTable(tablediv, myColumnDefs, myDataSource, myConfigs);
> >>>    
> >>>                 // Subscribe to events for row selection
> >>>                 myDataTable.subscribe("rowMouseoverEvent", myDataTable.onEventHighlightRow);
> >>>                 myDataTable.subscribe("rowMouseoutEvent", myDataTable.onEventUnhighlightRow);
> >>>                 myDataTable.subscribe("rowClickEvent", myDataTable.onEventSelectRow);
> >>>        
> >>>                 // Update totalRecords on the fly with value from server
> >>>                 myDataTable.handleDataReturnPayload = function(oRequest, oResponse, oPayload) {
> >>>                     oPayload.totalRecords = oResponse.meta.totalRecords;
> >>>            var rowsperpg = pag.getRowsPerPage();
> >>> var noofpages  = oPayload.totalRecords/rowsperpg;
> >>> if (noofpages>1){
> >>> expandSearch(ind);
> >>> }
> >>>                     return oPayload;
> >>>                 }
> >>>    
> >>>
> >>>                 // Override function for custom server-side sorting
> >>>                 myDataTable.sortColumn = function(oColumn) {
> >>>                     // Default descending
> >>>                     var sDir = "asc"
> >>>
> >>>                     // If already sorted, sort in opposite direction
> >>>                     if(oColumn.key === myDataTable.get("sortedBy").key) {
> >>>                         sDir = (myDataTable.get("sortedBy").dir === YAHOO.widget.DataTable.CLASS_ASC) ?
> >>>                         "desc" : "asc";
> >>>                     }
> >>>
> >>>                     // Pass in sort values to server request
> >>>                     var newRequest = "&search="+search+"&query="+texttosearch+"&insearch="+textinsearch+"&sort=" + oColumn.key + "&dir=" + sDir + "&startIndex=0"+"&results=25";
> >>>
> >>>                     // Create callback for data request
> >>>                     var oCallback = {
> >>>                         success : function(oRequest, oResponse, oPayload){
> >>>                             myDataTable.onDataReturnInitializeTable(oRequest, oResponse, oPayload);
> >>>                             var newState = {
> >>>                                 totalRecords :  oPayload.totalRecords
> >>>                             };
> >>>                             pag.setState(newState);
> >>>                         },
> >>>
> >>>                         scope: myDataTable,
> >>>                         argument: {
> >>>                             // Pass in sort values so UI can be updated in callback function
> >>>                             sorting: {
> >>>                                 key: oColumn.key,
> >>>                                 dir: (sDir === "desc") ? YAHOO.widget.DataTable.CLASS_DESC : YAHOO.widget.DataTable.CLASS_ASC
> >>>                             }
> >>>                         }
> >>>                     }
> >>>
> >>>                     // Send the request
> >>>                     myDataSource.sendRequest(newRequest, oCallback,myDataTable,true);
> >>>                 };
> >>>
> >>>                 return {
> >>>                     ds: myDataSource,
> >>>                     dt: myDataTable
> >>>                 };
> >>>
> >>>
> >>>              
> >>>            
> >>>      
> >>>             }
> >>>
> >>>         }
> >>>     });
> >>> }
> >>>
> >>>
> >>>
> >>>
> >>>
> >>> ------------------------------------
> >>>
> >>> Yahoo! Groups Links
> >>>
> >>>
> >>>
> >>> ------------------------------------------------------------------------
> >>>
> >>>
> >>> No virus found in this incoming message.
> >>> Checked by AVG - www.avg.com
> >>> Version: 9.0.698 / Virus Database: 270.14.47/2478 - Release Date: 11/03/09 08:36:00
> >>>
> >>>
> >>>      
> >
> >
> >
> >
> > ------------------------------------
> >
> > Yahoo! Groups Links
> >
> >
> >
> > ------------------------------------------------------------------------
> >
> >
> > No virus found in this incoming message.
> > Checked by AVG - www.avg.com
> > Version: 9.0.698 / Virus Database: 270.14.47/2478 - Release Date: 11/03/09 08:36:00
> >
> >
>



Re: Re: Problem with search using pagination in a data table

by bahalul kabir :: Rate this Message:

Reply to Author | View Threaded | Show Only this Message

Hi sumeenkaur, Normal pagination is ok.But After click on search  button I  requery means refresh the table but pagination is not working.


YAHOO.example.DynamicData = function()
{


YAHOO.widget.DataTable.prototype.requery = function(newRequest) {   // Have to include this function for requery
 var ds = this.getDataSource();
 if (ds instanceof YAHOO.util.XHRDataSource) {
  ds.liveData = newRequest;
  ds.sendRequest("",
   {
    success: this.onDataReturnInitializeTable,
    failure: this.onDataReturnInitializeTable,
    scope: this
   }
  );
 } else {
  ds.sendRequest(
   (newRequest === undefined?this.get("initialRequest"):newRequest),
   {               
    success: this.onDataReturnInitializeTable,
    failure: this.onDataReturnInitializeTable,
    scope: this
   }
  );
 }
};


 var support_dataTable = new YAHOO.widget.DataTable("dynamicdata", support_columnDefs, support_datasourse, support_configs);  //  This is for data before search button click

// search start
var Event = YAHOO.util.Event;
Event.on("search","click",function()
{   
var support_requery = new YAHOO.widget.DataTable(
      "dynamicdata",
      support_columnDefs,
      new YAHOO.util.XHRDataSource(
       "index.php?show=ajax&module=support&startIndex=0&results=30&searchText=" + searchText + "&searchCriteria="+ searchCriteria,
       {
        responseType:YAHOO.util.DataSource.TYPE_JSON,
        responseSchema: {
                                    resultsList: "records",
                                    fields: [
                                    {key:"id", parser:"number"},
                                    {key:"subject"},
                                    {key:"ticket_id"},
                                    {key:"last_activity"},
                                    {key:"last_reply"},
                                    {key:"assigned"},
                                    {key:"category"},
                                    {key:"date"}
                                    ],
                                    metaFields: {
                                        totalRecords: "totalRecords"
                                    }
        }
       }
      ),
      {
                         initialRequest: "&sort=date&dir=desc",
                            dynamicData: true,
                            sortedBy : {key:"date", dir:YAHOO.widget.DataTable.CLASS_DESC},
                            paginator: new YAHOO.widget.Paginator({ rowsPerPage:'.$numResults.' })
      }
     );
                    support_requery.requery("index.php?show=ajax&module=support&startIndex=0&dir=desc&results=30&searchText=" + searchText + "&searchCriteria="+ searchCriteria);
});

// search end here



}();



________________________________
From: sumeenkaur <sumeen@...>
To: ydn-javascript@...
Sent: Wed, November 4, 2009 3:36:04 PM
Subject: [ydn-javascript] Re: Problem with search using pagination in a data table

 
Ok I have changes that in the working example. Let me know if u find something.

--- In ydn-javascript@ yahoogroups. com, Satyam <satyam@...> wrote:

>
> If you could change that in the working example, we could put a
> breakpoint at the point of failure and see the state of the variables
> and the call stack.
>
> sumeenkaur escribió:
> > ok..if i replace it with datatable.js, i get this error
> >
> > allRecords[i] is undefined at datatable.js on Line 7220
> >
> > Let me know if u find anyhting
> >
> >
> >
> >
> >
> > --- In ydn-javascript@ yahoogroups. com, Satyam <satyam@> wrote:
> >
> >> The error is in minified code, there is no way to make sense of it. Can
> >> you change datatable-min. js and use datatable.js instead?
> >>
> >> Satyam
> >>
> >> sumeenkaur escribió:
> >>
> >>> Hi
> >>>
> >>>
> >>> Check on the link http://oleg. sleeplms. net/
> >>>
> >>> Click 'Lab Management'. Click 'Referral and test'. Click any test.
> >>> An edit page opens where one can see the button 'Select Patient'.
> >>> Click that button.
> >>>
> >>> A yui data table is created with a search feature. Since the table has more than 20 records, it displays pagination.
> >>>
> >>> The search feature works in the following way:
> >>> I enter say 'F' in search input box and the data table list reduces to all patients with letter F in their last name.
> >>>
> >>> Search works fine on the first page but if i go second page by clicking 2, and repeat the above steps, i get the following error.
> >>>
> >>> I[T] is undefined
> >>> on datatable-min. js at Line 16
> >>>
> >>> But if i enter some more data in the search input box, it works fine.
> >>>
> >>> I can not figure out how to fix this. Any help would be appreciated.
> >>>
> >>> Here is the code.
> >>>
> >>> YAHOO.namespace ("protech");
> >>>
> >>> var Dom = YAHOO.util.Dom;
> >>> var Event = YAHOO.util.Event;
> >>> var myDataTable = null;
> >>> var myDataSource = null;
> >>> var parameters = null;
> >>> var ind;
> >>> var jsonstring=null;
> >>> var fieldsArray = [];
> >>> var texttosearch= '';
> >>> var textinsearch= '';
> >>> var search='';
> >>> var pag=null;
> >>> var oRecord_temp= [];
> >>> var oRecord_index= 0;
> >>> var specialChars = ['@','#',':' , ' ', '$','%','^', '&','*',' (',')','= ','-','_' ,'}','{', ']','[',' >','<','\ '','"','. ',';','?' ,'/','!', '+','\\', '|',',',' `','~','\ n','\r'];
> >>>
> >>>
> >>> function reducesearchlist( temp){
> >>> texttosearch = Dom.get('queryInput '+temp).value;
> >>> if (texttosearch= =''){
> >>> clearfilter( temp);
> >>> }else{
> >>> testsearch(temp) ;
> >>>
> >>> }
> >>>
> >>> }
> >>>
> >>>
> >>>
> >>> function testsearch(temp) {
> >>> texttosearch = Dom.get('queryInput '+temp).value;
> >>> textinsearchvalue = Dom.get('search_ columns'+ temp).value;
> >>> arr = Dom.get('search_ columns'+ temp).options;
> >>> textinsearch = arr[textinsearchval ue].text;
> >>> search='yes' ;
> >>> var oCallback2 = {
> >>> success : function(oRequest, oResponse, oPayload){
> >>> myDataTable. onDataReturnInit ializeTable( oRequest, oResponse, oPayload);
> >>> var newState = {
> >>> totalRecords : oPayload.totalRecor ds
> >>> };
> >>> pag.setState( newState) ;
> >>> },
> >>> failure:function( oRequest, oResponse, oPayload){
> >>> },
> >>> scope : myDataTable,
> >>> argument : myDataTable. getState( )
> >>> };
> >>>
> >>> for (sp=0;sp<specialCha rs.length; sp++){
> >>> temp=textinsearch. split(specialCha rs[sp]);
> >>> splen = temp.length;
> >>>
> >>> for (spl=1;spl<= splen;spl+ +){
> >>> textinsearch = textinsearch. replace(specialC hars[sp], '');
> >>> }
> >>> }
> >>> queryString = "&insearch=" +textinsearch+ "&dir=asc& startIndex= 0&results= 25";
> >>>
> >>> myDataSource. sendRequest( '&sort='+ fieldsArray[ 0].key+'& search='+ search+'& query=' + texttosearch+ queryString, oCallback2,myDataTa ble,true) ;
> >>>
> >>> }
> >>>
> >>>
> >>> function test(temp,cmd) {
> >>>
> >>> search="";
> >>> textinsearch= "";
> >>> texttosearch= "";
> >>> var ind = temp;
> >>>
> >>> var elementid = Dom.get('reference' +ind);
> >>> Dom.setStyle( elementid, 'display' ,'none');
> >>>
> >>> var searchid = Dom.get('search' +ind);
> >>> Dom.setStyle( searchid, 'display' ,'');
> >>>
> >>> var okcancelid = Dom.get('okcancel' +ind);
> >>> Dom.setStyle( okcancelid, 'display' ,'');
> >>>
> >>> var tablediv = 'dynamicdata' +ind;
> >>>
> >>>
> >>> var entityID = Dom.get('hid_ entity'). value;
> >>>
> >>>
> >>>
> >>> var instanceID = Dom.get('hid_ ins').value;
> >>>
> >>>
> >>> if(gup('reportName' )){
> >>> reportID = gup('reportName' );
> >>> }
> >>>
> >>> if(gup('module' )){
> >>> var module = gup('module' );
> >>> }
> >>>
> >>> var columnHeaders = [];
> >>>
> >>> var header_array = [];
> >>>
> >>> if(!header_array) return;
> >>> var myColumnDefs = [];
> >>> var summaryAddresses = [];
> >>> //var fieldsArray = [];
> >>>
> >>>
> >>> var formatUrl = function(elCell, oRecord, oColumn, sData) {
> >>> if(sData){
> >>>
> >>> //elCell.innerHTML = "<a href='" + oRecord.getData( "editurl" ) + "'>" + sData + "</a>";
> >>>
> >>> elCell.innerHTML = '<span instance="' + oRecord.getData( "instance_ index_temp" ) + '">' + sData + '</span>';
> >>>
> >>> }
> >>> };
> >>>
> >>> registerStr = '';
> >>> var st =cmd + '~~|~~' + ind + '~~|~~' + registerStr;
> >>> // Custom parser
> >>> var lmsParser = function(sData) {
> >>> if(sData){
> >>> var array = sData.split( "/");
> >>> temp=new Date(array[0] + " " + array[1] + ", " + array[2]);
> >>> return temp;
> >>> }
> >>> };
> >>>
> >>>
> >>> if(module == 'lms'){
> >>> //parameters = {entityID: 7, pageName: 'module', asynchronous: true, func:'gettableheade rs',module: 'lms'};
> >>> var parameters= {
> >>> refID:temp,
> >>> pageName:'module' ,
> >>> asynchronous: true,
> >>> func:'getreferencet ableheaders' ,
> >>> module:'lms'
> >>> };
> >>> }
> >>> else if(module == 'reportcreator' ){
> >>> var parameters = {
> >>> reportName: reportName,
> >>> pageName: 'module',
> >>> asynchronous: true,
> >>> func:'getreporttabl eheaders' ,
> >>> module:'reportcreat or'
> >>> };
> >>> }
> >>>
> >>> new Ajax.Request( 'index.php' ,
> >>> {
> >>> method:'get' ,
> >>> parameters: parameters,
> >>> onSuccess: function(transport) {
> >>> var response = transport.responseT ext || "Error";
> >>>
> >>> header_array = eval(response) ;
> >>> if(header_array. length) {
> >>> for(i=0;i<header_ array.length; i++){
> >>>
> >>> var clean_header = header_array[ i].name.replace( / /g,'');
> >>> clean_header = clean_header. replace(/ :/g,'');
> >>> for (sp=0;sp<specialCha rs.length; sp++){
> >>> temp=clean_header. split(specialCha rs[sp]);
> >>> splen = temp.length;
> >>>
> >>> for (spl=1;spl<= splen;spl+ +){
> >>> clean_header = clean_header. replace(specialC hars[sp], '');
> >>> }
> >>> }
> >>>
> >>> summaryAddresses[ i] = header_array[ i].address;
> >>>
> >>> if(header_array[ i].AtomicTypeID= =7){
> >>> fieldsArray[ i] = {
> >>> key:clean_header
> >>> };
> >>> myColumnDefs[ i] = {
> >>> key:clean_header,
> >>> label:header_ array[i]. name,
> >>> sortable:true,
> >>> formatter:formatUrl
> >>> };
> >>> }
> >>> else{
> >>> fieldsArray[ i] = {
> >>> key:clean_header
> >>> };
> >>> myColumnDefs[ i] = {
> >>> key:clean_header,
> >>> label:header_ array[i]. name,
> >>> sortable:true,
> >>> formatter:formatUrl
> >>> };
> >>> }
> >>> }
> >>> fieldsArray[ i]={
> >>> key:"editurl"
> >>> };
> >>> i++;
> >>> fieldsArray[ i]={
> >>> key:"instance_ index_temp"
> >>> };
> >>> jsonString = Object.toJSON( summaryAddresses );
> >>>
> >>> //We have our header array. Now, let's get the data for the table
> >>> myDataSource = new YAHOO.util.DataSour ce("index. php?module= lms&func= getreferencetabl edata&addresses= "+jsonString+ '&');
> >>>
> >>> myDataSource. responseType = YAHOO.util.DataSour ce.TYPE_JSON;
> >>>
> >>> myDataSource. responseSchema = {
> >>> resultsList: "records",
> >>> fields: fieldsArray,
> >>> metaFields: {
> >>> totalRecords: "totalRecords" // Access to value in the server response
> >>> }
> >>> };
> >>>
> >>> // Paginator configurations
> >>>
> >>> pag = new YAHOO.widget. Paginator( {
> >>> rowsPerPage : 20,
> >>> alwaysVisible : false,
> >>> template:YAHOO. widget.Paginator .TEMPLATE_ ROWS_PER_ PAGE,
> >>> rowsPerPageOptions: [20,50,100]
> >>> });
> >>>
> >>>
> >>>
> >>> // DataTable configuration
> >>>
> >>> var myConfigs = {
> >>> initialRequest: "&sort="+fieldsArra y[0].key+ "&search= "+search+ "&query=" +texttosearch+ "&insearch= "+textinsearch+ "&dir=asc& startIndex= 0&results= 25", // Initial request for first page of data
> >>> dynamicData: true, // Enables dynamic server-driven data
> >>> sortedBy : {
> >>> key:fieldsArray[ 0].key,
> >>> dir:YAHOO.widget. DataTable. CLASS_ASC
> >>> }, // Sets UI initial sort arrow
> >>> selectionMode: "single",
> >>> paginator:pag
> >>> };
> >>>
> >>> myDataTable = new YAHOO.widget. DataTable( tablediv, myColumnDefs, myDataSource, myConfigs);
> >>>
> >>> // Subscribe to events for row selection
> >>> myDataTable. subscribe( "rowMouseoverEve nt", myDataTable. onEventHighlight Row);
> >>> myDataTable. subscribe( "rowMouseoutEven t", myDataTable. onEventUnhighlig htRow);
> >>> myDataTable. subscribe( "rowClickEvent" , myDataTable. onEventSelectRow );
> >>>
> >>> // Update totalRecords on the fly with value from server
> >>> myDataTable. handleDataReturn Payload = function(oRequest, oResponse, oPayload) {
> >>> oPayload.totalRecor ds = oResponse.meta. totalRecords;
> >>> var rowsperpg = pag.getRowsPerPage( );
> >>> var noofpages = oPayload.totalRecor ds/rowsperpg;
> >>> if (noofpages>1) {
> >>> expandSearch( ind);
> >>> }
> >>> return oPayload;
> >>> }
> >>>
> >>>
> >>> // Override function for custom server-side sorting
> >>> myDataTable. sortColumn = function(oColumn) {
> >>> // Default descending
> >>> var sDir = "asc"
> >>>
> >>> // If already sorted, sort in opposite direction
> >>> if(oColumn.key === myDataTable. get("sortedBy" ).key) {
> >>> sDir = (myDataTable. get("sortedBy" ).dir === YAHOO.widget. DataTable. CLASS_ASC) ?
> >>> "desc" : "asc";
> >>> }
> >>>
> >>> // Pass in sort values to server request
> >>> var newRequest = "&search="+search+ "&query=" +texttosearch+ "&insearch= "+textinsearch+ "&sort=" + oColumn.key + "&dir=" + sDir + "&startIndex= 0"+"&results= 25";
> >>>
> >>> // Create callback for data request
> >>> var oCallback = {
> >>> success : function(oRequest, oResponse, oPayload){
> >>> myDataTable. onDataReturnInit ializeTable( oRequest, oResponse, oPayload);
> >>> var newState = {
> >>> totalRecords : oPayload.totalRecor ds
> >>> };
> >>> pag.setState( newState) ;
> >>> },
> >>>
> >>> scope: myDataTable,
> >>> argument: {
> >>> // Pass in sort values so UI can be updated in callback function
> >>> sorting: {
> >>> key: oColumn.key,
> >>> dir: (sDir === "desc") ? YAHOO.widget. DataTable. CLASS_DESC : YAHOO.widget. DataTable. CLASS_ASC
> >>> }
> >>> }
> >>> }
> >>>
> >>> // Send the request
> >>> myDataSource. sendRequest( newRequest, oCallback,myDataTab le,true);
> >>> };
> >>>
> >>> return {
> >>> ds: myDataSource,
> >>> dt: myDataTable
> >>> };
> >>>
> >>>
> >>>
> >>>
> >>>
> >>> }
> >>>
> >>> }
> >>> });
> >>> }
> >>>
> >>>
> >>>
> >>>
> >>>
> >>> ------------ --------- --------- ------
> >>>
> >>> Yahoo! Groups Links
> >>>
> >>>
> >>>
> >>> ------------ --------- --------- --------- --------- --------- -
> >>>
> >>>
> >>> No virus found in this incoming message.
> >>> Checked by AVG - www.avg.com
> >>> Version: 9.0.698 / Virus Database: 270.14.47/2478 - Release Date: 11/03/09 08:36:00
> >>>
> >>>
> >>>
> >
> >
> >
> >
> > ------------ --------- --------- ------
> >
> > Yahoo! Groups Links
> >
> >
> >
> > ------------ --------- --------- --------- --------- --------- -
> >
> >
> > No virus found in this incoming message.
> > Checked by AVG - www.avg.com
> > Version: 9.0.698 / Virus Database: 270.14.47/2478 - Release Date: 11/03/09 08:36:00
> >
> >
>





     

Re: Re: Problem with search using pagination in a data table

by Christian Tiberg :: Rate this Message:

Reply to Author | View Threaded | Show Only this Message

As I wrote in a different post, we don't use requery either. Just live with
it :)

Best regards,
 Christian Tiberg


2009/11/4 bahalul kabir <bahar_aub@...>

>
>
> Hi sumeenkaur, Normal pagination is ok.But After click on search  button I
> requery means refresh the table but pagination is not working.
>
>
> YAHOO.example.DynamicData = function()
> {
>
> YAHOO.widget.DataTable.prototype.requery = function(newRequest) {   // Have
> to include this function for requery
>  var ds = this.getDataSource();
>  if (ds instanceof YAHOO.util.XHRDataSource) {
>   ds.liveData = newRequest;
>   ds.sendRequest("",
>    {
>     success: this.onDataReturnInitializeTable,
>     failure: this.onDataReturnInitializeTable,
>     scope: this
>    }
>   );
>  } else {
>   ds.sendRequest(
>    (newRequest === undefined?this.get("initialRequest"):newRequest),
>    {
>     success: this.onDataReturnInitializeTable,
>     failure: this.onDataReturnInitializeTable,
>     scope: this
>    }
>   );
>  }
> };
>
>  var support_dataTable = new YAHOO.widget.DataTable("dynamicdata",
> support_columnDefs, support_datasourse, support_configs);  //  This is for
> data before search button click
>
> // search start
> var Event = YAHOO.util.Event;
> Event.on("search","click",function()
> {
> var support_requery = new YAHOO.widget.DataTable(
>       "dynamicdata",
>       support_columnDefs,
>       new YAHOO.util.XHRDataSource(
>        "index.php?show=ajax&module=support&startIndex=0&results=30&searchText="
> + searchText + "&searchCriteria="+ searchCriteria,
>        {
>         responseType:YAHOO.util.DataSource.TYPE_JSON,
>         responseSchema: {
>                                     resultsList: "records",
>                                     fields: [
>                                     {key:"id", parser:"number"},
>                                     {key:"subject"},
>                                     {key:"ticket_id"},
>                                     {key:"last_activity"},
>                                     {key:"last_reply"},
>                                     {key:"assigned"},
>                                     {key:"category"},
>                                     {key:"date"}
>                                     ],
>                                     metaFields: {
>                                         totalRecords: "totalRecords"
>                                     }
>         }
>        }
>       ),
>       {
>                          initialRequest: "&sort=date&dir=desc",
>                             dynamicData: true,
>                             sortedBy : {key:"date",
> dir:YAHOO.widget.DataTable.CLASS_DESC},
>                             paginator: new YAHOO.widget.Paginator({
> rowsPerPage:'.$numResults.' })
>       }
>      );
>
> support_requery.requery("index.php?show=ajax&module=support&startIndex=0&dir=desc&results=30&searchText="
> + searchText + "&searchCriteria="+ searchCriteria);
> });
>
> // search end here
>
>
>
> }();
>
>  ------------------------------
> *From:* sumeenkaur <sumeen@...>
> *To:* ydn-javascript@...
> *Sent:* Wed, November 4, 2009 3:36:04 PM
> *Subject:* [ydn-javascript] Re: Problem with search using pagination in a
> data table
>
>
>
> Ok I have changes that in the working example. Let me know if u find
> something.
>
> --- In ydn-javascript@ yahoogroups. com <ydn-javascript%40yahoogroups.com>,
> Satyam <satyam@...> wrote:
> >
> > If you could change that in the working example, we could put a
> > breakpoint at the point of failure and see the state of the variables
> > and the call stack.
> >
> > sumeenkaur escribió:
> > > ok..if i replace it with datatable.js, i get this error
> > >
> > > allRecords[i] is undefined at datatable.js on Line 7220
> > >
> > > Let me know if u find anyhting
> > >
> > >
> > >
> > >
> > >
> > > --- In ydn-javascript@ yahoogroups. com<ydn-javascript%40yahoogroups.com>,
> Satyam <satyam@> wrote:
> > >
> > >> The error is in minified code, there is no way to make sense of it.
> Can
> > >> you change datatable-min. js and use datatable.js instead?
> > >>
> > >> Satyam
> > >>
> > >> sumeenkaur escribió:
> > >>
> > >>> Hi
> > >>>
> > >>>
> > >>> Check on the link http://oleg. sleeplms. net/<http://oleg.sleeplms.net/>
> > >>>
> > >>> Click 'Lab Management'. Click 'Referral and test'. Click any test.
> > >>> An edit page opens where one can see the button 'Select Patient'.
> > >>> Click that button.
> > >>>
> > >>> A yui data table is created with a search feature. Since the table
> has more than 20 records, it displays pagination.
> > >>>
> > >>> The search feature works in the following way:
> > >>> I enter say 'F' in search input box and the data table list reduces
> to all patients with letter F in their last name.
> > >>>
> > >>> Search works fine on the first page but if i go second page by
> clicking 2, and repeat the above steps, i get the following error.
> > >>>
> > >>> I[T] is undefined
> > >>> on datatable-min. js at Line 16
> > >>>
> > >>> But if i enter some more data in the search input box, it works fine.
> > >>>
> > >>> I can not figure out how to fix this. Any help would be appreciated.
> > >>>
> > >>> Here is the code.
> > >>>
> > >>> YAHOO.namespace ("protech");
> > >>>
> > >>> var Dom = YAHOO.util.Dom;
> > >>> var Event = YAHOO.util.Event;
> > >>> var myDataTable = null;
> > >>> var myDataSource = null;
> > >>> var parameters = null;
> > >>> var ind;
> > >>> var jsonstring=null;
> > >>> var fieldsArray = [];
> > >>> var texttosearch= '';
> > >>> var textinsearch= '';
> > >>> var search='';
> > >>> var pag=null;
> > >>> var oRecord_temp= [];
> > >>> var oRecord_index= 0;
> > >>> var specialChars = ['@','#',':' , ' ', '$','%','^', '&','*','
> (',')','= ','-','_' ,'}','{', ']','[',' >','<','\ '','"','. ',';','?'
> ,'/','!', '+','\\', '|',',',' `','~','\ n','\r'];
> > >>>
> > >>>
> > >>> function reducesearchlist( temp){
> > >>> texttosearch = Dom.get('queryInput '+temp).value;
> > >>> if (texttosearch= =''){
> > >>> clearfilter( temp);
> > >>> }else{
> > >>> testsearch(temp) ;
> > >>>
> > >>> }
> > >>>
> > >>> }
> > >>>
> > >>>
> > >>>
> > >>> function testsearch(temp) {
> > >>> texttosearch = Dom.get('queryInput '+temp).value;
> > >>> textinsearchvalue = Dom.get('search_ columns'+ temp).value;
> > >>> arr = Dom.get('search_ columns'+ temp).options;
> > >>> textinsearch = arr[textinsearchval ue].text;
>
> > >>> search='yes' ;
> > >>> var oCallback2 = {
> > >>> success : function(oRequest, oResponse, oPayload){
> > >>> myDataTable. onDataReturnInit ializeTable( oRequest, oResponse,
> oPayload);
>
> > >>> var newState = {
> > >>> totalRecords : oPayload.totalRecor ds
> > >>> };
> > >>> pag.setState( newState) ;
> > >>> },
> > >>> failure:function( oRequest, oResponse, oPayload){
> > >>> },
> > >>> scope : myDataTable,
> > >>> argument : myDataTable. getState( )
> > >>> };
> > >>>
> > >>> for (sp=0;sp<specialCha rs.length; sp++){
> > >>> temp=textinsearch. split(specialCha rs[sp]);
>
> > >>> splen = temp.length;
> > >>>
> > >>> for (spl=1;spl<= splen;spl+ +){
> > >>> textinsearch = textinsearch. replace(specialC hars[sp], '');
>
> > >>> }
> > >>> }
> > >>> queryString = "&insearch=" +textinsearch+ "&dir=asc& startIndex=
> 0&results= 25";
> > >>>
> > >>> myDataSource. sendRequest( '&sort='+ fieldsArray[ 0].key+'& search='+
> search+'& query=' + texttosearch+ queryString, oCallback2,myDataTa ble,true)
> ;
>
> > >>>
> > >>> }
> > >>>
> > >>>
> > >>> function test(temp,cmd) {
> > >>>
> > >>> search="";
> > >>> textinsearch= "";
> > >>> texttosearch= "";
> > >>> var ind = temp;
> > >>>
> > >>> var elementid = Dom.get('reference' +ind);
> > >>> Dom.setStyle( elementid, 'display' ,'none');
> > >>>
> > >>> var searchid = Dom.get('search' +ind);
> > >>> Dom.setStyle( searchid, 'display' ,'');
> > >>>
> > >>> var okcancelid = Dom.get('okcancel' +ind);
> > >>> Dom.setStyle( okcancelid, 'display' ,'');
> > >>>
> > >>> var tablediv = 'dynamicdata' +ind;
> > >>>
> > >>>
> > >>> var entityID = Dom.get('hid_ entity'). value;
> > >>>
> > >>>
> > >>>
> > >>> var instanceID = Dom.get('hid_ ins').value;
> > >>>
> > >>>
> > >>> if(gup('reportName' )){
> > >>> reportID = gup('reportName' );
> > >>> }
> > >>>
> > >>> if(gup('module' )){
> > >>> var module = gup('module' );
> > >>> }
> > >>>
> > >>> var columnHeaders = [];
> > >>>
> > >>> var header_array = [];
> > >>>
> > >>> if(!header_array) return;
> > >>> var myColumnDefs = [];
> > >>> var summaryAddresses = [];
> > >>> //var fieldsArray = [];
> > >>>
> > >>>
> > >>> var formatUrl = function(elCell, oRecord, oColumn, sData) {
> > >>> if(sData){
> > >>>
> > >>> //elCell.innerHTML = "<a href='" + oRecord.getData( "editurl" ) +
> "'>" + sData + "</a>";
> > >>>
> > >>> elCell.innerHTML = '<span instance="' + oRecord.getData( "instance_
> index_temp" ) + '">' + sData + '</span>';
> > >>>
> > >>> }
> > >>> };
> > >>>
> > >>> registerStr = '';
> > >>> var st =cmd + '~~|~~' + ind + '~~|~~' + registerStr;
> > >>> // Custom parser
> > >>> var lmsParser = function(sData) {
> > >>> if(sData){
> > >>> var array = sData.split( "/");
> > >>> temp=new Date(array[0] + " " + array[1] + ", " + array[2]);
> > >>> return temp;
> > >>> }
> > >>> };
> > >>>
> > >>>
> > >>> if(module == 'lms'){
> > >>> //parameters = {entityID: 7, pageName: 'module', asynchronous: true,
> func:'gettableheade rs',module: 'lms'};
>
> > >>> var parameters= {
> > >>> refID:temp,
> > >>> pageName:'module' ,
> > >>> asynchronous: true,
> > >>> func:'getreferencet ableheaders' ,
> > >>> module:'lms'
> > >>> };
> > >>> }
> > >>> else if(module == 'reportcreator' ){
> > >>> var parameters = {
> > >>> reportName: reportName,
> > >>> pageName: 'module',
> > >>> asynchronous: true,
> > >>> func:'getreporttabl eheaders' ,
> > >>> module:'reportcreat or'
> > >>> };
> > >>> }
> > >>>
> > >>> new Ajax.Request( 'index.php' ,
> > >>> {
> > >>> method:'get' ,
> > >>> parameters: parameters,
> > >>> onSuccess: function(transport) {
> > >>> var response = transport.responseT ext || "Error";
>
> > >>>
> > >>> header_array = eval(response) ;
> > >>> if(header_array. length) {
> > >>> for(i=0;i<header_ array.length; i++){
> > >>>
> > >>> var clean_header = header_array[ i].name.replace( / /g,'');
> > >>> clean_header = clean_header. replace(/ :/g,'');
> > >>> for (sp=0;sp<specialCha rs.length; sp++){
> > >>> temp=clean_header. split(specialCha rs[sp]);
>
> > >>> splen = temp.length;
> > >>>
> > >>> for (spl=1;spl<= splen;spl+ +){
> > >>> clean_header = clean_header. replace(specialC hars[sp], '');
>
> > >>> }
> > >>> }
> > >>>
> > >>> summaryAddresses[ i] = header_array[ i].address;
> > >>>
> > >>> if(header_array[ i].AtomicTypeID= =7){
> > >>> fieldsArray[ i] = {
> > >>> key:clean_header
> > >>> };
> > >>> myColumnDefs[ i] = {
> > >>> key:clean_header,
> > >>> label:header_ array[i]. name,
> > >>> sortable:true,
> > >>> formatter:formatUrl
> > >>> };
> > >>> }
> > >>> else{
> > >>> fieldsArray[ i] = {
> > >>> key:clean_header
> > >>> };
> > >>> myColumnDefs[ i] = {
> > >>> key:clean_header,
> > >>> label:header_ array[i]. name,
> > >>> sortable:true,
> > >>> formatter:formatUrl
> > >>> };
> > >>> }
> > >>> }
> > >>> fieldsArray[ i]={
> > >>> key:"editurl"
> > >>> };
> > >>> i++;
> > >>> fieldsArray[ i]={
> > >>> key:"instance_ index_temp"
> > >>> };
> > >>> jsonString = Object.toJSON( summaryAddresses );
> > >>>
> > >>> //We have our header array. Now, let's get the data for the table
> > >>> myDataSource = new YAHOO.util.DataSour ce("index. php?module=
> lms&func= getreferencetabl edata&addresses= "+jsonString+ '&');
> > >>>
> > >>> myDataSource. responseType = YAHOO.util.DataSour ce.TYPE_JSON;
>
> > >>>
> > >>> myDataSource. responseSchema = {
> > >>> resultsList: "records",
> > >>> fields: fieldsArray,
> > >>> metaFields: {
> > >>> totalRecords: "totalRecords" // Access to value in the server
> response
> > >>> }
> > >>> };
> > >>>
> > >>> // Paginator configurations
> > >>>
> > >>> pag = new YAHOO.widget. Paginator( {
> > >>> rowsPerPage : 20,
> > >>> alwaysVisible : false,
> > >>> template:YAHOO. widget.Paginator .TEMPLATE_ ROWS_PER_ PAGE,
> > >>> rowsPerPageOptions: [20,50,100]
> > >>> });
> > >>>
> > >>>
> > >>>
> > >>> // DataTable configuration
> > >>>
> > >>> var myConfigs = {
> > >>> initialRequest: "&sort="+fieldsArra y[0].key+ "&search= "+search+
> "&query=" +texttosearch+ "&insearch= "+textinsearch+ "&dir=asc& startIndex=
> 0&results= 25", // Initial request for first page of data
>
> > >>> dynamicData: true, // Enables dynamic server-driven data
> > >>> sortedBy : {
> > >>> key:fieldsArray[ 0].key,
> > >>> dir:YAHOO.widget. DataTable. CLASS_ASC
> > >>> }, // Sets UI initial sort arrow
> > >>> selectionMode: "single",
> > >>> paginator:pag
> > >>> };
> > >>>
> > >>> myDataTable = new YAHOO.widget. DataTable( tablediv, myColumnDefs,
> myDataSource, myConfigs);
> > >>>
> > >>> // Subscribe to events for row selection
> > >>> myDataTable. subscribe( "rowMouseoverEve nt", myDataTable.
> onEventHighlight Row);
> > >>> myDataTable. subscribe( "rowMouseoutEven t", myDataTable.
> onEventUnhighlig htRow);
> > >>> myDataTable. subscribe( "rowClickEvent" , myDataTable.
> onEventSelectRow );
> > >>>
> > >>> // Update totalRecords on the fly with value from server
> > >>> myDataTable. handleDataReturn Payload = function(oRequest, oResponse,
> oPayload) {
> > >>> oPayload.totalRecor ds = oResponse.meta. totalRecords;
> > >>> var rowsperpg = pag.getRowsPerPage( );
> > >>> var noofpages = oPayload.totalRecor ds/rowsperpg;
>
> > >>> if (noofpages>1) {
> > >>> expandSearch( ind);
> > >>> }
> > >>> return oPayload;
> > >>> }
> > >>>
> > >>>
> > >>> // Override function for custom server-side sorting
> > >>> myDataTable. sortColumn = function(oColumn) {
> > >>> // Default descending
> > >>> var sDir = "asc"
> > >>>
> > >>> // If already sorted, sort in opposite direction
> > >>> if(oColumn.key === myDataTable. get("sortedBy" ).key) {
> > >>> sDir = (myDataTable. get("sortedBy" ).dir === YAHOO.widget.
> DataTable. CLASS_ASC) ?
> > >>> "desc" : "asc";
> > >>> }
> > >>>
> > >>> // Pass in sort values to server request
> > >>> var newRequest = "&search="+search+ "&query=" +texttosearch+
> "&insearch= "+textinsearch+ "&sort=" + oColumn.key + "&dir=" + sDir +
> "&startIndex= 0"+"&results= 25";
> > >>>
> > >>> // Create callback for data request
> > >>> var oCallback = {
> > >>> success : function(oRequest, oResponse, oPayload){
> > >>> myDataTable. onDataReturnInit ializeTable( oRequest, oResponse,
> oPayload);
>
> > >>> var newState = {
> > >>> totalRecords : oPayload.totalRecor ds
> > >>> };
> > >>> pag.setState( newState) ;
> > >>> },
> > >>>
> > >>> scope: myDataTable,
> > >>> argument: {
> > >>> // Pass in sort values so UI can be updated in callback function
> > >>> sorting: {
> > >>> key: oColumn.key,
> > >>> dir: (sDir === "desc") ? YAHOO.widget. DataTable. CLASS_DESC :
> YAHOO.widget. DataTable. CLASS_ASC
> > >>> }
> > >>> }
> > >>> }
> > >>>
> > >>> // Send the request
> > >>> myDataSource. sendRequest( newRequest, oCallback,myDataTab le,true);
>
> > >>> };
> > >>>
> > >>> return {
> > >>> ds: myDataSource,
> > >>> dt: myDataTable
> > >>> };
> > >>>
> > >>>
> > >>>
> > >>>
> > >>>
> > >>> }
> > >>>
> > >>> }
> > >>> });
> > >>> }
> > >>>
> > >>>
> > >>>
> > >>>
> > >>>
> > >>> ------------ --------- --------- ------
> > >>>
> > >>> Yahoo! Groups Links
> > >>>
> > >>>
> > >>>
> > >>> ------------ --------- --------- --------- --------- --------- -
> > >>>
> > >>>
> > >>> No virus found in this incoming message.
> > >>> Checked by AVG - www.avg.com
> > >>> Version: 9.0.698 / Virus Database: 270.14.47/2478 - Release Date:
> 11/03/09 08:36:00
> > >>>
> > >>>
> > >>>
> > >
> > >
> > >
> > >
> > > ------------ --------- --------- ------
> > >
> > > Yahoo! Groups Links
> > >
> > >
> > >
> > > ------------ --------- --------- --------- --------- --------- -
> > >
> > >
> > > No virus found in this incoming message.
> > > Checked by AVG - www.avg.com
> > > Version: 9.0.698 / Virus Database: 270.14.47/2478 - Release Date:
> 11/03/09 08:36:00
> > >
> > >
> >
>
>
>  
>

Re: Re: Problem with search using pagination in a data table

by Satyam-3 :: Rate this Message:

Reply to Author | View Threaded | Show Only this Message

I could not locate method reducesearchlist() which is the one that
triggers it all.  The DataTable defers actually creating the DOM
elements to an asynchronous function so your function is not on the call
stack.

Anyway, what I noticed is that you are loading many of the YUI
JavaScript files several times.  This is not good.  Dependent files
should only be loaded once each and in the correct order. Some of the
aggregate files like utilities.js contain many of the individual YUI
files so please do check your dependencies and if my requery method is
what you are using, as Bahahur Kabil says elsewhere, don't expect it to
work, it does not.

Also, do check your code with JSLint (www.jslint.org), it will save you
lots of trouble.

Satyam

sumeenkaur escribió:

> Ok I have changes that in the working  example. Let me know if u find something.
>
> --- In ydn-javascript@..., Satyam <satyam@...> wrote:
>  
>> If you could change that in the working example, we could put a
>> breakpoint at the point of failure and see the state of the variables
>> and the call stack.
>>
>> sumeenkaur escribió:
>>    
>>> ok..if i replace it with datatable.js, i get this error
>>>
>>> allRecords[i] is undefined at datatable.js on Line 7220
>>>
>>> Let me know if u find anyhting
>>>
>>>
>>>
>>>
>>>
>>> --- In ydn-javascript@..., Satyam <satyam@> wrote:
>>>  
>>>      
>>>> The error is in minified code, there is no way to make sense of it.  Can
>>>> you change datatable-min.js and use datatable.js instead?
>>>>
>>>> Satyam
>>>>
>>>> sumeenkaur escribió:
>>>>    
>>>>        
>>>>> Hi
>>>>>
>>>>>
>>>>> Check on the link http://oleg.sleeplms.net/
>>>>>
>>>>> Click 'Lab Management'. Click 'Referral and test'. Click any test.
>>>>> An edit page opens where one can see the button 'Select Patient'.
>>>>> Click that button.
>>>>>
>>>>> A yui data table is created with a search feature. Since the table has more than 20 records, it displays pagination.
>>>>>
>>>>> The search feature works in the following way:
>>>>> I enter say 'F' in search input box and the data table list reduces to all patients with letter F in their last name.
>>>>>
>>>>> Search works fine on the first page but if i go second page by clicking 2, and repeat the above steps, i get the following error.
>>>>>
>>>>> I[T] is undefined
>>>>> on datatable-min.js at Line 16
>>>>>
>>>>> But if i enter some more data in the search input box, it works fine.
>>>>>
>>>>> I can not figure out how to fix this. Any help would be appreciated.
>>>>>
>>>>> Here is the code.
>>>>>
>>>>> YAHOO.namespace ("protech");
>>>>>
>>>>> var Dom = YAHOO.util.Dom;
>>>>> var Event = YAHOO.util.Event;
>>>>> var myDataTable = null;
>>>>> var myDataSource = null;
>>>>> var parameters = null;
>>>>> var ind;
>>>>> var jsonstring=null;
>>>>> var fieldsArray = [];
>>>>> var texttosearch='';
>>>>> var textinsearch='';
>>>>> var search='';
>>>>> var pag=null;
>>>>> var oRecord_temp=[];
>>>>> var oRecord_index=0;
>>>>> var specialChars = ['@','#',':', ' ', '$','%','^','&','*','(',')','=','-','_','}','{',']','[','>','<','\'','"','.',';','?','/','!','+','\\','|',',','`','~','\n','\r'];
>>>>>
>>>>>
>>>>> function reducesearchlist(temp){
>>>>>     texttosearch  = Dom.get('queryInput'+temp).value;
>>>>> if (texttosearch==''){
>>>>> clearfilter(temp);
>>>>> }else{
>>>>> testsearch(temp);
>>>>>
>>>>> }
>>>>>
>>>>> }
>>>>>
>>>>>
>>>>>
>>>>> function testsearch(temp){
>>>>>     texttosearch  = Dom.get('queryInput'+temp).value;
>>>>>     textinsearchvalue = Dom.get('search_columns'+temp).value;
>>>>>     arr = Dom.get('search_columns'+temp).options;
>>>>>     textinsearch = arr[textinsearchvalue].text;
>>>>>     search='yes';
>>>>>     var oCallback2 = {
>>>>>         success : function(oRequest, oResponse, oPayload){
>>>>>             myDataTable.onDataReturnInitializeTable(oRequest, oResponse, oPayload);
>>>>>             var newState = {
>>>>>                 totalRecords :  oPayload.totalRecords
>>>>>             };
>>>>>             pag.setState(newState);
>>>>>         },
>>>>> failure:function(oRequest, oResponse, oPayload){
>>>>> },
>>>>>         scope : myDataTable,
>>>>>         argument : myDataTable.getState()
>>>>>     };
>>>>>
>>>>>     for (sp=0;sp<specialChars.length;sp++){
>>>>>         temp=textinsearch.split(specialChars[sp]);
>>>>>         splen = temp.length;
>>>>>
>>>>>         for (spl=1;spl<=splen;spl++){
>>>>>             textinsearch =  textinsearch.replace(specialChars[sp],'');
>>>>>         }
>>>>>     }
>>>>>     queryString = "&insearch="+textinsearch+"&dir=asc&startIndex=0&results=25";
>>>>>  
>>>>>     myDataSource.sendRequest('&sort='+fieldsArray[0].key+'&search='+search+'&query=' + texttosearch+queryString, oCallback2,myDataTable,true);
>>>>>
>>>>> }
>>>>>
>>>>>
>>>>> function test(temp,cmd){
>>>>>
>>>>>     search="";
>>>>>     textinsearch="";
>>>>>     texttosearch="";
>>>>>     var ind = temp;
>>>>>
>>>>>     var elementid = Dom.get('reference'+ind);
>>>>>     Dom.setStyle(elementid,'display','none');
>>>>>
>>>>>     var searchid = Dom.get('search'+ind);
>>>>>     Dom.setStyle(searchid,'display','');
>>>>>
>>>>>     var okcancelid = Dom.get('okcancel'+ind);
>>>>>     Dom.setStyle(okcancelid,'display','');
>>>>>
>>>>>     var tablediv = 'dynamicdata'+ind;
>>>>>
>>>>>
>>>>>     var entityID = Dom.get('hid_entity').value;
>>>>>
>>>>>
>>>>>
>>>>>     var instanceID = Dom.get('hid_ins').value;
>>>>>
>>>>>
>>>>>     if(gup('reportName')){
>>>>>         reportID = gup('reportName');
>>>>>     }
>>>>>
>>>>>     if(gup('module')){
>>>>>         var module = gup('module');
>>>>>     }
>>>>>
>>>>>     var columnHeaders = [];
>>>>>
>>>>>     var header_array = [];
>>>>>
>>>>>     if(!header_array) return;
>>>>>     var myColumnDefs = [];
>>>>>     var summaryAddresses = [];
>>>>>     //var fieldsArray = [];
>>>>>
>>>>>
>>>>>     var formatUrl = function(elCell, oRecord, oColumn, sData) {
>>>>>         if(sData){
>>>>>    
>>>>>             //elCell.innerHTML = "<a href='" + oRecord.getData("editurl") + "'>" + sData + "</a>";
>>>>>
>>>>>             elCell.innerHTML = '<span instance="' + oRecord.getData("instance_index_temp") + '">' + sData + '</span>';
>>>>>
>>>>>         }
>>>>>     };
>>>>>
>>>>>     registerStr = '';
>>>>>     var st =cmd + '~~|~~' + ind + '~~|~~' + registerStr;
>>>>>     // Custom parser
>>>>>     var lmsParser = function(sData) {
>>>>>         if(sData){
>>>>>             var array = sData.split("/");
>>>>>             temp=new Date(array[0] + " " + array[1] + ", " + array[2]);
>>>>>             return temp;
>>>>>         }
>>>>>     };
>>>>>
>>>>>
>>>>>     if(module == 'lms'){
>>>>>         //parameters = {entityID: 7, pageName: 'module', asynchronous: true, func:'gettableheaders',module:'lms'};
>>>>>         var parameters= {
>>>>>             refID:temp,
>>>>>             pageName:'module',
>>>>>             asynchronous: true,
>>>>>             func:'getreferencetableheaders',
>>>>>             module:'lms'
>>>>>         };
>>>>>     }
>>>>>     else if(module == 'reportcreator'){
>>>>>         var parameters = {
>>>>>             reportName: reportName,
>>>>>             pageName: 'module',
>>>>>             asynchronous: true,
>>>>>             func:'getreporttableheaders',
>>>>>             module:'reportcreator'
>>>>>         };
>>>>>     }
>>>>>
>>>>>     new Ajax.Request('index.php',
>>>>>     {
>>>>>         method:'get',
>>>>>         parameters: parameters,
>>>>>         onSuccess: function(transport){
>>>>>             var response = transport.responseText || "Error";
>>>>>      
>>>>>             header_array = eval(response);
>>>>>             if(header_array.length) {
>>>>>                 for(i=0;i<header_array.length;i++){
>>>>>
>>>>>                     var clean_header =  header_array[i].name.replace(/ /g,'');
>>>>>                     clean_header =  clean_header.replace(/:/g,'');
>>>>>                     for (sp=0;sp<specialChars.length;sp++){
>>>>>                         temp=clean_header.split(specialChars[sp]);
>>>>>                         splen = temp.length;
>>>>>
>>>>>                         for (spl=1;spl<=splen;spl++){
>>>>>                             clean_header =  clean_header.replace(specialChars[sp],'');
>>>>>                         }
>>>>>                     }
>>>>>
>>>>>                     summaryAddresses[i] = header_array[i].address;
>>>>>              
>>>>>                     if(header_array[i].AtomicTypeID==7){
>>>>>                         fieldsArray[i] = {
>>>>>                             key:clean_header
>>>>>                         };
>>>>>                         myColumnDefs[i] = {
>>>>>                             key:clean_header,
>>>>>                             label:header_array[i].name,
>>>>>                             sortable:true,
>>>>>                             formatter:formatUrl
>>>>>                         };
>>>>>                     }
>>>>>                     else{
>>>>>                         fieldsArray[i] = {
>>>>>                             key:clean_header
>>>>>                         };
>>>>>                         myColumnDefs[i] = {
>>>>>                             key:clean_header,
>>>>>                             label:header_array[i].name,
>>>>>                             sortable:true,
>>>>>                             formatter:formatUrl
>>>>>                         };
>>>>>                     }
>>>>>                 }
>>>>>                 fieldsArray[i]={
>>>>>                     key:"editurl"
>>>>>                 };
>>>>>                 i++;
>>>>>                 fieldsArray[i]={
>>>>>                     key:"instance_index_temp"
>>>>>                 };
>>>>>                 jsonString = Object.toJSON(summaryAddresses);
>>>>>
>>>>>                 //We have our header array. Now, let's get the data for the table
>>>>>                 myDataSource = new YAHOO.util.DataSource("index.php?module=lms&func=getreferencetabledata&addresses="+jsonString+'&');
>>>>>
>>>>>                 myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
>>>>>        
>>>>>                 myDataSource.responseSchema = {
>>>>>                     resultsList: "records",
>>>>>                     fields: fieldsArray,
>>>>>                     metaFields: {
>>>>>                         totalRecords: "totalRecords" // Access to value in the server response
>>>>>                     }
>>>>>                 };
>>>>>
>>>>>                 // Paginator configurations
>>>>>
>>>>>                 pag = new YAHOO.widget.Paginator({
>>>>>                     rowsPerPage : 20,
>>>>>                     alwaysVisible : false,
>>>>>                     template:YAHOO.widget.Paginator.TEMPLATE_ROWS_PER_PAGE,
>>>>>                     rowsPerPageOptions: [20,50,100]
>>>>>                 });
>>>>>
>>>>>    
>>>>>
>>>>>                 // DataTable configuration
>>>>>
>>>>>                 var myConfigs = {
>>>>>                     initialRequest: "&sort="+fieldsArray[0].key+"&search="+search+"&query="+texttosearch+"&insearch="+textinsearch+"&dir=asc&startIndex=0&results=25", // Initial request for first page of data
>>>>>                     dynamicData: true, // Enables dynamic server-driven data
>>>>>                     sortedBy : {
>>>>>                         key:fieldsArray[0].key,
>>>>>                         dir:YAHOO.widget.DataTable.CLASS_ASC
>>>>>                     }, // Sets UI initial sort arrow
>>>>>                     selectionMode:"single",
>>>>>                     paginator:pag
>>>>>                 };
>>>>>
>>>>>                 myDataTable = new YAHOO.widget.DataTable(tablediv, myColumnDefs, myDataSource, myConfigs);
>>>>>    
>>>>>                 // Subscribe to events for row selection
>>>>>                 myDataTable.subscribe("rowMouseoverEvent", myDataTable.onEventHighlightRow);
>>>>>                 myDataTable.subscribe("rowMouseoutEvent", myDataTable.onEventUnhighlightRow);
>>>>>                 myDataTable.subscribe("rowClickEvent", myDataTable.onEventSelectRow);
>>>>>        
>>>>>                 // Update totalRecords on the fly with value from server
>>>>>                 myDataTable.handleDataReturnPayload = function(oRequest, oResponse, oPayload) {
>>>>>                     oPayload.totalRecords = oResponse.meta.totalRecords;
>>>>>            var rowsperpg = pag.getRowsPerPage();
>>>>> var noofpages  = oPayload.totalRecords/rowsperpg;
>>>>> if (noofpages>1){
>>>>> expandSearch(ind);
>>>>> }
>>>>>                     return oPayload;
>>>>>                 }
>>>>>    
>>>>>
>>>>>                 // Override function for custom server-side sorting
>>>>>                 myDataTable.sortColumn = function(oColumn) {
>>>>>                     // Default descending
>>>>>                     var sDir = "asc"
>>>>>
>>>>>                     // If already sorted, sort in opposite direction
>>>>>                     if(oColumn.key === myDataTable.get("sortedBy").key) {
>>>>>                         sDir = (myDataTable.get("sortedBy").dir === YAHOO.widget.DataTable.CLASS_ASC) ?
>>>>>                         "desc" : "asc";
>>>>>                     }
>>>>>
>>>>>                     // Pass in sort values to server request
>>>>>                     var newRequest = "&search="+search+"&query="+texttosearch+"&insearch="+textinsearch+"&sort=" + oColumn.key + "&dir=" + sDir + "&startIndex=0"+"&results=25";
>>>>>
>>>>>                     // Create callback for data request
>>>>>                     var oCallback = {
>>>>>                         success : function(oRequest, oResponse, oPayload){
>>>>>                             myDataTable.onDataReturnInitializeTable(oRequest, oResponse, oPayload);
>>>>>                             var newState = {
>>>>>                                 totalRecords :  oPayload.totalRecords
>>>>>                             };
>>>>>                             pag.setState(newState);
>>>>>                         },
>>>>>
>>>>>                         scope: myDataTable,
>>>>>                         argument: {
>>>>>                             // Pass in sort values so UI can be updated in callback function
>>>>>                             sorting: {
>>>>>                                 key: oColumn.key,
>>>>>                                 dir: (sDir === "desc") ? YAHOO.widget.DataTable.CLASS_DESC : YAHOO.widget.DataTable.CLASS_ASC
>>>>>                             }
>>>>>                         }
>>>>>                     }
>>>>>
>>>>>                     // Send the request
>>>>>                     myDataSource.sendRequest(newRequest, oCallback,myDataTable,true);
>>>>>                 };
>>>>>
>>>>>                 return {
>>>>>                     ds: myDataSource,
>>>>>                     dt: myDataTable
>>>>>                 };
>>>>>
>>>>>
>>>>>              
>>>>>            
>>>>>      
>>>>>             }
>>>>>
>>>>>         }
>>>>>     });
>>>>> }
>>>>>
>>>>>
>>>>>
>>>>>
>>>>>
>>>>> ------------------------------------
>>>>>
>>>>> Yahoo! Groups Links
>>>>>
>>>>>
>>>>>
>>>>> ------------------------------------------------------------------------
>>>>>
>>>>>
>>>>> No virus found in this incoming message.
>>>>> Checked by AVG - www.avg.com
>>>>> Version: 9.0.698 / Virus Database: 270.14.47/2478 - Release Date: 11/03/09 08:36:00
>>>>>
>>>>>
>>>>>      
>>>>>          
>>>
>>>
>>> ------------------------------------
>>>
>>> Yahoo! Groups Links
>>>
>>>
>>>
>>> ------------------------------------------------------------------------
>>>
>>>
>>> No virus found in this incoming message.
>>> Checked by AVG - www.avg.com
>>> Version: 9.0.698 / Virus Database: 270.14.47/2478 - Release Date: 11/03/09 08:36:00
>>>
>>>
>>>      
>
>
>
>
> ------------------------------------
>
> Yahoo! Groups Links
>
>
>
> ------------------------------------------------------------------------
>
>
> No virus found in this incoming message.
> Checked by AVG - www.avg.com
> Version: 9.0.698 / Virus Database: 270.14.48/2479 - Release Date: 11/03/09 20:38:00
>
>