2011/11/26

Data Base Connection With Repeater

<%@ Import Namespace="System.Data.OleDb" %>

<script  runat="server">
sub Page_Load
dim dbconn,sql,dbcomm,dbread
dbconn=New OleDbConnection("Provider=Microsoft.Jet.OLEDB.4.0;data source=" & server.mappath("/db/northwind.mdb"))
dbconn.Open()
sql="SELECT * FROM customers"
dbcomm=New OleDbCommand(sql,dbconn)
dbread=dbcomm.ExecuteReader()
customers.DataSource=dbread
customers.DataBind()
dbread.Close()
dbconn.Close()
end sub
</script>


<html>
<body>

<form runat="server">
<asp:Repeater id="customers" runat="server">

<HeaderTemplate>
<table border="1" width="100%">
<tr bgcolor="#b0c4de">
<th>Companyname</th>
<th>Contactname</th>
<th>Address</th>
<th>City</th>
</tr>
</HeaderTemplate>

<ItemTemplate>
<tr bgcolor="#f0f0f0">
<td><%#Container.DataItem("companyname")%> </td>
<td><%#Container.DataItem("contactname")%> </td>
<td><%#Container.DataItem("address")%> </td>
<td><%#Container.DataItem("city")%> </td>
</tr>
</ItemTemplate>

<FooterTemplate>
</table>
</FooterTemplate>

</asp:Repeater>
</form>

</body>
</html>

2011/11/13

Introduction of WPF

Windows Presentation Foundation (WPF) is a next-generation presentation system for building Windows client applications with visually stunning user experiences. With WPF, you can create a wide range of both standalone and browser-hosted applications.

WPF separates the appearance of an user interface from its behavior. The appearance is generally specified in the Extensible Application Markup Language (XAML), the behavior is implemented in a managed programming language like C# or Visual Basic. The two parts are tied together by databinding, events and commands. The separation of appearance and behavior brings the following benefits:
  • Appearance and behaviour are loosely coupled
  • Designers and developers can work on separate models.
  • Graphical design tools can work on simple XML documents instead of parsing code.

The core of WPF is a resolution-independent and vector-based rendering engine that is built to take advantage of modern graphics hardware. WPF extends the core with a comprehensive set of application-development features that include Extensible Application Markup Language (XAML), controls, data binding, layout, 2-D and 3-D graphics, animation, styles, templates, documents, media, text, and typography. WPF is included in the Microsoft .NET.



How to create a simple WPF application

Open Visual Studio 2008 and choose "File", "New", "Project..." in the main menu. Choose "WPF Application" as project type.
Choose a folder for your project and give it a name. Then press "OK"
Visual Studio creates the project and automatically adds some files to the solution. A Window1.xaml and an App.xaml. The structure looks quite similar to WinForms, except that the Window1.designer.cs file is no longer code but it's now declared in XAML as Window1.xaml
Open the Window1.xaml file in the WPF designer and drag a Button and a TextBox from the toolbox to the Window
Select the Button and switch to the event view in the properties window (click on the little yellow lightning icon). Doubleclick on the "Click" event to create a method in the codebehind that is called, when the user clicks on the button.
Note: If you do not find a yellow lightning icon, you need to install the Service Pack 1 for VisualStudio on your machine. Alternatively you can doubleclick on the button in the designer to achieve the same result.
Visual Studio automatically creates a method in the code-behind file that gets called when the button is clicked.
 
private void button1_Click(object sender, RoutedEventArgs e)
{
    textBox1.Text = "Hello WPF!";
}
 
 
The textbox has automatically become assigned the name textBox1 by the WPF designer. Set text Text to "Hello WPF!" when the button gets clicked and we are done! Start the application by hit [F5] on your keyboard.


 <!--Amit Kumar jha-->

Download the WPF Toolkit - either source or binaries (the toolkit is entirely open source).


Example:

<Window
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  x:Class="SDKSample.DataTemplateWindow"
  Title="With a Data Template">


...


<Window.Resources>
  <!-- Data Template (applied to each bound task item in the task collection) -->
  <DataTemplate x:Key="myTaskTemplate">
    <Border Name="border" BorderBrush="DarkSlateBlue" BorderThickness="2" 
      CornerRadius="2" Padding="5" Margin="5">
      <Grid>
        <Grid.RowDefinitions>      
          <RowDefinition/>
          <RowDefinition/>
          <RowDefinition/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
          <ColumnDefinition Width="Auto" />
          <ColumnDefinition />
        </Grid.ColumnDefinitions>
        <TextBlock Grid.Row="0" Grid.Column="0" Padding="0,0,5,0" Text="Task Name:"/>
        <TextBlock Grid.Row="0" Grid.Column="1" Text="{Binding Path=TaskName}"/>
        <TextBlock Grid.Row="1" Grid.Column="0" Padding="0,0,5,0" Text="Description:"/>
        <TextBlock Grid.Row="1" Grid.Column="1" Text="{Binding Path=Description}"/>
        <TextBlock Grid.Row="2" Grid.Column="0" Padding="0,0,5,0" Text="Priority:"/>
        <TextBlock Grid.Row="2" Grid.Column="1" Text="{Binding Path=Priority}"/>
      </Grid>
    </Border>  
  </DataTemplate>
