Monday, August 3, 2009

Mobile Web Development in ASP.NET - Part 4

Introduction


The Part4 of the series on Mobile Web Development deals with the ObjectList control that offers you ways of listing data objects from data source or any other collection of items from an array or arraylist.

ObjectList Control


It provides a feature-rich view of a list of data objects. The ObjectList control inherits much of its behavior, including support for templated rendering by using device template sets, and internal pagination, from the List control. Although they are both lists, a ObjectList control differs in capabilities and scope from a List control.

Features of ObjectList control


Data bound

ObjectList control is strictly data bound. The only way to add items to an object list in a control is by binding the list to a data source.
Multiple-property view
It allows you to view multiple properties, or fields, associated with each item. Depending on device characteristics, the control can be rendered as a table that displays more than one property of each object, or UI can be provided to allow the user to view additional properties of an object.
Multiple item commands
It allows you to associate multiple commands with each item. The set of commands for an item can be either shared among all items or unique to the item.
Internal pagination and templating
is supported.

The following controls can contain one or more ObjectList controls.

System.Web.UI.MobileControls.Form

System.Web.UI.MobileControls.Panel


The ObjectList control can contain one or more of the following control.

System.Web.UI.MobileControls.ObjectList.Field

System.Web.UI.MobileControls.ObjectList.Command


Device Templates


The ObjectList control support the following device templates.

AlternatingItemTemplate
This template renders even-numbered items in a list view of an ObjectList object.
HeaderTemplate
The header template is rendered at the beginning of the list. In paginated mode, the header is rendered on each page.
FooterTemplate
The footer template is rendered at the end of the list. In paginated mode, the footer is rendered on each page.
ItemDetailsTemplate
This template replaces the rendering of the commands/details view for an ObjectList object.
ItemTemplate
The item template is rendered for each list item.
SeparatorTemplate
The separator template separates items from each other.

Device-Specific Behavior – HTML


On HTML devices, the object list is initially rendered as a table, with each list item (object) represented by a link. The default value for the link is a value associated with the first column in the dataset. You can set any column as a LabelField Property.

Device-Specific Behavior – WML


On WML devices, the object list is initially rendered as a select list, with each item represented by its label. By selecting the item, the user can view a menu of commands for the item, including a link labeled "Details". By clicking "Details", the user can view title and value of all fields.

Example6


The following example shows how to use Object list for viewing titles by author. It is bound to the dataset “dsAuthors”. The page has three mobile form controls and on the mobile form 1, ObjectList shows a list of all authors. On selecting a command to view the titles by author, mobile form 2 is activated where in user could see the list of titles. On selecting the Sales Trend Link, mobile form 3 is activated that displays a message.












BackColor="Turquoise">


Currently, this feature is not available for users!



