Deepu MI's Blog

Custom Template in InfoPath 2010

deepumi — Sun, 08 Jan 2012 04:09:26 +0000

I’ve been playing around with InfoPath forms this weekend for converting paper forms to eForms (Infopath forms). One of the challenge I have faced was maintaining the consistency of application look and feel for all the forms, since InfoPath designer doesn’t support master page layout but it also provide an alternative solution called custom TEMPLATE control which you can convert any layout in to a .STP file and can reuse across all the forms.

Click here to Download the template

Open InfoPath Designer 2010 and select Template Parts as BLANK and click Design Form

Design your own layout…I have created a sample STP layout and Save it as Infopath Web Browser Template Part.

Once you save the template as .STP file then you can add it as custom template in the template section

Click Add or Remove Custom Controls and select template part and browse your .STP file.

Once the template added successfully it will appear in the Custom control section

That’s it. Now you can reuse the new custom template / control to any new forms and existing forms.

Click here to Download the template

Hope this helps and If you have any comments, please feel free to write your feedback.

Thanks
Deepu

Silverlight Dashboard

deepumi — Sun, 02 Oct 2011 14:47:59 +0000

I have found a dashboard control from Microsoft expression website (created by infragistics.com) which inspired me to create a dashboard control.

Click here to watch live | Click here to Download

If you find the Silverlight Dashboard code useful, please consider donating

In this article I’m going to explain the types of controls used to create a interactive dashboard.

Grid based layout
Customer Master / Detail list
Chart control
Bing Map control
Custom Splash screen

Grid based layout

A simple grid layout with 2/2 row column.

Customer Master / Detail list

For master detail scenario ListBox control is the right choice to build.. The control will list the customer name and location, once you click the detail link its going to take you to a popup window for more information.

Chart Controls

Bar Chart

IndependentValuePath="Month" AnimationSequence="Simultaneous" IsSelectionEnabled="True">

Pie chart

DependentValuePath="Profit" AnimationSequence="Simultaneous"/>

Map

CredentialsProvider="

Click here to watch live | Click here to Download

If you find the Silverlight Dashboard code useful, please consider donating

Hope this helps and If you have any comments, please feel free to write your feedback.
Thanks
Deepu

Animation using PathListBox control in Silverlight

deepumi — Sat, 23 Apr 2011 13:52:48 +0000

The PathListBox is new control introduced in Silverlight 4.0 for listing items in a various shapes like path, circle, arc, rectangle etc. This control is similar to traditional ListBox control which support data binding and display of one or more items at design time or dynamically at run time. The pathlistbox provides many properties like orienation, padding etc.

Watch Video | Live Demo | Download Source Code | Download Presentation

In this tutorial, we’ll create a simple animation using PathListBox Control..

Open Expression Blend Editor & Create a new project in Silverlight Application + Website.

Add a new shape Ellipse in to the page.

Add a PathListBox control in to the page(PLB).

Drag & drop few images in to PLB control. (Press control to select multiple items from the project properties).

Select PLB control from object & time line window.

Go to PLB control properties window and find out Layout Paths.

Click on select an object to use as a LayoutPath.

Select Ellipse shape as the LayoutPath

The images should show in circular layout path

Add a Projection for Ellipse shape called PlaneProjection to rotate the Ellipse.

Add a StoryBoad control from object & time line window.

Switch to XAML version and write few lines of XAML code for animation purpose.

Add a Double Animation inside the StoryBoard control and set Target name & properties.

Add the following line of code in the Page Load method in order to start the animation.

Hit F5 and see the demo.

Watch Video | Live Demo | Download Source Code | Download Presentation

Hope this helps and If you have any comments, please feel free to write your feedback.

Thanks
Deepu

jQuery Autocomplete with multiple fileds in Asp.Net C#

deepumi — Fri, 25 Mar 2011 16:53:35 +0000

This article explains jQuery autocomplete with multiple fields using Asp.Net C#.

Scenario : Listing business titles for a specific city/state location.

Initially I used AJAX CONTROL TOOLKIT (ACT) but I ran in to many issues and finally decided to use jQuery approach which really saved my time.

You can Download the complete source code from here

Add jQuery assets on your page.

jQuery Code for consuming web service.

Code-behind for ASMX class (don’t forget to uncomment System.Web.Script.Services.ScriptService)

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web.Services;
using System.Collections;

