How to Create a Search Web Part in SharePoint 2010 Using Visual Studio


Hello Everyone.

SharePoint 2010 has existed for a long time but there is still no end to the knowledge pertaining to it. So yes we will see how to create a Search Web Part in SharePoint 2010 using Visual Studio.

This is always a requirement in all our projects since users always want a certain search level with a single list rather than the entire site and it should filter respect to their fields. So for these requirements here is a Search Web part that can be easily modified depending on the user’s demand.

Let’s go for it.

Open your site and go to your list, like for me I have an Employee list with the following details as in the screenshot.

Employee list

  • Now Open Visual Studio.
  • Create a new project.
  • Select Visual Web Part from the 2010 templates.
  • Connect your site with the webpart.
  • Once you click Ok you will see your project created as in the image below:

    your project created

  • Click on VisualWebpart1UserControl.ascx.
  • Drag and drop the following label and text box as in the following screen:

    Drag and drop

  • Build it.
  • Now go to VisualWebPart1.cs.
  • In your solution add the following reference.
    1. Microsoft.SharePoint
    2. Microsoft.SharePoint.Client
  • Add the references as in the following to your cs page.
    1. using System;
    2. using System.Web.UI;
    3. using System.Web.UI.WebControls;
    4. using System.Web.UI.WebControls.WebParts;
    5. using System.Data;
    6. using Microsoft.SharePoint;
    7. using Microsoft.SharePoint.Client;
  • Now on the Search Button click paste the following code and I will explain what it is doing.
    1. protected void searchbtn_Click(object sender, EventArgs e)
    2. {
    3.    //Initaily here I am clearing the grid view, if you don’t do it, results will keep on coming 
    4.    GridView1.Columns.Clear();
    5.    // Calling My Web
    6.    SPWeb myweb = SPContext.Current.Web;
    7.    SPQuery qry = new SPQuery();
    8.    //Creating my Query as How we require for me I have two columns for data.
    9.    qry.Query = “<Where><Or><Eq><FieldRef Name=’Name’ /><Value Type=’Text’>”+TextBox1.Text+“</Value></Eq>   <Eq>   <FieldRef Name=’Company’ /><Value Type=’Text’>”+ TextBox2.Text+“</Value></Eq></Or></Where>”;
    10.    SPList lst = myweb.Lists[“Employee”];
    11.    SPListItemCollection lstcol = lst.GetItems(qry);
    12.    //Bind it to the Data Table
    13.    DataTable dt = new DataTable();
    14.    dt.Columns.Add(“Name”typeof(string));
    15.    dt.Columns.Add(“Company”typeof(string));
    16.    // Check whether it does not have null values
    17.    if (lstcol.Count > 0)
    18.    {
    19.       foreach (SPListItem item in lstcol)
    20.       {
    21.          DataRow dr = dt.NewRow();
    22.          dr[“Name”] = item[“Name”] != null ? item[“Name”].ToString() : “”; ;
    23.          dr[“Company”]= item[“Company”] != null? item[“Company”].ToString(): ” “;
    24.          dt.Rows.Add(dr);
    25.       }
    26.    }
    27.    else Label3.Text = “There are no items to display.”;
    28.    {
    29.       //Bind it to the Data View
    30.       BoundField bf = new BoundField();
    31.       bf.DataField = “Name”;
    32.       bf.HeaderText = “Name”;
    33.       GridView1.Columns.Add(bf);
    34.       bf = new BoundField();
    35.       bf.DataField = “Company”;
    36.       bf.HeaderText = “Company”;
    37.       GridView1.Columns.Add(bf);
    38.       GridView1.AutoGenerateColumns = false;
    39.       GridView1.DataSource = dt;
    40.       GridView1.DataBind();
    41.    }
    42. }
  • Rebuild the solution.
  • Deploy.
  • Open your site and create a Page where you want this web part.
  • Edit the page.
  • Click on Add a Web part.
  • Go to Custom Category, you will find your web part.
  • Add it.
  • You will see your web part on the screen.

    search

  • Type your values and click on Search.

    click on Search

  • Here it’s your result being displayed on a grid view.

Here was your search web part, keep learning.

Cheers.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s