private void Page_Load(object sender, System.EventArgs e)
{
if (Page.IsPostBack == false)
{
oleDbDataAdapter1.Fill(dsAuthors1);
ObjectList1.DataBind();
}
}
string authorid;
public void List1_Click(Object sender, ObjectListCommandEventArgs e)
{
authorid = e.ListItem[0];
if (e.CommandName == "Titles")
{
ActiveForm = Form2;
}
else if (e.CommandName == "Sales")
{
ActiveForm = Form3;
}
else
{
ActiveForm = Form1;
}
private void GetAuthorTitles()
{
string ssql = "select titles.title_id, title, type, price, notes from titleauthor, titles where titleauthor.au_id = '" + authorid + "' and titleauthor.title_id = titles.title_id";
DataSet ds1 = new DataSet();
OleDbDataAdapter Adapter = new OleDbDataAdapter(ssql,oleDbConnection1);
Adapter.Fill(ds1);
ObjectList2.DataSource = ds1;
ObjectList2.LabelField = "Title";
ObjectList2.DataBind();
}

private void Form2_Activate(object sender, System.EventArgs e)
{

GetAuthorTitles();
}




Summary


This part covered the most significant use of ObjectList control. The next part of the article would discuss about simple controls like PhoneCall, Link and TextView.



Regard

Prateek

Mobile Web Development in ASP.NET - Part 3

Introduction


The Part3 of the series on Mobile Web Development deals with the SelectionList control that offers you variety of choices of selecting an item or items from a list and act accordingly.

SelectionList Control


The SelectionList control provides the UI selection capability for a list control. Although they are both lists, a SelectionList control differs in capabilities and scope from a List control.

Features of SelectionList


An item selected from a SelectionList control does not generate a server event. You need to add a Command Control for submitting the form to the server.
SelectionList control allows multiple items to be selected.
SelectionList control manages only small lists and does not offer pagination.
SelectionList control supports different types with the SelectType attribute values: SelectType=DropDown|ListBox|Radio|MultiSelectListBox|CheckBox

The following controls can contain one or more SelectionList controls.

System.Web.UI.MobileControls.Form

System.Web.UI.MobileControls.Panel


The SelectionList control can contain one or more of the following control.

System.Web.UI.MobileControls.Item


Device Templates


The SelectionList control does not support device templates.

Example3


The following example shows how to create a selection list for hardware peripherals. When the user chooses a device, a second page displays the device name and its price.




<%@ Page Inherits="System.Web.UI.MobileControls.MobilePage"
Language="c#" %>
<%@ Register TagPrefix="mobile"
Namespace="System.Web.UI.MobileControls"
Assembly="System.Web.Mobile" %>




For pricing, select a component:










Get the price!




Hardware Device Price Request







Example4


In this example, the DataSource property of the SelectionList class is an array called channels that is created and filled during the initial page load. You can set the SelectType property in the code and display the selection through two alternate means during postbacks



<%@ Page Inherits="System.Web.UI.MobileControls.MobilePage"
Language="c#" %>
<%@ Register TagPrefix="mobile"
Namespace="System.Web.UI.MobileControls"
Assembly="System.Web.Mobile" %>












Both the List and SelectionList controls allow you to list items from a data source and provides the following properties:

DataMember="dataMember"
DataTextField="DataTextField"
DataValueField="DataValueField"
OnItemDataBind="itemDataBindHandler"

Example5





The following example shows a SelectionList control bound to a dataset that has rows from the Authors table. On selecting an item (AuthorId), user pushes the command button to display his name in a label control.

private void Form1_Load(object sender, System.EventArgs e)
{
if (Page.IsPostBack == false)
{
oleDbDataAdapter1.Fill (dataSet21);
SelectionList1.DataSource = dataSet21;
SelectionList1.DataBind();
}
}

private void Command1_Click(object sender, System.EventArgs e)
{
Label1.Text = "Name of the selected Author is: " + SelectionList1.Items[SelectionList1.SelectedIndex].Value.ToString();
}




Get Author Name





Summary


This part covers the most common uses of SelectionList control. The next part of the article would discuss about the the ObjectList control, a highly sophisticated control in the mobile list controls.


Regard

Prateek

Mobile Web Development in ASP.NET - Part 2

Introduction


The first part of the article dealt with the Microsoft Mobile Internet ToolKit and Visual Studio environment and configuration settings required for creating a mobile based web application in ASP.NET. In the second part, I discuss few mobile controls and how to develop mobile pages that run on a browser or emulator…

ASP.NET Mobile Controls


A developer can create ASP.NET mobile Web Forms pages consisting of controls either in the ASP.NET Mobile Designer or with any text editor. Many of the controls are similar to desktop controls in Web Forms and to GUI controls in other programming languages, such as Microsoft Visual Basic.

MobilePage


This is the base class for all mobile ASP.NET pages. As such, the MobilePage control provides the outermost layer of all the containers in an ASP.NET mobile Web application. It is the only container associated with a URL and primarily contains style and context information common to all controls.

<%@ Page Inherits="System.Web.UI.MobileControls.MobilePage" Language="c#" %>
<%@ Register TagPrefix="mobile"
Namespace="System.Web.UI.MobileControls"
Assembly="System.Web.Mobile" %>

A mobile page requires two directives. The first directive instructs the ASP.NET page framework to use MobilePage as the base class for the page. The Inherits attribute is required. If the page inherits directly from a MobilePage object, the Inherits attribute must be set to the System.Web.UI.MobileControls.MobilePage namespace. If the page inherits from a code-behind class, the name of the class must be specified instead. The Language attribute is optional; you can set it to the language used on the page, as with any other Web Forms page.

The second directive registers the namespace used by ASP.NET mobile controls that have the mobile prefix. This allows you to declare mobile controls on the page by using the mobile prefix as below.




A MobilePage object can contain the following controls.

System.Web.UI.MobileControls.Form
A MobilePage object must contain at least one Form control and can contain more than more than one Form control.
System.Web.UI.MobileControls.Stylesheet
A style sheet is not required for a MobilePage object. A MobilePage control may or may not have a Stylesheet control.

Example1


This example creates a mobile page and a form, and then adds a label to the form.



<%@ Page Inherits= "System.Web.UI.MobileControls.MobilePage" %>
<%@ Register TagPrefix="mobile"
Namespace="System.Web.UI.MobileControls"
Assembly="System.Web.Mobile" %>



My First MobilePage with some controls in it




List Control


It renders a list of items to a mobile device. This control supports templated rendering through device template sets, and it supports internal pagination just as you find it in datalist control in ASP.NET. For information on Template Sets and Templated Controls or Pagination, I will discuss them in the later part of the article.

List control has both Static and Interactive Modes

Static mode
- The control behaves like a static list. Static list items can be declared as item child elements.
Interactive mode
- The control renders items as interactive elements.

The behavior of these modes is based on the presence of an event handler. When an event handler is not present, the control is set to static mode. When an event handler is present, the control is set to interactive mode, in which each item is an interactive element that generates an event when clicked.

You can optionally place DeviceSpecific/Choice construct inside a list control

The following controls can contain one or more List controls.

System.Web.UI.MobileControls.Form
System.Web.UI.MobileControls.Panel


A List control may or may not contain the following controls.

System.Web.UI.MobileControls.DeviceSpecific

System.Web.UI.MobileControls.Item
.

Device Templates in List control

HeaderTemplate
The header template is rendered at the beginning of the list. In paginated mode, the header is rendered on each page.
FooterTemplate
The footer template is rendered at the end of the list. In paginated mode, the footer is rendered on each page.
ItemTemplate
The item template is rendered for each list item.
AlternatingItemTemplate
If defined, an alternating item template is rendered instead of the item template for even items. For example, the second item is an alternating template, as is the fourth item, as is every subsequent even-numbered item.
SeparatorTemplate
The separator template is rendered between two items.

Example2


The following example displays a list of fruit. When you select a fruit, the control displays its price.


<%@ Page Inherits= "System.Web.UI.MobileControls.MobilePage"
Language="C#" %>
<%@ Register TagPrefix="mobile"
Namespace="System.Web.UI.MobileControls"
Assembly="System.Web.Mobile" %>




Select a Fruit!
OnItemCommand="ListFruit_Click" >











Summary


The second part of the series has discussed two mobile controls, List and Label, placed in a mobile form container. Note that the Example2 has two mobile forms in a mobile page. In the Part3 of the article, you would get to know about more of the mobile controls.

Regard

Prateek

Mobile Web Development in ASP.NET - Part 1

Introduction


The Microsoft® Mobile Internet Toolkit (MIT) provides the tools for creating new applications that target mobile devices. This toolkit allows developers to create a mobile application that will be adapted to the display of multiple mobile devices: Personal Digital Assistants (PDAs) such as the Pocket PC, Web-enabled cell phones, pagers, etc.

MMIT


The ASP.NET mobile forms and controls are formerly known as the Microsoft Mobile Internet Toolkit (MMIT). They extend the power of the Microsoft .NET Framework and Visual Studio .NET to build mobile Web applications by enabling ASP.NET to deliver markup to a wide variety of mobile devices. It contains server-side technology that enables ASP.NET to deliver content to a wide variety of mobile devices.

The .NET Framework version 1.1 provides support for mobile device development with ASP.NET mobile controls, support for Internet Protocol version 6, and ADO.NET classes for native communication with Open Database Connectivity (ODBC) and Oracle databases. It also enables the use of code access security to further lock down and isolate ASP.NET applications.

ASP.NET mobile controls consist of a set of ASP.NET server controls and device adapters that can intelligently render your application. Knowledge of ASP.NET and Web Forms helps you use mobile controls to build mobile Web applications. You can build mobile Web applications using the ASP.NET Mobile Designer in Microsoft Visual Studio .NET or a text editor, and any programming language supported by the common language runtime. The .NET Framework and the ASP.NET mobile controls together form a powerful, flexible, and extensible platform for developing and deploying mobile Web applications.

Testing the Mobile Application using Emulators


The manufacturers of most mobile devices provide emulators that simulate the operation of their hardware and browsers. Emulator software enables you to view your ASP.NET mobile Web Forms application as it might appear on the manufacturers' hardware devices.

To install an emulator as the Visual Studio application browser
1. Install and test the mobile device emulator on your development computer. See the emulator's documentation for instructions.
2. From the File menu, select Browse With. Visual Studio displays the Browse With dialog box.
3. Click the Add button to display the Add Program dialog box.
4. In the Program name field, enter the name of the emulator software's executable program file. Alternatively, select the Browse button to browse to the file's location.
5. If the emulator supports command-line arguments, supply them in the Program name field. For example, you can specify the starting URL of the application, select a "skin" for the browser, or supply other start-up information that your browser might use. For more information about skins and specific start-up information, see your emulator's documentation.
a. Use the %URL variable to specify where the application's start page should be substituted on the command line. This variable name is case sensitive.
b. If supported, specify a skin name. Testing with multiple skins requires multiple instances of the emulator in the browser list.
c. Supply any other arguments the emulator needs. See your emulator's documentation for details.
6. In the Add Program dialog box's Friendly name field, type the name of the browser as you would like it to appear in Visual Studio.
7. Click OK to close the Add Program dialog box.
8. In the Browse With dialog box, select the emulator from the list of browsers, and click the Set as Default button. Click Close to close the Browse With dialog box.
Note After you add an emulator to the list of browsers, you cannot modify its settings. You must delete it and add it again with the new settings.
9. In the Solution Explorer, click on the name of the project file.
10. From the Project menu, select Properties. The Property Pages dialog box appears.
11. Click Configuration Properties.
12. In the list of configuration properties, select Debugging. The dialog box displays the debugging configuration properties in the right-hand box.
13. Set the Always use Internet Explorer property to False.

Openwave Simulator


Mobile Web applications developed in ASP.NET (using the ASP.NET mobile controls), can be tested with Openwave mobile browser simulators without leaving Microsoft Visual Studio .NET. This is done by configuring Visual Studio .NET to take advantage of the command-line arguments supported by the Openwave SDK 4.1.1 and Openwave SDK 6.1. (These Openwave SDKs are available for free from the Openwave Developer Web site.)

Openwave SDK 4.1.1 contains a simulator for Openwave mobile browser 4.1, which adheres to the WAP 1.1 standard and renders content in WML. SDK 6.1 contains Openwave mobile browser 6.1, which adheres to the WAP 2.0 standard and renders content in XHTML Mobile Profile and CSS. You can use either or both simulators, depending on your needs and the target devices for your market.

Summary


The first part explained the basic ideas on Mobile ASP.NET environment and tools; the next part will take you how to develop simple mobile applications in ASP.NET.


Regard


Prateek

How to create SSL certificate for Web Development?

How to create SSL certificate for Web Development?


Microsoft provides a tool named “MakeCert.exe” which helps us to create a temporary SSL Certificate for development environment.

This tool comes with Visual Studio & also with Windows SDK.

If you installed Visual Studio, you can find it in this location: “C:\Program Files\Microsoft Visual Studio \SmartDevices\SDK\SDKTools”. If you installed Windows SDK, you will get it here: “C:\Program Files\Microsoft SDKs\Windows\\Bin”.

Now open Command Console (“cmd.exe”) & change your current directory to one of the location specified above. Type the following in Command Prompt & hit enter:

makecert -b 01/01/2009 -e 01/01/2020 -n "CN=Developers" -pe -r -sk "Microsoft Cryptographic Provider" -ss "Microsoft Cryptographic Store" c:\developerCertificate.cer

This will create a test certificate (valid from 01/01/2009 to 01/01/2020) named “developerCertificate.cer” in your ‘C’ drive, which you can use for development environment. You can change the validity period by changing the begindate (-b) & expirydate (-e). You can also change all the parameters specified above.

Here is the list of the parameters mentioned above:

Parameter Description
-b Begin Date
-e Expiry Date
-n Certificate Subject Name
-pe Mark Generated Private Key as Exportable
-r Configures MakeCert to create a self-signed root certificate
-sk Subject’s Key Container Name
-ss


Regard

Prateek

Crystal Report to PDF

There are situations when we want to export Crystal reports to .pdf format programmatically. In these situations we can use ExportOptions for export the Crystal Reports to .pdf format. Also we have to set PdfRtfWordFormatOptions and ExportFormatType. PortableDocFormat . In the following example you can see how to export a Crystal Reports as a PDF format file in C#.



private void button2_Click(object sender, EventArgs e)
{
try
{
ExportOptions CrExportOptions ;
DiskFileDestinationOptions CrDiskFileDestinationOptions = new DiskFileDestinationOptions();
PdfRtfWordFormatOptions CrFormatTypeOptions = new PdfRtfWordFormatOptions();
CrDiskFileDestinationOptions.DiskFileName = "c:\\csharp.net-informations.pdf";
CrExportOptions = cryRpt.ExportOptions;
{
CrExportOptions.ExportDestinationType = ExportDestinationType.DiskFile;
CrExportOptions.ExportFormatType = ExportFormatType.PortableDocFormat;
CrExportOptions.DestinationOptions = CrDiskFileDestinationOptions;
CrExportOptions.FormatOptions = CrFormatTypeOptions;
}
cryRpt.Export();
}
catch (Exception ex)
{
MessageBox.Show(ex.ToString());
}
}

Regard

Prateek

Sunday, August 2, 2009

JavaScript to select one checkbox at a time inside a gridview containing checkbox as template column

Many times we need JavaScript for controls inside a gridview.One such need is to check only one checkbox at a time.This code snippet illustrates how to do that and this can be a guideline for all such needs.

The below java script is for checkbox inside a gridview as template column.If one checkbox is selected, it should deselect other check boxes .In code behind u have to include JavaScript for each checkbox in rowdatabound event.



protected void dgprod_RowDataBound(object sender, GridViewRowEventArgs e)
{
CheckBox chkh = new CheckBox();
chkh=(checkbox)e.Row.FindControl("chkcat");
chkh.Attributes.Add("onclick", "javascript:return Selectone(this,'"+ dgprod.ClientID +"');");

}

javascript to select one checkbox at a time:

function selectone(chid,gridviewid)
{

var grid=document.getelementbyid("gridviewid");
for (i=1; i{
var inputs = grid.getElementsByTagName("input");
if (inputs.length>0)
{

for (i=1; i{
if(inputs[i].type=="checkbox")
{

var chk=$get(inputs[i].id);

if(chk.id!=chid.id)
{
chk.checked=false;
}

}
}

Regard

Prateek