[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.Web.Script.Services.ScriptService]
public class AutoCompleteService : System.Web.Services.WebService {

public AutoCompleteService () {
}

IDictionary LoadItems()
{
    IDictionary items = new Dictionary();

    items.Add("Newyork", new string[]
                                        {
                                            "Applebee's", "Apiary", "Brenda's French Soul Food","TGI Friday's","Cafe Venue"
                                        });

    items.Add("Los Angeles", new string[]
                                        {
                                            "Los 1", "Los 2", "Los 3","TGI Friday's","Cafe Venue"
                                        });

    items.Add("Las Vegas", new string[]
                                        {
                                            "Los 1", "Los 2", "Los 3","TGI Friday's","Cafe Venue"
                                        });

    return items;
}

[WebMethod]
public string[] GetKeyWords(string keyword, string location)
{
    var items = LoadItems();
    if (items != null && items.Count > 0)
    {
        //Get all items for a specific location
        var result = (from item in items
                        where item.Key.Equals(location, StringComparison.OrdinalIgnoreCase)
                        select item.Value)
                    .FirstOrDefault();

        //check whether the items start with the keyword
        return result.Where
                            (
                                o => o.StartsWith(keyword, StringComparison.OrdinalIgnoreCase)
                            ).ToArray();
    }
    return null;
}

[WebMethod]
public string[] GetLocations(string location)
{
    var items = LoadItems();
    if (items != null && items.Count > 0)
    {
        //check whether the items start with the location
        return (from item in items
                        where item.Key.StartsWith(location, StringComparison.OrdinalIgnoreCase)
                        select item.Key).ToArray();

    }
    return null;
}
}

You can Download the complete source code from here

Hope this help and If you have any comments, please feel free to write your feedback.

Thanks
Deepu

jQuery reorder list & saving in to database from Asp.Net C#

deepumi — Mon, 01 Nov 2010 03:52:34 +0000

I have faced lot of challenges while using Ajax Toolkit control for re-ordering a list and saving to database.. After doing some R&D I’ve found some nice samples which uses jQuery which is very light weight.The good part of jQuery is we can control the rendering marking.. with CSS and from the backed we don’t need any ViewState or any kind of mechanism..

You can Download the complete source code from here

To begin with reorder stuff add jQuery scripts to your aspx page.

The sample code uses Unordered list and list view control.. Add a List view control in to asp.net page..inside UL markup use class name as “lists“.

Next is adding a attribute to

tag which help to identify the exact element you are ordering, so I am adding attribute name as id and setting value as ItemId which fetching from DB column identity value.

id=’<%# DataBinder.Eval(Container.DataItem, “ItemId“)%>’>








<%# DataBinder.Eval(Container.DataItem, "Title")%>

Add following code in codebehind class for binding the data to list view control

using System;
using System.Collections.Generic;

public class News
{

public int ItemId { get; set; }
public string Title { get; set; }

internal static IList GetNews()  //replace this method call with your db logic
{
return new List
{
new News{ItemId=1,Title="News Title 1"},
new News{ItemId=2,Title="News Title 2"},
};
}

internal static void SaveReorderList(List items) //replace this method call with your db logic
{
int order = 1;
string sql = string.Empty;
foreach (string item in items)
{
//replace with your sql statement.
sql = "update news set display_order = " + order + " where news_id = '" + item + "'";
order += 1;
sql = string.Empty;
}
}
}

public partial class jQueryReorder_Net_Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
BindNews();
}
}

private void BindNews()
{
var news = News.GetNews();
lvNews.DataSource = news;
lvNews.DataBind();
}

[System.Web.Services.WebMethod]
public static string SaveReOrder(List items)
{
try
{
News.SaveReorderList(items);
return string.Empty;
}
catch (Exception exp)
{
return exp.ToString();
}
}
}

Finally I am adding jQuery re-order script in to the page.

When ever the list order changed the event get fired and loop through the entire list items and sets the attribute id value in to a array which will be converted later to JSON format and pass it to a web method for saving into database. Don’t forget to add method attribute as System.Web.Services.WebMethod in the reorder save method.

You can Download the complete source code from here

Hope this helps and If you have any comments, please feel free to write your feedback.

Thanks
Deepu

Silverlight Integration in MOSS 2007 with out WebPart

deepumi — Sun, 29 Aug 2010 03:33:16 +0000

In this article I will walk you through how you can integrate a Silverlight application in Sharepoint with out using any webpart. (Download the STP file)

I will use one of my existing silverlight slide show application for this demo..

Upload your silverlight related files in the sharepoint repository, here I am uploading Silvrlight.js, Silverlight XAP file and images folder in the Shared Document library

