CodeIgniter Forums
Trouble with jquery external file - Printable Version

+- CodeIgniter Forums (https://forum.codeigniter.com)
+-- Forum: Archived Discussions (https://forum.codeigniter.com/forumdisplay.php?fid=20)
+--- Forum: Archived Development & Programming (https://forum.codeigniter.com/forumdisplay.php?fid=23)
+--- Thread: Trouble with jquery external file (/showthread.php?tid=53603)

Trouble with jquery external file - El Forum - 07-31-2012

[eluser]whiteae[/eluser]
I can't get my page to execute the table sorter based on the Tablesorter 2.0 plugin. My code is

[removed][removed]
[removed]
Code:
$(document).ready(function()
        {
            $("#myTable").tablesorter();
        } );
        [removed]
    </head>
    <body>
        <div id="container">
          <h1>DCi</h1>
          &lt;?php echo anchor('dci_controller/index', 'Back to Items<br />');?&gt;

            <h2>&lt;?php echo "$catalog: $partNo";?&gt;</h2>

        <div id="wrapper">
            <ul class="tabs">
                <li><a href="#" class="defaulttab" rel="tabs1">Description</a></li>

            </ul>
        &lt;!--Tab Content --&gt;
<div class="tab-content" id="tabs1">
                &lt;?php
                    echo $this->table->set_heading('Year', 'Make', 'Model', 'Submodel', 'Engine Type', 'Liter',
                            'Fuel', 'Fuel Delivery Type', 'Fuel Configuration', 'Aspiration', 'Engine VIN',
                            'Engine Designation');
                   $template = array('table_open' => '<table id="myTable" class="tablesorter" border="0" cellpadding="4" cellspacing="0">');
                   $this->table->set_template($template);
                   echo $this->table->generate($YMM);
                ?&gt;
</div>

It's not showing anything when I go to my page. I don't know what I have done wrong. If you see anything let me know. Thanks Smile

Trouble with jquery external file - El Forum - 07-31-2012

[eluser]pickupman[/eluser]
For the tablesorter plugin, you need to have your heading tags inside a <thead> <tr> <th> tags. You will need to use:
Code:
$template = array('table_open' => '<table id="myTable" class="tablesorter" border="0" cellpadding="4" cellspacing="0">',
   'heading_row_start'   => '<thead><tr>',
   'heading_row_end'     => '</tr></thead>',
   'heading_cell_start'  => '<th>',
   'heading_cell_end'    => '</th>'
);


Trouble with jquery external file - El Forum - 08-03-2012

[eluser]whiteae[/eluser]
Still doesn't work.

Trouble with jquery external file - El Forum - 08-03-2012

[eluser]pickupman[/eluser]
I have tested this and the table does sort as expected.
Code:
//head
//jquery src file
//jquery.tablesorter.js file
//jquery.tablesorter.css file
$(document).ready(function(){
  $("#myTable").tablesorter();
});


//body
$template = array('table_open' => '<table id="myTable" class="tablesorter" border="0" cellpadding="4" cellspacing="0">',
     'heading_row_start'   => '<tr>',
     'heading_row_end'     => '</tr>',
     'heading_cell_start'  => '<th>',
     'heading_cell_end'    => '</th>'
  );  
  $this->table->set_template($template);
  
  $this->table->set_heading('ID', 'Name');
  
  $this->table->add_row(array(1, 'Joe'));
  $this->table->add_row(array(2, 'John'));
  $this->table->add_row(array(3, 'Jeff'));
  
  echo $this->table->generate();

Unless you have copied over a css/theme file, you may think the table is not working like on the demo page, however the column headings should still sort when clicking them.