javascript - Creating a Search Box -
what trying allow user artists based on artist's name in search box below (in html) , presenting user artist's name , link different html page if user's search matches artist in array.
the trouble is, when click "search" page goes original page. not sure disconnect is. not sure if calling id correctly; if id in right place; if action correct on in u.addevent function; or if search function written correctly.
any ideas?
rd
<body> <div class="imgs"> <a target="_blank" href=""><img src="img/04.png" alt="img" /></a></div> </div> <div class="form"> <form method="post" action="handler.php"> <input name="textfield" id="searchbox" type="text" class="colortext"/> </form> </div> </div> <script> var fakedatabase = []; var foxyshazam = { id: 'foxyshazam_fs', title: 'foxy shazam', artist: 'foxy shazam', price: '$14.99', releasedate: new date(1968, 10, 22), quantity: 50, link: "albums/foxyshazam.html",] }; var foxyshazam2 = { id: 'foxyshazam_fs_2', title: 'foxy shazam 2', artist: 'foxy shazam 2', price: '$14.99', releasedate: new date(1968, 10, 22), quantity: 50, link: "albums/foxyshazam.html"] }; var thriller = { id: 'thriller_mj', title: 'thriller', artist: 'michael jackson', price: '$12.99', releasedate: new date(1982, 10, 30), quantity: 35, link: "albums/thriller.html" }; var thriller2 = { id: 'thriller_mj_2', title: 'thriller 2', artist: 'michael jackson 2', price: '$12.99', releasedate: new date(1982, 10, 30), quantity: 35, link: "albums/thriller.html"] }; fakedatabase.push(foxyshazam, foxyshazam2, thriller, thriller2); //function displayalbum() { // 'use strict'; // (var i=0; < fakedatabase.length; i++) { // alert(fakedatabase[i].title);} //}; //displayalbum(fakedatabase); var u = { $: function (id) { 'use strict'; if (typeof id === 'string') { return document.getelementbyid(id); } }, settext: function(id, message) { 'use strict'; if ( (typeof id == 'string') && (typeof message == 'string') ) { // reference element: var output = this.$(id); if (!output) return false; // set text if (output.textcontent !== undefined) { output.textcontent = message; } else { output.innertext = message; } return true; } // end of main if. }, addevent: function(obj, type, fn){ 'use strict'; if (obj && obj.addeventlistener) { obj.addeventlistener(type, fn, false); } else if (obj && obj.attachevent) { obj.attachevent('on' + type, fn); } }, removeevent: function(obj, type, fn) { 'use strict'; if (obj && obj.removeeventlistner) { obj.removeeventlistner(type, fn, false); } else if (obj && obj.removeevent) { obj.removeevent('on' + type, fn); } } }; function search() { 'use strict'; var newsearch = u.$('searchbox'); if (typeof newsearch == 'string') { if (!newsearch) {return false;}; if (newsearch.textcontent !== undefined) { (var i=0; < fakedatabase.length; i++) { if (i == newsearch) { var options = document.getelementbyid('options'); (options.innertext = ((fakedatabase[i].artist + '\n') + (fakedatabase[i].link)); return true; } } } } }; u.addevent(u.$('searchbox'), 'click', search()); </script> </body>
search returns nothing. event handler needs function. either u.addevent(u.$('searchbox'), 'click', search); or make search() return event handler.
basically right invoking search handler , form nothing.
you have click handler on input field. pretty useless, since don't want happen when user clicks input field.
Comments
Post a Comment