The next step is open the website in SPD (Sharepoint Designer) and create a aspx page under Shared Documents library and add some markup code inside the content place holder (PlaceHolderMain) and copy paste the silverlight object and javascript code.

Save & preview the page in browser you should be able to see your Silverlight application running inside Sharepoint..

Download the STP file

Hope this help and If you have any comments, please feel free to write your feedback.

Thanks
Deepu

Twitter Tweets in Asp.Net C#

deepumi — Tue, 03 Aug 2010 16:11:09 +0000

I’ve been working on the twitter feed in one of my recent project where tweets getting updated on a regular interval time (say for every 30 minutes or 1 hr). I am creating this as a ASCX control so that I can reuse for multiple projects.

You can Download the complete source code from here

I am dropping a ListView control in the ASCX page which render the Twitter Profile name along with Title, Description and Published date for the latest tweets.

Couple of properties need to configure to use this control

TwitterProfileName – Your twitter profile name or screen name

TweetsCount – No of tweets you want to return (default is 10).




77B5D2;">




<%= TwitterProfileName%>















<%# DataBinder.Eval(Container.DataItem, "Title")%>



<%# DataBinder.Eval(Container.DataItem, "PublishedDate", "{0:h:mm  tt MMM d}")%>






No tweets available.




1px solid lightgrey;">

using System;
using System.Linq;
using System.Xml.Linq;
using System.Collections;
using System.Collections.Generic;

public partial class TweetsControl : System.Web.UI.UserControl
{
private static DateTime? lastUpdated = null; //holds last updated time

private static XDocument xDoc = null; //static variable to store the result xml.

//Updates latest Tweets for every 10 minutes in page refresh.
private static Double Interval = 10;

//Determine its time to get the new tweets
private static Boolean IsTimeForUpdate
{
get
{
if (lastUpdated.HasValue && DateTime.Now > lastUpdated.Value.AddMinutes(Interval))
{
return true;
}
return false;
}
}

//Hold no of tweets default set it as 10.
public Int32? TweetsCount { get; set; }

//Twitter profile name or screen name.
public String TwitterProfileName { get; set; }

protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
GetTweets();
}
}

private void GetTweets()
{
var xml = LoadXML();
IEnumerable query = null;
if (xml != null)
{
query = from e in xml.Descendants("item")
select new
{
Title = e.Element("title").Value,
Link = e.Element("link").Value,
PublishedDate = Convert.ToDateTime((e.Descendants("pubDate").First().Value)),
};
}
lvTweets.DataSource = query;
lvTweets.DataBind();
}

private XDocument LoadXML()
{
if (xDoc != null && !IsTimeForUpdate)
{
return xDoc;
}
else
{
try
{
TweetsCount = TweetsCount.HasValue ? TweetsCount : 10;
var url = string.Format("http://api.twitter.com/statuses/user_timeline.rss?screen_name={0}&count={1}", TwitterProfileName, TweetsCount);
xDoc = XDocument.Load(url);
lastUpdated = DateTime.Now;
return xDoc;
}
catch
{
return null;
}
}
}

}

Refer more api information on Twitter API

You can Download the complete source code from here

Hope this helps

Thanks
Deepu

