Advanced Search

Posted By

ebukva on 11/16/06

Tagged

Versions (?)

Last Edited at 11/16/06 02:41pm

Statistics

Viewed 592 times
Favorited by 0 user(s)

upgradeSearchOnWebkitBrowsers

/ Published in: JavaScript
Save to your folder(s)

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. /*
  2. upgradeSearchOnWebkitBrowsers function makes the search
  3. input boxes in an HTML form appear and behave like 
  4. search fields in Mac OS X applications.
  5. The function first looks if the page contains any forms
  6. then looks for an input field that has the name="search"
  7. attribute. When such input is found, it injects three 
  8. new attributes that make Webkit browsers (such as Safari
  9. and OmniWeb) show the goodie.
  10. JavaScript is used to do this since these particular attributes
  11. are not standard HTML and will break the validation.
  12. All non-Webkit browsers should ignore the attributes
  13. and display the regular input box.
  14.  
  15. Dependencies:
  16.  - addLoadEvent (http://snipplr.com/view/1679/addloadevent/)
  17. */
  18.  
  19. function upgradeSearchOnWebkitBrowsers() {
  20. 	if (!document.getElementById) return false;         // if the browser doesn't support this dom method, drop out
  21. 	var forms = document.getElementsByTagName("form");
  22. 	if (forms[0] == null) return false;                 // if there are no forms on this page, drop out
  23.  
  24. 	var form = forms[0];
  25. 	for (var j=0; j < forms.length; j++) {              // if there are multiple forms loop through them
  26. 		form = forms[j];
  27. 		inputs = form.getElementsByTagName("input");
  28. 		for (var i=0; i < inputs.length; i++) {          // loop through all inputs until we find the one named "search"
  29. 			var inputName = inputs[i].getAttribute("name");
  30. 			if (inputName == "search") {
  31. 				inputs[i].setAttribute("type","search");
  32. 				inputs[i].setAttribute("autosave","autoSaveSearches");
  33. 				inputs[i].setAttribute("results","5");
  34. 				return false;
  35. 			}
  36. 		}
  37. 	}
  38. }
  39.  
  40. addLoadEvent(upgradeSearchOnWebkitBrowsers);

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.