Today marks the beginning of the 16 Days of Activism against Gender Based Violence. Join the Take Back the Tech! team in spreading awareness regarding this issue & discussing how we can eradicate this menace from our society and the world.
From November 25 to December 10 Take Back The Tech! calls on women and men to take control of technology to protect the right to freedom of expression and information. Since it began in 2006, campaigners in more than 30 countries have used the internet, mobile phones, radio and more to document and fight violence against women.
Our friends at SMSAll have created the two premium groups for us (not case sensitive):
TBTT
TBTT-Discuss
The first group is a broadcast group and the second one is a discussion group. On the broadcast group, the TBTT Pakistan camp will send messages regarding the campaign to all those who opt-in and join our group (notifications etc) and on the second group, all members can send messages to the whole group (many-to-many conversation). So no spamming. If you are interested in this issue (and you should be), join hands with us now.
Here are some more details:
To join any group, just send the following:
join tbtt
or
join tbtt-discuss
to the following numbers:
Service numbers:
5566
03124117660-8 (For Mobilink users only)
To send a message on the groups, users have to include the group name with a “dot” -> “.” at the start of the message. For example, to send a message on the group TBTT, use the following syntax:
That was supposed to be the end of the story, but now Google Wave has resurfaced in a new proposal to the Apache Software Foundation. Best known for the Apache server, the ASF is host to over 100 open source projects. Several people from Google, Novell, SAP and even the U.S. Navy hope to add “Apache Wave” to that list.
The proposal’s three goals are to migrate Wave’s codebase from Google to the ASF’s infrastructure, to get Wave back to a state where development can be continued and to add new committers to the project. While the proposal notes that there is a risk to adopting Wave as an ASF project (it notes that Wave didn’t gain sufficient traction at Google), it also claims that its use by the U.S. Navy and other adopters makes it a worth project.
Apache Wave is still a proposal though; the ASF still has to accept the project. With a well-developed codebase and some big committers, we expect that this project will see the light of day. If it does, Wave will have been given a second life.
UPDATE: Version 1.4 Released (Mar. 23, 2010). Get the latest! Details below.
So I needed to add some auto-completing functionality to my project Build It With Me. I figured it would be easy to find a ready-made jQuery plugin to do the work for me. I was wrong. Naturally I took it upon myself to solve this problem for all of you :) I created this plugin to be as general purpose as possible. As a result it ended up being vastly more customizable than any other jQuery auto-complete plugin. Not only that, I am using actual jQuery. For some reason all the other "jQuery" plugins don't really take advantage of the radness that is jQuery. Consequently, my plugin ended up being dramatically smaller in size (way less code). Just 7kb 8.8kb minified and only 6kb packed. Have fun with it! AutoSuggest is a very lightweight jQuery plugin that makes auto-completing extremely easy.
Example
Type the letter 'm' into the box below:
Feature Overview Videos
Feature Update for Version 1.3
Initial Feature Overview for Version 1.0
How It Works
AutoSuggest will turn any regular text input box into a rad auto-complete box. It will dynamically create all the HTML elements that it needs to function. You don't need to add any extra HTML to work with AutoSuggest. Also, AutoSuggest uses ZERO images! All styling is done 100% in the included CSS file. This means it is super easy to customize the look of everything! You only need to edit the included CSS file. You can even use images if you want, just add the appropriate lines of code into the CSS file.
As you type into the AutoSuggestinput box, it will filter through it's Data and "suggest" matched Data items to you. You can pass in an Object of Data to AutoSuggest or you can have it call a URL as you type to get it's Data from. AutoSuggest will display the matched Data items in a selectable list, which is 100% customizable. You have the option of structuring the HTML elements of that list however you want via the formatList callback function. You case an example of this in the second example above.
When you type into the input box and the "suggestion" dropdown list appears, a few things happen:
A class of "loading" is applied to the main AutoSuggestul while the data is loaded. That class is then removed when all processing has finished and before the suggestion results list is made visible.
As you hover over each suggested option in the list a class of "selected" is added to that item, and then removed when you mouseout.
When you make a selection the item is added to the input box. Also there is a hidden input field generated for each AutoSuggest box that stores the values (comma separated) of each item you have selected. This input box will have a unique ID as well as a class name of "as-values".
The plugin expects the Data passed into it (or gathered from the URL) to be formatted in JSON. JSON is an extremely easy format to work with, and if you don't already... you should :) To learn more about JSON, check out my post/video, An Introduction to JSON.
When an AJAX request is made the search string is sent over in a param named "q" by default. However you can change that name with the queryParam option. Here is a default example AJAX request: http://www.mysite.com/your/script/?q=mick "mick" would be the search query that was typed into the input box. Be sure to setup your server-side code to grab that param and send back some results.
As of AutoSuggest version 1.4 you can now create selections by using the tab or comma keys. To do this simply type something into the box and hit the tab or comma keys. The selection is added to AutoSuggest in the exact same manner as if it were chosen from the Results dropdown.
AutoSuggest has been tested (and works) in: IE7 & IE8, Firefox, Safari, Opera, and Chrome.
How To Use It
Obviously you need to make sure you have the latest jQuery library (at least 1.3) already loaded in your page. After that it's really simple, just add the following code to your page (make sure to wrap your code in jQuery's ready function):
1.$(function(){
2.$("input[type=text]").autoSuggest(data);
3.});
The above line of code will apply AutoSuggest to all text type input elements on the page. Each one will be using the same set of Data. If you want to have multiple AutoSuggest fields on your page that use different sets of Data, make sure you select them separately. Like this:
1.$(function(){
2.$("div.someClass input").autoSuggest(data);
3.$("#someID input").autoSuggest(other_data);
4.});
Doing the above will allow you to pass in different options and different Data sets.
Below is an example of using AutoSuggest with a Data Object and other various options:
Please not that you MUST have an object property of "value" for each data item. (This is now configureable with the selectedValuesProp option). The "value" property will be stored (comma separated) in the hidden input field when chosen from the "suggestion" dropdown list. You can see an example of the "value" property being set for each data item in the example above. Typically the "value" property would contain the ID of the item, so you can send a list of "chosen" IDs to your server.
Below is an example of how to process the data sent via AJAX to your server in PHP:
01.<?
02.$input= $_GET["q"];
03.$data= array();
04.// query your DataBase here looking for a match to $input
05.$query= mysql_query("SELECT * FROM my_table WHERE my_field LIKE '%$input%'");
06.while($row= mysql_fetch_assoc($query)) {
07.$json= array();
08.$json['value'] = $row['id'];
09.$json['name'] = $row['username'];
10.$json['image'] = $row['user_photo'];
11.$data[] = $json;
12.}
13.header("Content-type: application/json");
14.echojson_encode($data);
15.?>
Options
asHtmlID: string (false by default) - Enables you to specify your own custom ID that will be appended to the top level AutoSuggest UL element's ID name. Otherwise it will default to using a random ID. Example: id="CUSTOM_ID". This is also applies to the hidden input filed that holds all of the selected values. Example: id="as-values-CUSTOM_ID"
startText: string ("Enter Name Here" by default) - Text to display when the AutoSuggest input field is empty.
emptyText: string ("No Results" by default) - Text to display when their are no search results.
preFill: object or string (empty object by default) - Enables you to pre-fill the AutoSuggest box with selections when the page is first loaded. You can pass in a comma separated list of values (a string), or an object. When using a string, each value is used as both the display text on the selected item and for it's value. When using an object, the options selectedItemProp will define the object property to use for the display text and selectedValuesProp will define the object property to use for the value for the selected item. Note: you must setup your preFill object in that format. A preFill object can look just like the example objects laid out above.
limitText: string ("No More Selections Are Allowed" by default) - Text to display when the number of selections has reached it's limit.
selectedItemProp: string ("value" by default) - Name of object property to use as the display text for each chosen item.
selectedValuesProp: string ("value" by default) - Name of object property to use as the value for each chosen item. This value will be stored into the hidden input field.
searchObjProps: string ("value" by default) - Comma separated list of object property names. The values in these objects properties will be used as the text to perform the search on.
queryParam: string ("q" by default) - The name of the param that will hold the search string value in the AJAX request.
retrieveLimit: number (false by default) - If set to a number, it will add a '&limit=' param to the AJAX request. It also limits the number of search results allowed to be displayed in the results dropdown box.
extraParams: string ("" by default) - This will be added onto the end of the AJAX request URL. Make sure you add an '&' before each param.
matchCase: true or false (false by default) - Make the search case sensitive when set to true.
minChars: number (1 by default) - Minimum number of characters that must be entered into the AutoSuggest input field before the search begins.
keyDelay: number (400 by default) - Number of milliseconds to delay after a keydown on the AutoSuggest input field and before search is started.
resultsHighlight: true or false (true by default) - Option to choose whether or not to highlight the matched text in each result item.
neverSubmit: true or false (false by default) - If set to true this option will never allow the 'return' key to submit the form that AutoSuggest is a part of.
selectionLimit: number (false by default) - Limits the number of selections that are allowed to be made to the number specified.
showResultList: true or false (true by default) - If set to false, the Results Dropdown List will never be shown at any time.
start: callback function - Custom function that is run only once on each AutoSuggest field when the code is first applied.
selectionClick: callback function - Custom function that is run when a previously chosen item is clicked. The item that is clicked is passed into this callback function as 'elem'. Example: selectionClick: function(elem){ elem.fadeTo("slow", 0.33); }
selectionAdded: callback function - Custom function that is run when a selection is made by choosing one from the Results dropdown, or by using the tab/comma keys to add one. The selection item is passed into this callback function as 'elem'. Example: selectionAdded: function(elem){ elem.fadeTo("slow", 0.33); }
selectionRemoved: callback function - Custom function that is run when a selection removed from the AutoSuggest by using the delete key or by clicking the "x" inside the selection. The selection item is passed into this callback function as 'elem'. Example: selectionRemoved: function(elem){ elem.fadeTo("fast", 0, function(){ elem.remove(); }); }
formatList: callback function - Custom function that is run after all the data has been retrieved and before the results are put into the suggestion results list. This is here so you can modify what & how things show up in the suggestion results list.
beforeRetrieve: callback function - Custom function that is run right before the AJAX request is made, or before the local objected is searched. This is used to modify the search string before it is processed. So if a user entered "jim" into the AutoSuggest box, you can call this function to prepend their query with "guy_". Making the final query = "guy_jim". The search query is passed into this function. Example: beforeRetrieve: function(string){ return string; }
retrieveComplete: callback function - Custom function that is run after the ajax request has completed. The data object MUST be returned if this is used. Example: retrieveComplete: function(data){ return data; }
resultClick: callback function - Custom function that is run when a search result item is clicked. The data from the item that is clicked is passed into this callback function as 'data'. Example: resultClick: function(data){ console.log(data); }
resultsComplete: callback function - Custom function that is run when the suggestion results dropdown list is made visible. Will run after every search query.
The formatList option will hand you 2 objects:
data: This is the data you originally passed into AutoSuggest (or retrieved via an AJAX request)
elem: This is the HTML element you will be formatting (the 'result' li item).
In order to add extra things to the 'result' item (like an image) you will need to make sure you pass that data into AutoSuggest. Below is an example of formatList in action:
1.formatList: function(data, elem){
2.varmy_image = data.image;
3.varnew_elem = elem.html("add/change stuff here, put image here, etc.");
4.returnnew_elem;
5.}
You MUST return the HTML object. formatList will run on each 'result' item.
ChangeLog
Version 1.4 (Mar. 23, 2010) Changes:
When using asHtmlID, the "as-input-" is no longer prepended to the beginning of the ID name. It is now just whatever you set for asHtmlID. This adds easy Rails compatibility.
New Features:
Added the ability to generate new selections by hitting tab or comma after entering some text into the main input field. This was a hugely requested feature, and will make AutoSuggest even more useful.
Added showResultList which gives you the option to never show a results list at any time.
Added in beforeRetrieve callback function (see 'Options' section above for description).
Added in selectionAdded callback function (see 'Options' section above for description).
Added in selectionRemoved callback function (see 'Options' section above for description).
Version 1.3 (Feb. 07, 2010) - (watch update video above for more details) Changes:
Added a new feature overview video!
The hidden input field that holds all the values (class name of 'as-values') now has it's own ID, defined by the asHtmlID option. Example: id="as-values-CUSTOM_ID". If the asHtmlID is not set, it will revert to a random number ID identifier ("as-values-RANDOM").
Changed the option selectedItem to selectedItemProp to make better sense.
Changed the option searchObj to searchObjProps to make better sense.
Changed "Lucdia Grande" to "Lucida Grande" in CSS (bug fix).
Fixed bug that would prevent you from adding certain selections at seemingly random times.
New Features:
Added preFill option that allows you to pre-fill the AutoSuggest box with selections when the page is loaded.
Added asHtmlID option that allows you to specify your own custom ID that will be appended to the top level AutoSuggest UL element's ID name. Otherwise it will default to using a random ID.
Added emptyText option to customize "No Results" text.
Added resultsHighlight option to choose whether or not to highlight the matched text in the result items.
Added neverSubmit option. This will never allow the 'return' key to submit the form that AutoSuggest is a part of.
Added resultClick callback function. This will run a custom function when a result item has been clicked. It also hands you the data associated with that result item.
Added selectionLimit option so you can limit the number of selections that are allowed to be made.
Added limitText option to customize "No More Selections Are Allowed" text.
retrieveLimit now works with local objects and will limit the results to the number specified.
Added selectedValuesProp option to specify the property you want to use to store the values into the hidden input field.
Added in dynamic width for the results UL (description in video above).
Added packed version of the JS (only 6kb!)
Version 1.2 (Jan. 05, 2010)
Fixed bug that didn't properly use the selectedItem option as the text for the results list (thanks @Niki for finding it).
searchObj now has it's white-space removed so it will no longer error if you do: searchObj: "value, prop, cool".
Also, added in selectionClick callback function (see 'Options' section above for description).
Version 1.1 (Jan. 02, 2010)
Fixed CSS and visuals for Firefox 3.0.
Added in the following options: queryParam, extraParams
UPDATE: Version 1.4 Released (Mar. 23, 2010). Get the latest! Details below.
So I needed to add some auto-completing functionality to my project Build It With Me. I figured it would be easy to find a ready-made jQuery plugin to do the work for me. I was wrong. Naturally I took it upon myself to solve this problem for all of you :) I created this plugin to be as general purpose as possible. As a result it ended up being vastly more customizable than any other jQuery auto-complete plugin. Not only that, I am using actual jQuery. For some reason all the other "jQuery" plugins don't really take advantage of the radness that is jQuery. Consequently, my plugin ended up being dramatically smaller in size (way less code). Just 7kb 8.8kb minified and only 6kb packed. Have fun with it! AutoSuggest is a very lightweight jQuery plugin that makes auto-completing extremely easy.
Example
Type the letter 'm' into the box below:
Feature Overview Videos
Feature Update for Version 1.3
Initial Feature Overview for Version 1.0
How It Works
AutoSuggest will turn any regular text input box into a rad auto-complete box. It will dynamically create all the HTML elements that it needs to function. You don't need to add any extra HTML to work with AutoSuggest. Also, AutoSuggest uses ZERO images! All styling is done 100% in the included CSS file. This means it is super easy to customize the look of everything! You only need to edit the included CSS file. You can even use images if you want, just add the appropriate lines of code into the CSS file.
As you type into the AutoSuggestinput box, it will filter through it's Data and "suggest" matched Data items to you. You can pass in an Object of Data to AutoSuggest or you can have it call a URL as you type to get it's Data from. AutoSuggest will display the matched Data items in a selectable list, which is 100% customizable. You have the option of structuring the HTML elements of that list however you want via the formatList callback function. You case an example of this in the second example above.
When you type into the input box and the "suggestion" dropdown list appears, a few things happen:
A class of "loading" is applied to the main AutoSuggestul while the data is loaded. That class is then removed when all processing has finished and before the suggestion results list is made visible.
As you hover over each suggested option in the list a class of "selected" is added to that item, and then removed when you mouseout.
When you make a selection the item is added to the input box. Also there is a hidden input field generated for each AutoSuggest box that stores the values (comma separated) of each item you have selected. This input box will have a unique ID as well as a class name of "as-values".
The plugin expects the Data passed into it (or gathered from the URL) to be formatted in JSON. JSON is an extremely easy format to work with, and if you don't already... you should :) To learn more about JSON, check out my post/video, An Introduction to JSON.
When an AJAX request is made the search string is sent over in a param named "q" by default. However you can change that name with the queryParam option. Here is a default example AJAX request: http://www.mysite.com/your/script/?q=mick "mick" would be the search query that was typed into the input box. Be sure to setup your server-side code to grab that param and send back some results.
As of AutoSuggest version 1.4 you can now create selections by using the tab or comma keys. To do this simply type something into the box and hit the tab or comma keys. The selection is added to AutoSuggest in the exact same manner as if it were chosen from the Results dropdown.
AutoSuggest has been tested (and works) in: IE7 & IE8, Firefox, Safari, Opera, and Chrome.
How To Use It
Obviously you need to make sure you have the latest jQuery library (at least 1.3) already loaded in your page. After that it's really simple, just add the following code to your page (make sure to wrap your code in jQuery's ready function):
1.$(function(){
2.$("input[type=text]").autoSuggest(data);
3.});
The above line of code will apply AutoSuggest to all text type input elements on the page. Each one will be using the same set of Data. If you want to have multiple AutoSuggest fields on your page that use different sets of Data, make sure you select them separately. Like this:
1.$(function(){
2.$("div.someClass input").autoSuggest(data);
3.$("#someID input").autoSuggest(other_data);
4.});
Doing the above will allow you to pass in different options and different Data sets.
Below is an example of using AutoSuggest with a Data Object and other various options:
Please not that you MUST have an object property of "value" for each data item. (This is now configureable with the selectedValuesProp option). The "value" property will be stored (comma separated) in the hidden input field when chosen from the "suggestion" dropdown list. You can see an example of the "value" property being set for each data item in the example above. Typically the "value" property would contain the ID of the item, so you can send a list of "chosen" IDs to your server.
Below is an example of how to process the data sent via AJAX to your server in PHP:
01.<?
02.$input= $_GET["q"];
03.$data= array();
04.// query your DataBase here looking for a match to $input
05.$query= mysql_query("SELECT * FROM my_table WHERE my_field LIKE '%$input%'");
06.while($row= mysql_fetch_assoc($query)) {
07.$json= array();
08.$json['value'] = $row['id'];
09.$json['name'] = $row['username'];
10.$json['image'] = $row['user_photo'];
11.$data[] = $json;
12.}
13.header("Content-type: application/json");
14.echojson_encode($data);
15.?>
Options
asHtmlID: string (false by default) - Enables you to specify your own custom ID that will be appended to the top level AutoSuggest UL element's ID name. Otherwise it will default to using a random ID. Example: id="CUSTOM_ID". This is also applies to the hidden input filed that holds all of the selected values. Example: id="as-values-CUSTOM_ID"
startText: string ("Enter Name Here" by default) - Text to display when the AutoSuggest input field is empty.
emptyText: string ("No Results" by default) - Text to display when their are no search results.
preFill: object or string (empty object by default) - Enables you to pre-fill the AutoSuggest box with selections when the page is first loaded. You can pass in a comma separated list of values (a string), or an object. When using a string, each value is used as both the display text on the selected item and for it's value. When using an object, the options selectedItemProp will define the object property to use for the display text and selectedValuesProp will define the object property to use for the value for the selected item. Note: you must setup your preFill object in that format. A preFill object can look just like the example objects laid out above.
limitText: string ("No More Selections Are Allowed" by default) - Text to display when the number of selections has reached it's limit.
selectedItemProp: string ("value" by default) - Name of object property to use as the display text for each chosen item.
selectedValuesProp: string ("value" by default) - Name of object property to use as the value for each chosen item. This value will be stored into the hidden input field.
searchObjProps: string ("value" by default) - Comma separated list of object property names. The values in these objects properties will be used as the text to perform the search on.
queryParam: string ("q" by default) - The name of the param that will hold the search string value in the AJAX request.
retrieveLimit: number (false by default) - If set to a number, it will add a '&limit=' param to the AJAX request. It also limits the number of search results allowed to be displayed in the results dropdown box.
extraParams: string ("" by default) - This will be added onto the end of the AJAX request URL. Make sure you add an '&' before each param.
matchCase: true or false (false by default) - Make the search case sensitive when set to true.
minChars: number (1 by default) - Minimum number of characters that must be entered into the AutoSuggest input field before the search begins.
keyDelay: number (400 by default) - Number of milliseconds to delay after a keydown on the AutoSuggest input field and before search is started.
resultsHighlight: true or false (true by default) - Option to choose whether or not to highlight the matched text in each result item.
neverSubmit: true or false (false by default) - If set to true this option will never allow the 'return' key to submit the form that AutoSuggest is a part of.
selectionLimit: number (false by default) - Limits the number of selections that are allowed to be made to the number specified.
showResultList: true or false (true by default) - If set to false, the Results Dropdown List will never be shown at any time.
start: callback function - Custom function that is run only once on each AutoSuggest field when the code is first applied.
selectionClick: callback function - Custom function that is run when a previously chosen item is clicked. The item that is clicked is passed into this callback function as 'elem'. Example: selectionClick: function(elem){ elem.fadeTo("slow", 0.33); }
selectionAdded: callback function - Custom function that is run when a selection is made by choosing one from the Results dropdown, or by using the tab/comma keys to add one. The selection item is passed into this callback function as 'elem'. Example: selectionAdded: function(elem){ elem.fadeTo("slow", 0.33); }
selectionRemoved: callback function - Custom function that is run when a selection removed from the AutoSuggest by using the delete key or by clicking the "x" inside the selection. The selection item is passed into this callback function as 'elem'. Example: selectionRemoved: function(elem){ elem.fadeTo("fast", 0, function(){ elem.remove(); }); }
formatList: callback function - Custom function that is run after all the data has been retrieved and before the results are put into the suggestion results list. This is here so you can modify what & how things show up in the suggestion results list.
beforeRetrieve: callback function - Custom function that is run right before the AJAX request is made, or before the local objected is searched. This is used to modify the search string before it is processed. So if a user entered "jim" into the AutoSuggest box, you can call this function to prepend their query with "guy_". Making the final query = "guy_jim". The search query is passed into this function. Example: beforeRetrieve: function(string){ return string; }
retrieveComplete: callback function - Custom function that is run after the ajax request has completed. The data object MUST be returned if this is used. Example: retrieveComplete: function(data){ return data; }
resultClick: callback function - Custom function that is run when a search result item is clicked. The data from the item that is clicked is passed into this callback function as 'data'. Example: resultClick: function(data){ console.log(data); }
resultsComplete: callback function - Custom function that is run when the suggestion results dropdown list is made visible. Will run after every search query.
The formatList option will hand you 2 objects:
data: This is the data you originally passed into AutoSuggest (or retrieved via an AJAX request)
elem: This is the HTML element you will be formatting (the 'result' li item).
In order to add extra things to the 'result' item (like an image) you will need to make sure you pass that data into AutoSuggest. Below is an example of formatList in action:
1.formatList: function(data, elem){
2.varmy_image = data.image;
3.varnew_elem = elem.html("add/change stuff here, put image here, etc.");
4.returnnew_elem;
5.}
You MUST return the HTML object. formatList will run on each 'result' item.
ChangeLog
Version 1.4 (Mar. 23, 2010) Changes:
When using asHtmlID, the "as-input-" is no longer prepended to the beginning of the ID name. It is now just whatever you set for asHtmlID. This adds easy Rails compatibility.
New Features:
Added the ability to generate new selections by hitting tab or comma after entering some text into the main input field. This was a hugely requested feature, and will make AutoSuggest even more useful.
Added showResultList which gives you the option to never show a results list at any time.
Added in beforeRetrieve callback function (see 'Options' section above for description).
Added in selectionAdded callback function (see 'Options' section above for description).
Added in selectionRemoved callback function (see 'Options' section above for description).
Version 1.3 (Feb. 07, 2010) - (watch update video above for more details) Changes:
Added a new feature overview video!
The hidden input field that holds all the values (class name of 'as-values') now has it's own ID, defined by the asHtmlID option. Example: id="as-values-CUSTOM_ID". If the asHtmlID is not set, it will revert to a random number ID identifier ("as-values-RANDOM").
Changed the option selectedItem to selectedItemProp to make better sense.
Changed the option searchObj to searchObjProps to make better sense.
Changed "Lucdia Grande" to "Lucida Grande" in CSS (bug fix).
Fixed bug that would prevent you from adding certain selections at seemingly random times.
New Features:
Added preFill option that allows you to pre-fill the AutoSuggest box with selections when the page is loaded.
Added asHtmlID option that allows you to specify your own custom ID that will be appended to the top level AutoSuggest UL element's ID name. Otherwise it will default to using a random ID.
Added emptyText option to customize "No Results" text.
Added resultsHighlight option to choose whether or not to highlight the matched text in the result items.
Added neverSubmit option. This will never allow the 'return' key to submit the form that AutoSuggest is a part of.
Added resultClick callback function. This will run a custom function when a result item has been clicked. It also hands you the data associated with that result item.
Added selectionLimit option so you can limit the number of selections that are allowed to be made.
Added limitText option to customize "No More Selections Are Allowed" text.
retrieveLimit now works with local objects and will limit the results to the number specified.
Added selectedValuesProp option to specify the property you want to use to store the values into the hidden input field.
Added in dynamic width for the results UL (description in video above).
Added packed version of the JS (only 6kb!)
Version 1.2 (Jan. 05, 2010)
Fixed bug that didn't properly use the selectedItem option as the text for the results list (thanks @Niki for finding it).
searchObj now has it's white-space removed so it will no longer error if you do: searchObj: "value, prop, cool".
Also, added in selectionClick callback function (see 'Options' section above for description).
Version 1.1 (Jan. 02, 2010)
Fixed CSS and visuals for Firefox 3.0.
Added in the following options: queryParam, extraParams
Back in February we wrote about Facebook’s secret Project Titan — a web-based email client that we hear is unofficially referred to internally as its “Gmail killer”. Now we’ve heard from sources that this is indeed what’s coming on Monday during Facebook’s special event, alongside personal @facebook.com email addresses for users.
This isn’t a big surprise — the event invites Facebook sent out hinted strongly that the news would have something to do with its Inbox, sparking plenty of speculation that the event could be related to Titan. Our understanding is that this is more than just a UI refresh for Facebook’s existing messaging service with POP access tacked on. Rather, Facebook is building a full-fledged webmail client, and while it may only be in early stages come its launch Monday, there’s a huge amount of potential here.
Facebook has the world’s most popular photos product, the most popular events product, and soon will have a very popular local deals product as well. It can tweak the design of its webmail client to display content from each of these in a seamless fashion (and don’t forget messages from games, or payments via Facebook Credits). And there’s also the social element: Facebook knows who your friends are and how closely you’re connected to them; it can probably do a pretty good job figuring out which personal emails you want to read most and prioritize them accordingly.
Oh, and assuming our sources prove accurate, this explains the timing of the Google/Facebook slap fight over contact information.
We’ll keep digging for more details and will have full coverage on Monday.
I'm trying to sign-up for a Google Libraries API Key, since 3 days but when I click
on "Sign-up for an API key" it saying "The requested URL /
ajaxsearch/signup.html was not found on this server."