using System; using System.Linq; using System.Xml.Linq; using System.Collections; using System.Collections.Generic; public partial class TweetsControl : System.Web.UI.UserControl { private static DateTime? lastUpdated = null; private static XDocument xDoc = null; private static Double Interval = 10; private static Boolean IsTimeForUpdate { get { if (lastUpdated.HasValue && DateTime.Now > lastUpdated.Value.AddMinutes(Interval)) { return true; } return false; } } public Int32? TweetsCount { get; set; } public String TwitterProfileName { get; set; } protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { GetTweets(); } } private void GetTweets() { var xml = LoadXML(); IEnumerable query = null; if (xml != null) { query = from e in xml.Descendants(“item”) select new { Title = e.Element(“title”).Value, Link = e.Element(“link”).Value, PublishedDate = Convert.ToDateTime((e.Descendants(“pubDate”).First().Value)), }; } lvTweets.DataSource = query; lvTweets.DataBind(); } private XDocument LoadXML() { if (xDoc != null && !IsTimeForUpdate) { return xDoc; } else { try { TweetsCount = TweetsCount.HasValue ? TweetsCount : 10; var url = string.Format(“http://api.twitter.com/1/statuses/user_timeline.rss?screen_name={0}&count={1}”, TwitterProfileName, TweetsCount); xDoc = XDocument.Load(url); lastUpdated = DateTime.Now; return xDoc; } catch { return null; } } } }

Export Data Grid to Excel in Silverlight 4.0

deepumi — Tue, 01 Jun 2010 01:25:08 +0000

One of the great feature in Silverlight 4.0 is COM interoperability, now your Silverlight application can talk with Office applications using Com Automation Factory. This feature requires a trusted application (elevated permissions). In this article I am going to explain how you can export your data from datagrid to excel spread sheet as OOB (Out of browser) application using C# 4.0 magic keyword called “dynamic“.

You can Download the complete source code from here

Create a new Silverlgiht 4.0 project using VS 2010 and add Microsoft.CSharp as reference (for C# 4.0 dynamic keyword) and also the add the name space System.Runtime.InteropServices.Automation for com interoperability

I am using a customer class with some getter and setter properties to bind the datagrid.

Customer Class


using System;
using System.Collections.Generic;
using System.Windows;
using System.Windows.Controls;
using System.Runtime.InteropServices.Automation;

 public class Customer
 {
 public string FirstName { get; set; }
 public string LastName { get; set; }
 public int Age { get; set; }
 public bool IsSubscribed { get; set; }
 }

Method for Binding customer list to the Data Grid

 public ExportToExcel()
 {
 InitializeComponent();
 BindDataGrid();
 }

 void BindDataGrid()
 {
 int count = 10;
 List customers = new List();
 for (int i = 0; i < count; i++)
 {
 customers.Add(new Customer()
 {
 FirstName = "First Name " + i,
 LastName = "Last Name " + i,
 Age = i + 10,
 IsSubscribed = (i % 2 == 0)
 });
 }
 dgCustomers.ItemsSource = customers;
 }

Method for exporting data from data grid to excel spread sheet

 void GenerateSpreadSheet(object sender, RoutedEventArgs e)
 {
 int rowIndex = 1;
 int coulmnIndex = 1;

 try
 {
 dynamic excel = AutomationFactory.CreateObject("Excel.Application");

 excel.workbooks.Add();

 dynamic sheet = excel.ActiveSheet;

 for (int i = 0; i < dgCustomers.Columns.Count; ++i)
 {
 dynamic headerCell = sheet.Cells[rowIndex, coulmnIndex + i];
 headerCell.Value = dgCustomers.Columns[i].Header;
 headerCell.Font.Bold = true;
 headerCell.Interior.Color = 0xFF00;
 }

 foreach (Customer customer in dgCustomers.ItemsSource)
 {
 rowIndex++;

 //column 1
 dynamic cellFirstName = sheet.Cells[rowIndex, 1];
 cellFirstName.Value = customer.FirstName;
 cellFirstName.Font.Color = 003399;

 //column 2
 dynamic cellLastName = sheet.Cells[rowIndex, 2];
 cellLastName.Value = customer.LastName;
 cellLastName.Font.Color = 003399;

 //column 3
 dynamic cellAge = sheet.Cells[rowIndex, 3];
 cellAge.Value = customer.Age;
 cellAge.Font.Color = 003399;

 //column 4
 dynamic cellSubscribed = sheet.Cells[rowIndex, 4];
 cellSubscribed.Value = customer.IsSubscribed ? "Yes" : "No";
 cellSubscribed.Font.Color = 003399;
 }
 excel.Visible = true;
 }
 catch (Exception ex)
 {
 MessageBox.Show("Error generating excel: " + ex.Message);
 }
 }

The xaml code creates a data grid and a button

Out of Browser set up

It is really easy to make a Silverlight applicaton as run out of browser mode. Right click the Silverlight project, select properties and check the ENABLE RUNNING APPLICATION OUT OF THE BROWSER.

Elevated permissions (Trusted Application)

Right click Silverlight Project – > Select Properties – > Click Out-Of-Browser Settings

You can Download the complete source code from here

Hope this help and If you have any comments, please feel free to write your feedback.

Thanks
Deepu

Google Spell Checker Api Asp.Net C#

deepumi — Thu, 20 May 2010 10:45:58 +0000

In this article you will learn how to use the Google Spell Checker API in Asp.Net C# apps

Download the complete source code from here

The API is very simple, spell checking is done through a XML http post to the following url

https://www.google.com/tbproxy/spell?lang=en:

Request XML structure

xml version=”1.0” encoding=”utf-8” ?>
<spellrequest textalreadyclipped=”0” ignoredups=”0” ignoredigits=”1” ignoreallcaps=”1“>
<text>Hotal</text>
</spellrequest>

The folloing are the Response XML from Google API

xml version=”1.0” encoding=”UTF-8“?>
<spellresult error=”0” clipped=”0” charschecked=”12“>
<c o=”0” l=”5” s=”0″>Hotel Hotly Total Ital Hots</c>
</spellresult>

Tag	Description
o	The offset from the start of the text of the word
l	Length of misspelled word
s	Confidence of the suggestion
text	Tab delimited list of suggestions

See the complete code here

using System;
using System.Net;
using System.Text;
using System.Text.RegularExpressions;

public static class SpellChecker
{
 public static String DidYouMean(string word)
 {
 string retValue = string.Empty;
 try
 {
 string uri = "https://www.google.com/tbproxy/spell?lang=en:";
 using (WebClient webclient = new WebClient())
 {
 string postData = string.Format("{0}",word);

 webclient.Headers.Add("Content-Type", "application/x-www-form-urlencoded");
 byte[] bytes = Encoding.ASCII.GetBytes(postData);
 byte[] response = webclient.UploadData(uri, "POST", bytes);
 string data = Encoding.ASCII.GetString(response);
 if (data != string.Empty)
 {
    retValue = Regex.Replace(data, @"<(.|\n)*?>", string.Empty).Split('\t')[0];
 }
 }
 }
 catch (Exception exp)
 {

 }
 return retValue;
 }
 }

protected void Page_Load(object sender, EventArgs e)
{
    string word = SpellChecker.DidYouMean("Hotal");
    if(word != string.Empty)
    {
         labMessage.Text = "Did you mean " + retValue + "";
    }
}

You can Download the complete source code from here

Hope this help and If you have any comments, please feel free to write your feedback.

Thanks
Deepu

Asp.Net 4.0 URL Routing

deepumi — Fri, 14 May 2010 06:13:06 +0000

It’s been really easy in Asp.Net 4.0 for building SEO friendly URL applications with VS 2010. In one my previous article I have explained how we can achieve the same in Asp.Net 3.5 (check it out). In Asp.Net 3.5 we need to implement the IRouteHandler interface in custom route handler class and bla bla….but now in Asp.Net 4.0 we do not need all extra code. I am following the same example in my previous article here. In the Global.asax file I am registering the routes some thing like below

You can download the entire article from here

Global.asax file Configuration

Add Import directive to Import System.Web.Routing name space

<%@ Import Namespace=”System.Web.Routing” %>

void RegisterRoutes(RouteCollection routes)
 {
 routes.MapPageRoute(
 "member-list",
 "member/{name}",
 "~/member-list.aspx"
 );
 }

 void Application_Start(object sender, EventArgs e)
 {
RegisterRoutes(RouteTable.Routes);
}

The first parameter member/{name} which denote the url structure, here the url which starts /member/{name} (ex : /member/deepu/) will point physically to the following path ~/member/member-list.aspx

Create a aspx page called default.aspx

This page will have a list of Members in Tabular format. I am going to use asp.net List view control to achieve this.

border=”0″>

Member ID

Name

Blog

’
runat=”server” />

’ runat=”server” />

’>Blog

<%# DataBinder.Eval(Container.DataItem, “Name”)%>”>
Detail

Default.aspx.cs code behind

public partial class Memeber
{
 public int MemberID { get; set; }
 public string Name { get; set; }
 public string BlogURL { get; set; }
}


public partial class _Default : System.Web.UI.Page
{
 protected void Page_Load(object sender, EventArgs e)
 {
 if (!IsPostBack)
 {
 BindUsers();
 }
 }

 void BindUsers()
 {
 var items = new List()
 {
 new Memeber {MemberID = 1,Name = "Deepu", BlogURL = "http://deepumi.wordpress.com"},
 new Memeber {MemberID = 2,Name = "Scott", BlogURL = "http://weblogs.asp.net/scottgu/"},
 new Memeber {MemberID = 3,Name = "Joe", BlogURL = "http://misfitgeek.com"},
 };


 lvUserList.DataSource = items.ToList();
 lvUserList.DataBind();
 }
}

We have completed the listing page. The next page will be the detail page which will be rendering the member name for the URL routing.

Member-List.aspx Page

Member Name :

Member-List.aspx code behind Page

var name = Page.RouteData.Values["name"];
 if (name != null)
 {
 Page.Title = name.ToString();
 labMemberName.Text = name.ToString();
 }

You can download the entire article from here

Hope this help and If you have any comments, please feel free to write your feedback.

Thanks
Deepu