Friday, July 1, 2016

Simple Fast Search box for SharePoint

Today I am going to show you simple but very fast Search option for your SharePoint List/Document library. Probably you need this type of search option when user bagging and having trouble with SharePoint build search options.


Step 1
Open your SharePoint List and edit it.

Step 2
Add CEWP (Content Editor Web part) and copy paste bellow code. (or save below code to text file and upload to Document library. after that connect to QEWP)

<script type="text/javascript" src="https://code.jquery.com/jquery-2.2.4.js"></script>
<script>
jQuery.expr[':'].Contains = function(a,i,m){return (a.textContent || a.innerText || "").toUpperCase().indexOf(m[3].toUpperCase())>=0;};

$(document).ready(function(){


    var webPartID = $("#WebPartWPQ2");


    $(webPartID).prepend('<div style="padding: 2px; border: 1px solid rgb(204, 204, 204); margin: 5px auto 0pt; background: #ccc; display: block;"><h3 style="text-align: center;margin:2px;">Instant search: <input type="text" class="search" style="padding: 5px;"/></h3></div>');


        $("input.search").change(function() {

            var txt = $("input.search").val();
            if (txt) {
                $(webPartID).find("td:not(:Contains("+txt+"))").parent("tr.ms-itmhover").hide();
                $(webPartID).find("td:Contains("+txt+")").parent("tr.ms-itmhover").show();
            } else {
                $(webPartID).find("td").parent("tr.ms-itmhover").show();
            }
        }).keyup(function(){$(this).change();
    })
});
</script>


No comments:

Post a Comment