Create Google search WebPart using ECMAScript for sharePoint 2010

Introduction

SharePoint 2010 have lot of news service but there is one i realy like the “Client Object Model” used to make Call to SharePoint Content  and in particular the ECMAScript supported by SP.JS file.
This Client Object Model is very useful when you want to make use SharePoint content without using Visual Studio.
The best of all this Microsoft use almost the same name definition for the class, if you normally work with SharePoint Server SDK API you will see the development don't change to much. 

Ok Let Start creating our Google search Web Part with Modal Dialog.

1. Edit the Page on your sharepoint 2010 Page and add new Web Part option “HTML Form Web Part”
2. Edit Source Editor and add the following code 

Here is the Code:

<script type="text/javascript"> 
function opendialog() 
{ 
var options=SP.UI.$create_DialogOptions(); 
options.url="http://www.google.com/search?h1=pt-PT&Source=hp&q=" + document.getElementById('PesquisaGoogle').value; 
options.width= 600; 
options.height= 500; 
options.dialogReturnValueCallback= Function.createDelegate(null, CloseCallback); 
SP.UI.ModalDialog.showModalDialog(options); 
}

function CloseCallback(result, target) 
{ 
if (result == SP.UI.DialogResult.OK) 
{ 
alert('Error on model dialog'); 
} 
} 
</script> 

 next steps input Google Search

<input type="text" id="PesquisaGoogle" name="firstname" /> 
<input type="button" value="Go" onclick="opendialog()" />

And here is the final Result, voila very easy. 

Modal Dialog is a very usefull tool for sharepoint for acessibility reasons, will help you turn SharePoint more easy to final users.

Hope you like this litle article.