Moving from Examples to my Project

GMGraying

Since I am new at this, I have found it easier to use the examples to do with I need and have been using #example for the table name each time. Now that I want to change #example to my table name, nothing works. Where does 'example' need to be changed so that I can use my own table names?

Many thanks for any responses.

allan

Its the table id. In many of the examples you will see:

<table id="example" ...>

The # is a jQuery ID selector, so it is just selecting the element with that id (jQuery docs). So to change example to something else you need to change the id in the HTML and the id in the selector.

Regards,
Allan

GMGraying

Yes. This is basic info that I know. What I am trying to say is that if I change the table name (AKA id) to something other than example, it all breaks.

Apezdr

Can you include the code you're using to initialize datatables?

Example.

...
var table = $('#notExample').DataTable( {
            ajax: {
                url: '/include/dashboard-dates/php/table.DataCollection.php?date=' + $(this).parent().attr('class'),
                async: true
            },
            columns: [
                {
                    "title":"Start Date",
                    "data": "DataCollection.start_date"
                },
                {
                    "title":"End Date",
                    "data": "DataCollection.end_date"
                },
                {
                    "title":"Start Time",
                    "data": "DataCollection.start_time"
                },
                {
                    "title":"End Time",
                    "data": "DataCollection.end_time"
                },
                {
                    "title":"TI Acct Code",
                    "data": "DataCollection.tiacctcode"
                },
                {
                    "title":"Task Title",
                    "data": "TaskType.TaskTitle"
                },
                {
                    "title":"Task Specific Notes",
                    "data": "DataCollection.task_data"
                },
                {
                    "title":"General Notes",
                    "data": "DataCollection.task_description"
                },
                {
                    "title":"Created",
                    "data": "DataCollection.created"
                }
            ],
            /* columnDefs: [
                {
                    "type":"date",
                    targets: [ 0 ],
                    orderData: [ 0 ]
                }, {
                    "type":"date",
                    targets: [ 1 ],
                    orderData: [ 1 ]
                }, {
                    "type":"time",
                    targets: 2,
                    orderData: [ 2 ]
                }, {
                    "type":"time",
                    targets: 3,
                    orderData: [ 3 ]
                }
            ], */
            displayLength: 25,
            select: true,
            ordering: true,
            lengthChange: false
        } );
...

Apezdr

If you have a live example, even better.

allan

I've just put together this little example. I've used an id of allan and simply changed the selector and id attribute, and it works as expected.

As Apezdr says, to understand why that isn't working for you, we'd need a link to a page showing the issue please or the full HTML and Javascript being used.

Thanks,
Allan