CODEWITHSUNDEEP
jspdatatablesel
Faizan Ali
Faizan Ali

Reputation: 97

Search within input tag with Datatables

I recently discovered DataTables (http://datatables.net/) and have been playing around with its features.

I'm running into a bit of trouble with the search feature. I'm using DataTables in a JSP webapp, where I use expression language (EL) to pull and display information stored in the session.

Here is a sample of my code:

<table id="list" class="table table-hover results">
    <thead>
        <tr>
            <th>Name</th>
        </tr>
    </thead>
    <tbody>
        <c:forEach var="elt" items="${listCandidates}">
            <tr>
                <td>
                    <form action="ViewFullCandidateProfileServlet">
                        <a href="#">
                            <input type="hidden" name="candidateID" value="${elt.candidateID }">
                            <input type="submit" name="View Profile" value="${elt.firstName} ${elt.lastName}">
                        </a>
                    </form>
                </td>
            </tr>
        </c:forEach>
    </tbody>
</table>

The search fails to pick up data within the value attribute in the input tags. How can I direct it to look there?

Appreciate any pointers, Cheers!

Upvotes: 1

Views: 589

Answers (1)

MaVRoSCy
MaVRoSCy

Reputation: 17849

You can create your custom search functionality for your datatables like this:

$.fn.dataTableExt.ofnSearch['html-input'] = function(value) {
    return $(value).val(); //will search in value attibute of element
};

and then attach your search functionality to datatables:

var table = $("#example").DataTable({
    columnDefs: [{ "type": "html-input", "targets": [0, 3] }] 
});

Here is also a working fiddle

Thanks to @davidkonrad

Upvotes: 1

Related Questions