javascript - 将 dataTable 输入字段宽度设置为自动

Question

是否可以将 dataTable 输入设置为自动调整宽度？

我是 ColdFusion 来加载数据的。

<table style="width: 100%;" id="todayTransactionTable" class="table table-hover table-striped table-bordered">
    <thead>
        <tr>
            <th>Date</th>
            <th>Beginning Balance</th>
            <th>Cash Debit</th>
            <th>Wires<BR>Received</th>
            <th>Returned<BR>Checks</th>
            <th>Redeposits</th>
            <th>Ch2</th>
            <th>Checks Cashed2</th>
            <th>Fees Collected2</th>
            <th>Ch3</th>
            <th>Checks Cashed3</th>
            <th>Fees Collected3</th>
            <th>Save</th>
        </tr>
    </thead>
    <tbody>
        <cfloop query="getCCTransactions">
            <cfoutput>
                <tr>
                    <td>#dateFormat(workdate, 'mm/dd/yyyy')#</td>
                    <td><input type="number" value="#balance#" step="0.01" /></td>
                    <td><input type="number" value="#cashorder#" step="0.01"  /></td>
                    <td><input type="number" value="#wires#" step="0.01" /></td>
                    <td><input type="number" value="#returnedChecks#" step="0.01" /></td>
                    <td><input type="number" value="#redeposits#" step="0.01" /></td>
                    <td><input type="number" value="#checks2#" /></td>
                    <td><input type="number" value="#checksCashed2#" step="0.01"  /></td>
                    <td><input type="number" value="#feesCollected2#" step="0.01" /></td>
                    <td><input type="number" value="#checks3#" /></td>
                    <td><input type="number" value="#checksCashed3#" step="0.01" /></td>
                    <td><input type="number" value="#feesCollected3#" step="0.01" /></td>
                    <td><a class="mb-2 mr-2 btn-icon btn-pill btn btn-link">Update</button></td>
                </tr>
            </cfoutput>
        </cfloop>
    </tbody>
</table>

然后，我在 JavaScript 脚本中设置 dataTable 设置：

<script>
    $( document ).ready(function() {
        $('#todayTransactionTable').DataTable({
            responsive: true,
            "pageLength": 50,
            "order": [[ 0, "desc" ]]
        });
    });
</script>

我的问题是输入字段的宽度太大，并且某些列会消失，因为responsive: true. 如何使输入为自动宽度？

标签： javascripthtmlcssdatatables