Hi, I posted the thread below in the wrong forum... im hoping to get a solution here.. hopefully..
Thanks Original Post: ================================================================================ Hi I'm having problems appending my results to a paragraph without refreshing ... I've done a simple ajax test on my own form but calling google.ca to do a search . I want to output the result within a DIV on the current page without refreshing the page. For some reason, it is displaying the whole result in a new page instead. Can anyone tell me what I am doing wrong here? Thanks Follow Up: ================================================================================= It looks like there was an error in the js, and that the posted result is due to the HTML POST, rather than the ajax POST. Further digging, I found the error in the error console of firefox... Error: [Exception... "Access to restricted URI denied" code: "1012" nsresult: "0x805303f4 (NS_ERROR_DOM_BAD_URI)" location: "file:///C:/ Inetpub/wwwroot/links/jquery.js Line: 3395"] Source File: file:///C:/Inetpub/wwwroot/links/jquery.js Line: 3395 ps Ive just installed firebug and opened the console, and htought that the js errors should be displayed in the console, so when i didnt see anything i assumed the script were fine... but i still have to open the error console CTRL SHIFT - J ( BT W is this how you guys do it to make sure everything is kosher when using in combination to firebug?) ================================================================================= <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:// www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml";> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <script language="JavaScript" type="text/ javascript" src="../links/ jquery.js"></script> <link rel="stylesheet" type="text/css" href="mycss.css"> <script language="javascript"> $(document).ready(function(){ $('#submit').click(function(){ $('#container').append('<img src="loading-balls.gif" alt="loading ..." id="loadingImg"/>'); var q = $('#q').val(); $.ajax({ url: 'http://www.google.ca/search', type: GET', data: 'q=' + q, success: function(result) { //console.log(result); $('#response').remove(); $('#container').append('<p id="response">' + result + '</p>'); $('#loadingImg').fadeOut(500); } }); return false; }); }); </script> </head> <body> <form id="form1" name="form1" method="GET" action="http:// www.google.ca/search"> <p>Search Criteria <input name="q" type="text" id="q" /> </p> <p>Submit <input type="submit" name="Submit" value="Submit" id="submit" /> </p> <div id="container"></div> </form> </body> </html>
