Create Google search WebPart using ECMAScript for sharePoint 2010

No.of Views2936
Bookmarked0 times
Downloads 
Votes1
By  André Lage   On  05 Nov 2010 11:11:22
Tag : SharePoint , Enterprise Content Management
SharePoint 2010 have lot of news service but there is one i really like the "Client Object Model" used to make Call to SharePoint Content and in particular the ECMAScript supported by SP.JS file
emailbookmarkadd commentsprint

Images in this article missing? We recently lost them in a site migration. We're working to restore these as you read this. Should you need an image in an emergency, please contact us at info@codegain.com

 

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. 

Image Loading

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 
Image Loading
Image Loading

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. 

Image Loading

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.

 
Sign Up to vote for this article
 
About Author
 
André Lage
Occupation-Not Provided
Company-Not Provided
Member Type-Senior
Location-Portugal
Joined date-09 Jun 2010
Home Page-Not Provided
Blog Page-Not Provided
 
 
Other popularSectionarticles
    In this article, I'm going to explain how to create List of Definition in SharePoint 2010.The List Definition is brand new features in SharePoint 2010.
    Published Date : 22/Sep/2011
    Now its a time user need Rich User Interface with high level of interactivity that is easily possible with xhtml technologies
    Published Date : 21/Jun/2010
    Difference between MOSS and WSS
    Published Date : 16/Feb/2010
    In this article, I am going to give and walkthrough of how to define a custom Content type in MOSS or SharePoint.
    Published Date : 16/Feb/2010
    Recently I have involved in branding one of our clients sharepoint portal. As part of the branding process we needed to modify the application.master file, so even the layout pages will have the same look and feel. As part of the investigation, we come up with the best approach for doing this.
    Published Date : 05/Sep/2010
Comments
There is no comments for this articles.
Leave a Reply
Title:
Display Name:
Email:
(not display in page for the security purphase)
Website:
Message:
Please refresh your screen using Ctrl+F5
If you can't read this number refresh your screen
Please input the anti-spam code that you can read in the image.
^ Scroll to Top