updated readme and license files

This commit is contained in:
2011-03-31 23:22:14 +01:00
parent ab085dbeaf
commit 33aefc7bbe
2 changed files with 20 additions and 18 deletions

View File

@@ -1,6 +1,6 @@
(The MIT License) (The MIT License)
Copyright (c) 2009 Jim Myhrberg. Copyright (c) 2011 Jim Myhrberg.
Permission is hereby granted, free of charge, to any person obtaining Permission is hereby granted, free of charge, to any person obtaining
a copy of this software and associated documentation files (the a copy of this software and associated documentation files (the

View File

@@ -1,4 +1,4 @@
# Suggest Results # Fancy Input / Fancy Suggest
Easily customizable search suggestion plugin for jQuery, which suggests results directly, rather than search terms. Easily customizable search suggestion plugin for jQuery, which suggests results directly, rather than search terms.
@@ -10,18 +10,19 @@ Check out the [Demo][].
First of all you will need [jQuery][], visit their [site][jquery] for more info. First of all you will need [jQuery][], visit their [site][jquery] for more info.
Then include both `jquery.suggest_results.js` and `jquery.suggest_results.css` on your page. Then include both `jquery.fancy_input.js` and `jquery.fancy_input.css` on your page.
<script src="/suggest_results/jquery.suggest_results.js" type="text/javascript"></script> <script src="/fancy_input/jquery.fancy_input.js" type="text/javascript"></script>
<link href="/suggest_results/jquery.suggest_results.css" rel="stylesheet" type="text/css" /> <script src="/fancy_input/jquery.fancy_suggest.js" type="text/javascript"></script>
<link href="/fancy_input/jquery.fancy_input.css" rel="stylesheet" type="text/css" />
## Usage ## Usage
### Local Javascript Array ### Local Javascript Array
To use Suggest Results, simply call it on a targeted text input element. For example if you have a search box for a users friends: To use Fancy Results, simply call it on a targeted text input element. For example if you have a search box for a users friends:
$("#search_friends").suggest_results({ $("#search_friends").fancy_suggest({
data: userFriends data: userFriends
}); });
@@ -38,9 +39,9 @@ The `match` attribute is useful when you need to include extra information like
### Ajax Call ### Ajax Call
To fetch results via an Ajax call, attach Suggest Results like this to your input element: To fetch results via an Ajax call, attach Fancy Results like this to your input element:
$("#search_friends").suggest_results({ $("#search_friends").fancy_suggest({
url: "/search_friends_json.php" url: "/search_friends_json.php"
}); });
@@ -59,16 +60,16 @@ Also, a query cache is used so a specific search term is only requested once per
## Options ## Options
There's a number of options you can pass `$.suggest_results()`. There's a number of options you can pass `$.fancy_suggest()`.
* **data:** Javascript array with available results. * **data:** Javascript array with available results.
* **url:** URL to send ajax request to for results. Either `url` or `data` are required for Suggest Results to work at all. * **url:** URL to send ajax request to for results. Either `url` or `data` are required for Fancy Results to work at all.
* **name:** When used, the value is used as the class for the suggest box. Useful for having a custom styled suggest box one of two or more input fields with suggestion turned on. * **name:** When used, the value is used as the class for the suggest box. Useful for having a custom styled suggest box one of two or more input fields with suggestion turned on.
* **exact_match:** Results much be an exact match to typed input. If disabled any one word typed is a value match. Enabled by default, and has no effect when fetching results via Ajax. * **exact_match:** Results much be an exact match to typed input. If disabled any one word typed is a value match. Enabled by default, and has no effect when fetching results via Ajax.
* **limit:** Limit the number of suggestions shown. When using the Ajax method, an extra `limit` GET/POST var is supplied. * **limit:** Limit the number of suggestions shown. When using the Ajax method, an extra `limit` GET/POST var is supplied.
* **no_results:** When set to true, a "No Results" label is shown if entered text doesn't yield any results. Enabled by default. * **no\_results:** When set to true, a "No Results" label is shown if entered text doesn't yield any results. Enabled by default.
* **no\_results\_label:** Text shown when there are no results if `no_results` is enabled. Default is "No Results". * **no\_results\_label:** Text shown when there are no results if `no_results` is enabled. Default is "No Results".
* **url_method:** URL method used for Ajax call. Set to "get" or "post". Default is "get". * **url\_method:** URL method used for Ajax call. Set to "get" or "post". Default is "get".
## Customization ## Customization
@@ -83,7 +84,7 @@ For example, if we want to display some extra info underneath our friend's names
When we attach the suggestions to our input element, we specify the `tpl_result_body` option: When we attach the suggestions to our input element, we specify the `tpl_result_body` option:
$("#search_friends").suggest_results({ $("#search_friends").fancy_suggest({
url: "/search_friends_json.php", url: "/search_friends_json.php",
name: "search_friends", name: "search_friends",
tpl_result_body: '<span class="title">{{title}}</span><span class="info">{{info}}</span>' tpl_result_body: '<span class="title">{{title}}</span><span class="info">{{info}}</span>'
@@ -94,11 +95,11 @@ In the `tpl_result_body` option, `{{title}}` is replaced with the `title` attrib
Then to prettify it, we add some CSS: Then to prettify it, we add some CSS:
/* Effects all suggestion boxes */ /* Effects all suggestion boxes */
#suggest_results li span.info { #fancy_suggest li span.info {
color: #888; color: #888;
} }
/* Effects only the #search_friends suggestion box */ /* Effects only the #search_friends suggestion box */
#suggest_results.search_friends li { #fancy_suggest.search_friends li {
border-bottom-style: dashed; border-bottom-style: dashed;
} }
@@ -110,6 +111,7 @@ There are some more options available too for customization, so I recommend you
* Handle mouse hovering and keyboard navigation a bit better when used at the same time on a suggest box. * Handle mouse hovering and keyboard navigation a bit better when used at the same time on a suggest box.
* Support suggesting search terms in addition to currently only supporting results. * Support suggesting search terms in addition to currently only supporting results.
* Add callbacks for most things. * Add callbacks for most things.
* Build other "fancy" input methods on top of `$.fancy_text()`.
## Notice ## Notice
@@ -119,7 +121,7 @@ I wrote this plugin in about 6-7 hours, so things could be a bit stupid. But at
(The MIT License) (The MIT License)
Copyright (c) 2009 Jim Myhrberg. Copyright (c) 2011 Jim Myhrberg.
Permission is hereby granted, free of charge, to any person obtaining Permission is hereby granted, free of charge, to any person obtaining
a copy of this software and associated documentation files (the a copy of this software and associated documentation files (the
@@ -142,5 +144,5 @@ SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
[jquery]: http://jquery.com/ [jquery]: http://jquery.com/
[demo]: http://files.jimeh.me/projects/suggest_results/demo/ [demo]: http://files.jimeh.me/projects/fancy_input/demo/