Question

BA.Table.prototype.drawHeader = function()
{
    if ( ! this.headHTML ) {
        this.headHTML = $('<thead/>');
        var tr = $('<tr/>');

        var didSort = false;

        if ( ! this.config.noIndex ) {
            var th = $('<th class="table_index"></th>');
            th.appendTo(tr);
        }

        for( var ix = 0; ix < this.children.length; ix++ ) {
            var child = this.children[ix];
            if ( child instanceof BA.InputHidden
                 || ( child.config && child.config.hidden ) )
            {
                continue;
            }
            if ( ! child.config.id ) {
                child.config.id = 'c' + ix;
            }
            var label = child.config.label ? child.config.label : '';

            var labelHTML;
            if ( child.config.title ) {
                labelHTML = $('<th><span title="' + child.config.title + '">' + label + '</span></th>');
            } else if ( child.config.sort ) {
                var a = $('<a href="#" id="sort_' + child.config.id + '">' + label + '</a>');
                a.bind('click', {t: this, i: ix}, function(event) { event.data.t.sortByColumn(event.data.i); return false; });
                if ( child.config.sorted ) {
                    var img = child.config.sorted > 0 ? 'up' : 'down';
                    $('<img src="' + window.IMAGES_PATH + img + '.gif"/>').appendTo(a);
                }
                labelHTML = $('<th/>');
                a.appendTo(labelHTML);
            } else {
                labelHTML = $('<th>' + label + '</th>');
            }

            labelHTML.appendTo(tr);
            child.hideLabel = true;
        }

        if ( this.config.canAddRows === undefined || this.config.canAddRows == true
             || this.config.canDeleteRows
        ) {
            var labelHTML = $('<th class="action"> </th>');
            $(labelHTML).appendTo(tr);
        }
        tr.appendTo(this.headHTML);
        this.headHTML.appendTo(this.tableHTML);
    }
}; <br>

The above is common library for creating table. Using json object to draw the table
The below is php page

<?php  if ( ! defined('BASEPATH')) exit('No direct script access allowed');
<script type="text/javascript">
var listLayout = {
    o: 'Page',
 c: [
        { o: 'Form', id: 'list', name: 'list', c: [
            { o: 'Table', canAddRows: false, value: [],
                caption: { c: [
                  { o: 'Button', label: '<?php echo lang("add_new_volume");?>', id: 'vr_add_icon' }
              ]},
              c: [             
                { o: 'HTML', label: '<?php echo lang('volumes');?>', id: 'volumes_', 'class': 'name' },
                { o: 'HTML', label: '<?php echo lang('type');?>', id: 'type_', 'class': 'type' },
                { o: 'HTML', label: '<?php echo lang('drives');?>', id: 'drives_', 'class': 'driver' },
                { o: 'HTML', label: '<?php echo lang('usage');?>', id: 'usage_', 'class': 'usage' },
                { o: 'HTML', label: '<?php echo lang('size');?>', id: 'size_', 'class': 'size' },
                { o: 'HTML', label: '<?php echo lang('status');?>', id: 'status_', 'class': 'status' },
                { o: 'HTML', label: '<?php echo lang('operations');?>', id: 'action_' }
            ]},
            {
                o: 'HTML',
                html: '<div class="mv_ajax_status"></div>'
            }
        ]}
    ]

in the above image first colum heading is missing.. with out editing library how can i added Sr.no for first column. i need first colum heading name is Sr.no. but with out added anything to main library..

if ( ! this.config.noIndex ) {
            var th = $('<th class="table_index"></th>');
            th.appendTo(tr);
        }

if i added above var th = $('<th class="table_index">Sr.no</th>'); it come..but without adding theer how can i get first colum heading. ?
Thanks

Answer 1

try :

$('th:first').text('Sr.no');

Uses the :first selector to select the first th