</Window.Resources>


...


<!-- UI -->
<DockPanel>
  <!-- Title -->
  <Label DockPanel.Dock="Top" FontSize="18" Margin="5" Content="My Task List:"/>

  <!-- Data template is specified by the ItemTemplate attribute -->
  <ListBox 
    ItemsSource="{Binding}" 
    ItemTemplate="{StaticResource myTaskTemplate}" 
    HorizontalContentAlignment="Stretch" 
    IsSynchronizedWithCurrentItem="True" 
    Margin="5,0,5,5" />

</DockPanel>


...


</Window>

Introduction to XAML

XAML stands for Extensible Application Markup Language. Its a simple language based on XML to create and initialize .NET objects with hierarchical relations. Altough it was originally invented for WPF it can by used to create any kind of object trees.
Today XAML is used to create user interfaces in WPF, Silverlight, declare workflows in WF and for electronic paper in the XPS standard.
All classes in WPF have parameterless constructors and make excessive usage of properties. That is done to make it perfectly fit for XML languages like XAML.

Advantages of XAML

All you can do in XAML can also be done in code. XAML ist just another way to create and initialize objects. You can use WPF without using XAML. It's up to you if you want to declare it in XAML or write it in code. Declare your UI in XAML has some advantages:
  • XAML code is short and clear to read
  • Separation of designer code and logic
  • Graphical design tools like Expression Blend require XAML as source.
  • The separation of XAML and UI logic allows it to clearly separate the roles of designer and developer.

XAML vs. Code

As an example we build a simple StackPanel with a textblock and a button in XAML and compare it to the same code in C#.
 
<StackPanel>
    <TextBlock Margin="20">Welcome to the World of XAML</TextBlock>
    <Button Margin="10" HorizontalAlignment="Right">OK</Button>
</StackPanel>
 
 
The same expressed in C# will look like this:
 
// Create the StackPanel
StackPanel stackPanel = new StackPanel();
this.Content = stackPanel;
 
// Create the TextBlock
TextBlock textBlock = new TextBlock();
textBlock.Margin = new Thickness(10);
textBlock.Text = "Welcome to the World of XAML";
stackPanel.Children.Add(textBlock);
 
// Create the Button
Button button = new Button();
button.Margin= new Thickness(20);
button.Content = "OK";
stackPanel.Children.Add(button);
 
 
As you can see is the XAML version much shorter and clearer to read. And that's the power of XAMLs expressiveness.

Properties as Elements

Properties are normally written inline as known from XML <Button Content="OK" />. But what if we want to put a more complex object as content like an image that has properties itself or maybe a whole grid panel? To do that we can use the property element syntax. This allows us to extract the property as an own child element.
 
<Button>
  <Button.Content>
     <Image Source="Images/OK.png" Width="50" Height="50" />
  </Button.Content>
</Button>
 
 

Implicit Type conversion

A very powerful construct of WPF are implicit type converters. They do their work silently in the background. When you declare a BorderBrush, the word "Blue" is only a string. The implicit BrushConverter makes aSystem.Windows.Media.Brushes.Blue out of it. The same regards to the border thickness that is beeing converted implicit into a Thickness object. WPF includes a lot of type converters for built-in classes, but you can also write type converters for your own classses.
 
<Border BorderBrush="Blue" BorderThickness="0,10">
</Border>
 
 

Markup Extensions

Markup extensions are dynamic placeholders for attribute values in XAML. They resolve the value of a property at runtime. Markup extensions are surrouded by curly braces (Example: Background="{StaticResource NormalBackgroundBrush}"). WPF has some built-in markup extensions, but you can write your own, by deriving fromMarkupExtension. These are the built-in markup extensions:

Namespace

At the beginning of every XAML file you need to include two namespaces.  The first is http://schemas.microsoft.com/winfx/2006/xaml/presentation. It is mapped to all wpf controls inSystem.Windows.Controls The second is http://schemas.microsoft.com/winfx/2006/xaml it is mapped to System.Windows.Markup that defines the XAML keywords. The mapping between an XML namespace and a CLR namespace is done by the XmlnsDefinition attribute at assembly level. You can also directly include a CLR namespace in XAML by using the clr-namespace: prefix.

WPF Calendar Control

Set the displayed date

The calendar displays by default the current date. But you can specify any other date to be displayed by setting theDisplayDate property.
 
<Calendar DisplayDate="01.01.2010" />
 
 

Selection Modes

The calendar control provides multiple modes for selection. You can set the SelectionMode property toSingleDateSingleRangeMultipleRanges or None.
 
<Calendar SelectionMode="MultipleRange" />
 
 

Blackout dates

The calendar control provides a feature to black out dates that are not valid for selection. You can define multiple ranges by setting the BlackoutDates property to one or multiple CalendarDateRange.
 
