jQuery Plugin - anysearch.js


  • Direct search in browser
  • Search without inputfield
  • Activate searchfield optional
  • Activate searchslider optional
  • Supports barcode scanner
  • Searchfilter
Demo
Download
Report an Issue

Usage & Setup


1. Include the latest JQuery javascript library on your web page.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
2. Include anysearch.js and anysearch.css on your page.
<link href="css/anysearch.css" rel="stylesheet">
<script src="js/anysearch.js"></script>
3. Usage
$(document).ready(function() { 
    $(document).anysearch({
        searchFunc: function(search) {
            alert(search);
        }
    });
});

Options and configuration

Option Standard value Description
reactOnKeycodes:'string'Search only reacts on given ASCII Keycodes.

Options:
'all'
'string'
'numeric'
'48,49,50,51,52,53,54,55,56,57' // ASCII char codes
secondsBetweenKeypress:2After given time anysearch.js clears the search string. anysearch.js resets the timer on each keystroke.

Options:
0.001 - 99
searchPattern:{1: '[^~,]*'}Filters the input string, before it is sent to the search.

Options:
// JSON Object of regular expressions
{1: '(\\d+)', 2: '((?:[a-z][0-9]+))'}
minimumChars:3Necessary amount of charakters to start the search script.

Options:
1 - 99
liveField:falseGiven selector will be filled in realtime on writing.

Options:
false
{selector: '#example', value: true}
{selector: '#example', html: true}
{selector: '#example', attr: 'title'}
excludeFocus:'input,textarea,select'While one of the given selectors focused, anysearch will be deactivated.

Options:
selector
enterKey:13ASCII Keycode for Enter.

Options:
ASCII charcode
backspaceKey:8ASCII Keycode for Backspace.

Options:
ASCII charcode
checkIsBarcodeMilliseconds:250Time in milliseconds the barcode scanner is allowed to need for a scan.

Options:
1 - 9999
checkBarcodeMinLength:4Minimum amount of characters for a barcode.

Options:
1 - 99
searchSlider:trueActivates searchslider with inputfield.

Options:
true
false
startAnysearch:function(){}Callback function will be triggered by first reaction of anysearch.js

Options:
function(){ 
    // do something 
}
stopAnysearch:function(){}Callback function will be triggered once anysearch.js ends.

Options:
function(){ 
    // do something 
}
minimumCharsNotReached:function(string, stringLength, minLength){}Callback function will be triggered if the length of the search string is lower then the value of "minimumChars".

Options:
function(string, stringLength, minLength){ 
    // do something with string, stringLength, minLength 
}
searchFunc:function(string){}Callback function for the search (e.g. serverside script).

Options:
function(string){ 
    // do something with the string 
}
patternsNotMatched:function(string, patterns){}Callback function will be triggered if "searchPattern" returns false.

Options:
function(string, patterns){ 
    // do something with string or patterns 
}
isBarcode:function(barcode){}Callback function will be triggered if a barcode is detected.

Options:
function(barcode){ 
    // do something with the barcode 
}

Example

$(document).ready(function() {
    $(document).anysearch({
        reactOnKeycodes: 'all',
        secondsBetweenKeypress: 1,
        searchPattern: {1: '[^~,]*'},
        minimumChars: 3,
        liveField: {selector: '#liveField', value: true},
        excludeFocus: 'input,textarea,select,#tfield',
        enterKey: 13,
        backspaceKey: 8,
        checkIsBarcodeMilliseconds: 250,
        checkBarcodeMinLength: 6,
        searchSlider: true,
        startAnysearch: function() {
            openHelp();
        },
        stopAnysearch: function() {
            closeHelp();
        },
        minimumCharsNotReached: function(string, stringLength, minLength) {
            alert(string + ' has ' + stringLength + ' chars! Minlength: ' + minLength);
        },
        searchFunc: function(string) {
            doAjaxSearch(string);
        },
        patternsNotMatched: function(string, patterns) {
            alert(string + ' must be in this form: ' + patterns);
        }, 
        isBarcode: function(barcode){
            ajaxCheckBarcode(barcode);
        }
    });
});