Click here to Skip to main content
15,920,896 members
Home / Discussions / ASP.NET
   

ASP.NET

 
AnswerRe: browser issues Pin
Manas Bhardwaj23-Jan-10 1:18
professionalManas Bhardwaj23-Jan-10 1:18 
AnswerRe: browser issues Pin
April Fans25-Jan-10 0:52
April Fans25-Jan-10 0:52 
Questionused iframe in my webpage want to get url of the ifram , refresh the iframe, full screen the iframe using the buttons of the web page Pin
praveenkumar_vittaboina22-Jan-10 19:32
praveenkumar_vittaboina22-Jan-10 19:32 
QuestionListbox SelectedIndex changed and click event Pin
sjs4u22-Jan-10 18:56
sjs4u22-Jan-10 18:56 
AnswerRe: Listbox SelectedIndex changed and click event Pin
Not Active23-Jan-10 2:21
mentorNot Active23-Jan-10 2:21 
QuestionPop up or model dialgue for aspx page Pin
indian14322-Jan-10 8:13
indian14322-Jan-10 8:13 
AnswerRe: Pop up or model dialgue for aspx page Pin
Not Active22-Jan-10 11:09
mentorNot Active22-Jan-10 11:09 
QuestionHTML table in Ajax tab control Pin
Rock Star.22-Jan-10 4:24
Rock Star.22-Jan-10 4:24 
Hi,
   I want to keep an HTML table with pagiing inside a ajax tab control for that I have written following code

This is ASPX code

<ajax:TabContainer ID="tabHomeownTips" runat="server"
            ActiveTabIndex="0" Width="565px" Height="600px" Font-Underline="False"
            Enabled="true" EnableTheming="True" ScrollBars="Auto" EnableViewState="False" >
            <ajax:TabPanel ID="TabTip1" HeaderText="Tip1" runat="server" OnClientClick="function(){LoadTableTab('results','pageNavPosition');}">
                  <ContentTemplate>
                        <table id="results" >
                              <tr>
                                    <th>Sr. No.</th>
                                    <th>Description</th>
                              </tr>
                              <tr>
                                    <td>1</td>
                                    <td>Description of Tab1 Item 1</td>
                              </tr>
                              <tr>
                                    <td>2</td>
                                    <td>Description of Tab1 Item 2</td>
                              </tr>
                              <tr>
                                    <td>3</td>
                                    <td>Description of Tab1 Item 3</td>
                              </tr>
                              <tr>
                                    <td>4</td>
                                    <td>Description of Tab1 Item 4</td>
                              </tr>
                              <tr>
                                    <td>5</td>
                                    <td>Description of Tab1 Item 5</td>
                              </tr>
                              <tr>
                                    <td>6</td>
                                    <td>Description of Tab1 Item 6</td>
                              </tr>
                        </table>
                        <div id="pageNavPosition"></div>
                  </ContentTemplate>
            </ajax:TabPanel>
           
            <ajax:TabPanel ID="TabTip2" HeaderText="Tip2" runat="server" OnClientClick="function(){LoadTableTab('Table1','Div1');}">
                  <ContentTemplate>
                        <table id="Table1">
                              <tr>
                                    <th>Sr. No.</th>
                                    <th>Description</th>
                              </tr>
                              <tr>
                                    <td>1</td>
                                    <td>Description of Tab1 Item 1</td>
                              </tr>
                              <tr>
                                    <td>2</td>
                                    <td>Description of Tab1 Item 2</td>
                              </tr>
                              <tr>
                                    <td>3</td>
                                    <td>Description of Tab1 Item 3</td>
                              </tr>
                              <tr>
                                    <td>4</td>
                                    <td>Description of Tab1 Item 4</td>
                              </tr>
                              <tr>
                                    <td>5</td>
                                    <td>Description of Tab1 Item 5</td>
                              </tr>
                              <tr>
                                    <td>6</td>
                                    <td>Description of Tab1 Item 6</td>
                              </tr>
                        </table>
                        <div id="Div1"></div>
                  </ContentTemplate>
            </ajax:TabPanel>
     
            </ajax:TabContainer>

</pre>


This is Javascript code