<Calendar SelectionMode="{Binding SelectedItem, ElementName=selectionmode}" >
    <Calendar.BlackoutDates>
        <CalendarDateRange Start="01/01/2010" End="01/06/2010" />
        <CalendarDateRange Start="05/01/2010" End="05/03/2010" />
    </Calendar.BlackoutDates>
</Calendar>
 
 

Calendar Modes

The calendar supports three modes to display ranges of dates: YearMonth and Decade. You can control the mode by setting the DisplayMode property.
 
<Calendar DisplayMode="Year" />

2011/11/08

How to get screen size like height and width

<Script language = JavaScript>

             UserWidth = window.screen.width
             UserHeight = window.screen.height
             UserWidth = "Screen Width = " + UserWidth
             UserHeight = " Screen Height = " + UserHeight
             alert(UserWidth + UserHeight)
</Script>

Create a back button on a page

<script type="text/javascript">
function goBack()
  {
  window.history.back()
  }
</script>

<input type="button" value="Back" onclick="goBack()" />

2011/11/07

Create Setup of Simple Web Application


Introduction

I noticed that there are several articles on using Web Setup projects, but no articles could be found for WindowSetup projects. So I decided to share what I know about the VS WindowsSetup Projects. I will be using the RunOnlyOnceCS.exe demo app I created for another CodeProject article, as the application we are creating the setup for.

Background

Sooner or later, you need to create a setup project for an application. Personally, I am not a big fan of this type of distribution for an application. Still it has its uses. Using a setup project can be a good solution for a Windowapplication that has many dependencies on other assemblies / DLLs. The setup will figure out what the dependencies are for the application and automatically include them.
Note: This does not include the .NET framework.

Creating a Setup Project

This article is going to rely on screen prints since there really isn�t any code for this. The output will be a *.msi file that will install the application file(s), and add a shortcut to the desktop and to the Programs menu.
Note: if the user does not have admin rights to their box, they will not be able to run the MSI script or install new applications on their box.

After you have created a new setup project, the first thing you will want to do is change theProductName property on the setup project to match the application you are creating the setup for. I would also suggest changing the RemovePreviousVersion property to true. This is helpful when you want to release your next version of your app through this setup project.

Next, click on the "Application folder", then right click, and click on Add/File. At this point, you will be able to add the Exe you are trying to create the setup for.
Note: if you make changes to the Exe, you will need to re-compile the setup project as well. It might be a good choice to add a setup project to your Windows project solution. Then you can choose the project output option instead of the file.
Note: if you know what a merge module is and want to add one to the setup project, you need to right click on the setup project and click Add Merge Module.
Note: you must also add any config or icon files you may need for this solution, here:

Next, I always set the Always Create for the Program Directory to true. This is done by clicking on the "Application Folder" and then going to the properties.
Note: the DefaultLocation property will always be: [ProgramFilesFolder] [Manufacturer]\[ProductName]. If you want it to be something else, this is where to change it. Notice that the solution explorer has recognized the dependency or need for the .NET Framework for this appto run.
Note: this does not mean that the setup will install the .NET re-distributable framework. That is its own setup. The setup file is around 24 MB in size and can be downloaded from here.
Note: the setup can not install a .NET application without the .NET Framework already installed.

Next, we want to create a shortcut to our application on the desktop. First, click on the "User's desktop" folder. Then right click and click on "Create New Shortcut".

Next, you will see a dialog box to choose the application you want to create a shortcut to. Go to "Application folder" and add the exe you added in the previous step.

If you click on the "User's desktop" and go to the Properties window, you will see some options. Something I normally add to the shortcut is a check to see if it already exists. This is an example of what little coding you can do in a setup project. I have turned on AlwaysCreateon the shortcut property. In doing this, I need to have a condition or I will multiply my desktop shortcuts with every new release. So I set the Transitive property to True and I set the condition to FILEEXISTS1<>"Shortcut to RunOnceOnlyCS.exe", where what is in the "" needs to match the name of the shortcut.

Note: if you want your shortcut to have your application's icon, you need to add your icon file to the "Application folder". Next, click on the shortcut you just created in your "User's desktop". There is an icon property. Click the down arrow to get the dialog box. Navigate to the "Application folder" and select the icon file you just added.
Next, if you want to create a shortcut in the Start/All Programs menu, it is very similar to creating a shortcut on the "User's desktop". First, click on the "User's programs menu", then right click and add a folder. Name the folder the same as whatever your company or manufacturer name would be. Then, click on that newly created folder and add a shortcut just like we did in the step above.

Finally, when you need to create a new setup for the next release of your application, you need to go to the setup project properties and change the version before you re-compile thesetup project.

Once you click off the version property, you will get a prompt to update the GUID for the ProductCode.
Note: if you do not click the Yes button in the dialog, you must manually get a new GUID for the ProductCode for the setup to properly remove the old program and install the new program.

Note Do Not: change the UpgradeCode GUID. If you do, the user will have to uninstall the old program manually before the new version can be installed.