Quantcast
Channel: Recent Discussions — DataTables forums
Viewing all articles
Browse latest Browse all 82603

Is this the right format for Yet Another DataTables Column Filter and DataTables 1.10?

$
0
0

Being new to this, I'm feeling a little confused with sorting through all of the different information on 1.9 and 1.10.

Can someone tell me if this is a correct format for using DataTables 1.10 and YADCF? My goal is to set up filters for some invisible columns at another location on the page. All of the examples that I see are using dataTables, not DataTables but I don't know if that's right since that would just be using the jQuery dataTables, correct?

All that I'm asking right now is if this looks right or if it needs to be done some entirely different way. I'll set up a jsFiddle once I know I'm on the right track.

-- Doug

LAYOUT

<head>

<!-- head stuff -->


<link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.0/css/jquery.dataTables.css">

<link rel="stylesheet" href="~/Content/Package/yadcf-0.8.0/jquery.dataTables.yadcf.css" />

<script src="//code.jquery.com/jquery-1.11.0.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.js"></script>

<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.0/jquery-ui.js"></script>
<script type="text/javascript" charset="utf8" src="//cdn.datatables.net/1.10.0/js/jquery.dataTables.js"></script>
<script type="text/javascript" charset="utf8" src="~/Content/Package/yadcf-0.8.0/jquery.dataTables.yadcf.js"></script>

<script> type="text/javascript">
    $(document).ready(
        function(){
            $('#courseList').DataTable({
                "columnDefs": [
                    { "targets" [4], "visible": false, "searchable": false },
                    { "targets" [5], "visible": false },
                    { "targets" [6], "visible": false },
                    { "targets" [7], "visible": false },
                    { "targets" [8], "visible": false },
                    { "targets" [9], "visible": false },
                    ],
                "bJQueryUI": true
            }).yadcf([
                { column_number: 5, filter_type: "range_number", filter_container_id: "filter_totalHours" },
                { column_number: 6, filter_type: "range_number", filter_container_id: "filter_tuition" },
                { column_number: 7, filter_container_id: "filter_deliveryMode", filter_default_label: "Select Mode" },
                { column_number: 9, filter_container_id: "filter_monthYear", filter_default_label: "Select Month" }
                ]);
        }
    );
</script>

<!-- other head stuff -->

</head>
<body>

<!--  body stuff  -->

    <table id="courseList" class="offertable">
        <thead>
            <tr>
                <th>Program ID</th>
                <th>Course ID</th>
                <th>Offering</th>
                <th>Details</th>
                <th>Offering Type</th>
                <th>Total Hours</th>
                <th>Tuition</th>
                <th>Delivery Mode</th>
                <th>Fee Basis</th>
                <th>MonthYear</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>EIPR21-EIPR21</td>
                <td></td>
                <td>
                    <h5>
                            <a href=/registration/program/1024/EIPR21-EIPR21/evidence-informed-practice-program>
                            Evidence Informed Practice Program
                            </a>
                    </h5>
                    <br />
                    <p>
                        Short description for Evidence Informed Practice
                    </p>
                    <br />
                </td>
                <td>
                    1/31/2013 <br />
                    12.00 hrs <br />
                    WEB <br />
                    $300.00
                </td>
                <td>program</td>
                <td>12.00</td>
                <td>300.00</td>
                <td>WEB</td>
                <td>P</td>
                <td>2013/01</td>
            </tr>
            <tr>
                <td>DIP-PEDS-2013FA</td>
                <td></td>
                <td>
                    <h5>
                            <a href=/registration/program/1082/DIP-PEDS-2013FA/your-friendly-name-here>
                            Chiropractic Pediatric Certification Program with ICPA
                            </a>
                    </h5>
                    <br />
                    <p>         
                    </p>
                    <br />
                </td>
                <td>
                    9/28/2013 <br />
                    CLASSROOM <br />
                </td>
                <td>program</td>
                <td>0.00</td>
                <td>0.00</td>
                <td>CLASSROOM</td>
                <td>S</td>
                <td>2013/09</td>
            </tr>
            <tr>
                <td>
                    TEST2014-2014SU
                </td>
                <td>
                </td>
                <td>
                    <h5>
                            <a href=/registration/program/1185/TEST2014-2014SU/your-friendly-name-here>
                            Testing the Agresso 5.6.3 Enviroment 101
                            </a>
                    </h5>
                    <br />
                    <p>
                    </p>
                    <br />
                </td>
                <td>
                    6/5/2014 <br />
                    CLASSROOM <br />
                </td>
                <td>program</td>
                <td>0.00</td>
                <td>0.00</td>
                <td>CLASSROOM</td>
                <td>S</td>
                <td>2014/06</td>
            </tr>
            
            <!-- More table rows -->
        </tbody>
    </table>

<!-- More body stuff -->

</body>

Viewing all articles
Browse latest Browse all 82603

Latest Images

Trending Articles



Latest Images

<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>