function LoadTableTab(tblid,divid){
     
            var pager = new Pager(tblid, 2);
            pager.init();
            pager.showPageNav('pager', divid);
            pager.showPage(1);
      }

                 
      function Pager(tableName, itemsPerPage) {
            this.tableName = tableName;
            this.itemsPerPage = itemsPerPage;
            this.currentPage = 1;
            this.pages = 0;
            this.inited = false;

            this.showRecords = function(from, to) {           
                  var rows = document.getElementById(tableName).rows;
                  // i starts from 1 to skip table header row
                  for (var i = 1; i < rows.length; i++) {
                        if (i < from || i > to)  
                              rows[i].style.display = 'none';
                        else
                              rows[i].style.display = '';
                  }
            }

            this.showPage = function(pageNumber) {
                  if (! this.inited) {
                        alert("not inited");
                        return;
                  }

                  var oldPageAnchor = document.getElementById('pg'+this.currentPage);
                  oldPageAnchor.className = 'pg-normal';
                 
                  this.currentPage = pageNumber;
                  var newPageAnchor = document.getElementById('pg'+this.currentPage);
                  newPageAnchor.className = 'pg-selected';
                 
                  var from = (pageNumber - 1) * itemsPerPage + 1;
                  var to = from + itemsPerPage - 1;
                  this.showRecords(from, to);
            }  

            this.prev = function() {
                  if (this.currentPage > 1)
                        this.showPage(this.currentPage - 1);
            }

            this.next = function() {
                  if (this.currentPage < this.pages) {
                        this.showPage(this.currentPage + 1);
                  }
            }                                   

            this.init = function() {
                  var rows = document.getElementById(tableName).rows;
                  var records = (rows.length - 1);
                  this.pages = Math.ceil(records / itemsPerPage);
                  this.inited = true;
            }

            this.showPageNav = function(pagerName, positionId) {
                  if (! this.inited) {
                        alert("not inited");
                        return;
                  }
                  var element = document.getElementById(positionId);
                
                  var pagerHtml = ' ';
                  for (var page = 1; page <= this.pages; page++)
                  {
                        if(page >1)
                        {
                              pagerHtml += ' | ';
                        }
                 
                        pagerHtml += '<span id="pg' + page + '" class="pg-normal" onclick="' + pagerName + '.showPage(' + page + ');">' + page + '</span>';
                        pagerHtml += '';
                  }
                 
                  element.innerHTML = pagerHtml;
            }
}




I have tried this code in normal page it works fine but when I am using same code then Its giving me the Table in Paging section but whenever I am click on Page number I am getting error as 'pager' is undefined. What am I missing and How can I fix this bug to make it working in ajax tab control

Thanks

Rock Star

QuestionCrystal Report Direct Print Pin
Girish_Sharma22-Jan-10 1:29
Girish_Sharma22-Jan-10 1:29 
AnswerRe: Crystal Report Direct Print Pin
thatraja22-Jan-10 2:12
professionalthatraja22-Jan-10 2:12 
GeneralRe: Crystal Report Direct Print Pin
Girish_Sharma22-Jan-10 2:27
Girish_Sharma22-Jan-10 2:27 
GeneralRe: Crystal Report Direct Print Pin
thatraja22-Jan-10 2:39
professionalthatraja22-Jan-10 2:39 
GeneralRe: Crystal Report Direct Print Pin
Girish_Sharma23-Jan-10 1:06
Girish_Sharma23-Jan-10 1:06 
GeneralRe: Crystal Report Direct Print Pin
thatraja23-Jan-10 6:43
professionalthatraja23-Jan-10 6:43 
GeneralRe: Crystal Report Direct Print Pin
Girish_Sharma24-Jan-10 17:13
Girish_Sharma24-Jan-10 17:13 
GeneralRe: Crystal Report Direct Print Pin
thatraja24-Jan-10 21:25
professionalthatraja24-Jan-10 21:25 
GeneralRe: Crystal Report Direct Print Pin
Girish_Sharma24-Jan-10 22:08
Girish_Sharma24-Jan-10 22:08 
GeneralRe: Crystal Report Direct Print Pin
thatraja25-Jan-10 8:46
professionalthatraja25-Jan-10 8:46 
GeneralRe: Crystal Report Direct Print Pin
Girish_Sharma26-Jan-10 18:50
Girish_Sharma26-Jan-10 18:50 
GeneralRe: Crystal Report Direct Print Pin
thatraja1-Feb-10 21:40
professionalthatraja1-Feb-10 21:40 
GeneralRe: Crystal Report Direct Print Pin
shrikant.kudlur6-Apr-11 19:27
shrikant.kudlur6-Apr-11 19:27 
AnswerRe: Crystal Report Direct Print Pin
thatraja6-Apr-11 22:49
professionalthatraja6-Apr-11 22:49 
GeneralRe: Crystal Report Direct Print Pin
shrikant.kudlur10-Apr-11 20:18
shrikant.kudlur10-Apr-11 20:18 
AnswerRe: Crystal Report Direct Print Pin
thatraja11-Apr-11 5:17
professionalthatraja11-Apr-11 5:17 
GeneralRe: Crystal Report Direct Print Pin
shrikant.kudlur18-Apr-11 18:57
shrikant.kudlur18-Apr-11 18:57 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.