/    Sign up×
Community /Pin to ProfileBookmark

Show XML with javascript

Copy linkTweet thisAlerts:
Jul 19.2011

Hi all,

I found a nice script which I want to use. It offers Google suggestions in XML format:

[CODE]<form action=”http://www.google.nl/complete/search? ” method=”get”><div>

<input type=”text” size=”20″ name=”q” />

<input type=”submit” value=”Submit” />

<input type=”hidden” name=”output” value=”toolbar” /></div>
</form>[/CODE]

The problem is that I want to display the XML data as plain HTML text on the same page when submitting (so in a div). I have Googled for this but There is nothing on the internet that can solve my problem. However I think it is possible to show the XML data using Javascript. But I think that I would have a hard time trying since the XML is not in the same root.

Any help is appreciated. If you don’t want to write the code please point me in the right way.

Thanks

to post a comment
JavaScript

8 Comments(s) ↴

Copy linkTweet thisAlerts:
@rnd_meJul 19.2011 — use the json(p) APIs, not the XML ones.

xml cannot cross domains, jsonp can...
Copy linkTweet thisAlerts:
@yomooreauthorJul 19.2011 — use the json(p) APIs, not the XML ones.

xml cannot cross domains, jsonp can...[/QUOTE]

I can't find a jsonp API for Google suggestions.. Do you mean I have to write it myself?
Copy linkTweet thisAlerts:
@rnd_meJul 19.2011 — I can't find a jsonp API for Google suggestions.. Do you mean I have to write it myself?[/QUOTE]

i guess so, surprising they don't offer it.

i think yql has something like that, and i know Wikipedia has a hijack-able suggestion api...
Copy linkTweet thisAlerts:
@yomooreauthorJul 19.2011 — Please take a look at www.begin.nl (a dutch starting page) They are using the google suggestions in XML format with this url: ''http://www.google.com/complete/search?hl=nl&q='' , I think with json.

I would really like to understand how they are doing it so I can alter the code in an original code that I can use. I don't want to copy/paste there code since they did all the hard work.
Copy linkTweet thisAlerts:
@rnd_meJul 19.2011 — good digging, that makes it easy:

[CODE]<body>
<input id='inp' /> <select id='sug' />

<script type='text/javascript'>

function el(tid) {return document.getElementById(tid);}

function addScript(u){
var head=document.getElementsByTagName('head')[0],
sc2=document.createElement('script'); sc2.src=u;

head.appendChild(sc2);
setTimeout(function(){ head.removeChild(sc2); sc2=null;}, 20000)
}//end addScript()


function suggest(data){
var sel=el("sug").options; sel.length=0;
data[1].map(function(a){return a[0];}).map(function(a,b){
sel[b]=new Option(a);
});
sel.size=data[1].length;
}//end suggeest()


el("inp").onkeypress=function(){
addScript("http://www.google.com/complete/search?hl=nl&callback=suggest&q="+this.value);
}

</script>
</body> [/CODE]

you can cut and paste my work above since i only spent 5 mins on it...
Copy linkTweet thisAlerts:
@yomooreauthorJul 19.2011 — Hi rnd me, Thank you very much but it is not perfect..Its giving me a different suggestion list than the original. I think it has something to do with the url but Im not sure. I will try to figure it out.

(Less important: It would be helpful to explain to me what you have done here, it looks like plain javascript to me but I could be mistaken. Why did you put the list as an option list, and why the timer?)
Copy linkTweet thisAlerts:
@rnd_meJul 20.2011 — Why did you put the list as an option list, and why the timer?)[/QUOTE]

it's just a demo, you should modify the html making part as you see fit; since there's no xml and i don't know how you want the data displayed, i choose a select since it's simple to populate with suggestions.

the timer removes the script tags from old suggestion dispatches, freeing up memory. otherwise, they can accumulate and if nothing else, they slow down firebug.
Copy linkTweet thisAlerts:
@yomooreauthorJul 20.2011 — Hi rnd me, I think I would prefer a simple div/ul/li because I can do more with it than the option list, I will look more in to this and try to figure it out. nevertheless this is more than I could have hoped for? Thanks for your time and effort. I have changed the url in to this: "http://www.google.nl/complete/search?callback=suggest&q=" So now there is no "junk(?)" in the suggestions and it is exactly like the original.
×

Success!

Help @yomoore spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...