CODEWITHSUNDEEP
datatablecoldfusion
myTest532 myTest532
myTest532 myTest532

Reputation: 2381

ColdFusion dataTable returning f is undefined

I'm adding dataTable to my coldFusion project, but it is returning: Uncaught TypeError: f is undefined

Code:

<table id="webPosttable" cellpadding="5" cellspacing="0">
    <thead>
        <tr>
            <th>DATE</th>
            <th>CK</th>
            <th>NAME</th>
            <th>IN</th>
            <th>RATE</th>
            <th>COST</th>
        </tr>
    </thead>
    <tbody>
    <cfoutput query="myQuery">
        <cfset totalreportin = totalreportin + val(counter)>
        <cfset totalreportcost = rate*counter + totalreportcost>
        <tr>
            <TD>#inserteddate#</TD>
            <TD>#ck#</TD>
            <TD>#fullname#</td>
            <TD><a href="link.cfm?d=#inserteddate#&ck=#ck#"  target="_blank">#counter#</a></TD>
            <td>#decimalformat(rate)#</td>
            <td>#dollarformat(rate*counter)#</td>
        </tr>
    </cfoutput>
    </tbody>
    <tfoot>
        <cfoutput>
        <tr>
            <TD colspan="3">TOTAL:</TD><td>#totalreportin#</td><TD></td><td>#dollarformat(totalreportcost)#</td>
            <TD colspan="3">AVERAGE:</TD><td><Cfif incomingreport.recordcount GT 0>#decimalformat(val(totalreportin/incomingreport.recordcount))#<Cfelse>0</CFIF></td>
        </tr>
        <tr>
            <td></td><td><Cfif totalreportin GT 0>#dollarformat(totalreportcost/totalreportin)#<cfelse>0</cfif></td>
        </tr>
        </cfoutput>
    </tfoot>
</table>

<script>
        $('#webPosttable').DataTable({
            "lengthChange": false,
            "paging": false,
            "bInfo" : false,
            "dom": '<"pull-left"f><"pull-right"l>tip'
        });
</script>

Does anyone know what if something is missing in my table structure or javascript datable settings?

Thanks

Upvotes: 0

Views: 128

Answers (1)

Sev Roberts
Sev Roberts

Reputation: 1295

The problem won't be in your Coldfusion code, it will be the structure of your <tfoot> content. The number of columns in the tfoot doesn't match the number of columns in the rest of your table. Even the two trs within your tfoot don't match each other.

Comment out the tfoot temporarily to test whether it works without, then balance up the columns and put it back in.

eg:

<tfoot>
    <cfoutput>
    <tr>
        <TD>TOTAL:</TD>
        <td>#totalreportin#</td>
        <td></td>
        <td>#dollarformat(totalreportcost)#</td>
        <TD>AVERAGE:</TD>
        <td><Cfif incomingreport.recordcount GT 0>#decimalformat(val(totalreportin/incomingreport.recordcount))#<Cfelse>0</CFIF></td>
    </tr>
    <tr>
        <td colspan="5"></td>
        <td><Cfif totalreportin GT 0>#dollarformat(totalreportcost/totalreportin)#<cfelse>0</cfif></td>
    </tr>
    </cfoutput>
</tfoot>

If you still have errors after that then I'd advise updating the question to include the code showing which version of jQuery+datatables you're including and where and how you're including it. You may also need to wrap your script in a $(document).ready( function () { ...

Upvotes: 2

Related Questions