ASP.net Interfaces

clock June 1, 2008 22:11 by author Nazar Rizvi

I was going through interfaces in ASP.net and I foung this article named 'Understanding Interfaces and Their Usefulness' by Tim Stall.

You can get to it at: http://aspnet.4guysfromrolla.com/articles/110304-1.aspx

Couple of the examples provided would help anyone kick off... 

Currently rated 5.0 by 1 people

  • Currently 5/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5


ASP.net AJAX Text Editor

clock November 15, 2007 18:27 by author Nazar Rizvi

I have been using the FCK Text Editor for almost 2 years, and finally codeplex have come out with a new ASP.NET AJAX Rich Text Editor.

Featurewise it has all the funtionality of FCKeditor; I think tha performance it not upto the previous one, but who cares the AJAX makes it all the more usable.

And it also supports multiple languages. Here is the code plex link.

Currently rated 4.0 by 8 people

  • Currently 4/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5


Image Slideshow with fading effect

clock November 8, 2007 03:05 by author Nazar Rizvi

I have been trying to use the slideshow control so that the images fade in and fade out. I tried searching various forums out there but there is no actual solution for it. Undecided 

Finally I added up few AJAX animation effects to the slideshow container which would give you the desired effect.

NOTE: This is sort of an hack where in you have to manually time the fading in and out effects and the slideshow timing.

Also since this is continuous javascript this might put a little bit load on the user's browser.

Below is my code:

<script runat="Server" type="text/C#">

[System.Web.Services.WebMethod]

[System.Web.Script.Services.ScriptMethod]

public static AjaxControlToolkit.Slide[] GetSlides()

{

return new AjaxControlToolkit.Slide[] {

new AjaxControlToolkit.Slide("images/Autumn Leaves.jpg", "", ""),

new AjaxControlToolkit.Slide("images/Creek.jpg", "", ""),

new AjaxControlToolkit.Slide("images/Dock.jpg", "", ""),

new AjaxControlToolkit.Slide("images/Forest.jpg", "", "")};

}

</script>

<div>

<asp:Image ID="Image1" runat="server" Width="800px" Style="border: 1px solid black;

width: auto" ImageUrl="images/Creek.jpg" AlternateText="ME" /><br />

</div>

<cc1:SlideShowExtender ID="slideshowextend1" runat="server" TargetControlID="Image1"

SlideShowServiceMethod="GetSlides" AutoPlay="true" ImageTitleLabelID="imageTitle"

ImageDescriptionLabelID="imageDescription" PlayInterval="7000" Loop="true" />

<cc1:AnimationExtender ID="MyExtender" runat="server" TargetControlID="Image1">

<Animations>

<OnLoad>

<Sequence iterations="0">

<FadeIn Duration="10.0" Fps="5" />

<FadeOut Duration="10.0" Fps="5" />

</Sequence>

</OnLoad>

</Animations>

</cc1:AnimationExtender>

Currently rated 4.8 by 5 people

  • Currently 4.8/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5


Two rows of tab headers in TabContainer in Ajax Control Toolkit

clock October 5, 2007 03:27 by author Nazar Rizvi

I had this issue where I wanted more than one row of headers in the TabContainer as I had a large number of panels and was not able to fit them in the page.

Here is the solution. [make sure you download the toolkit with source]

Open the AJAX Control Toolkit's solution by clicking on the solution file inside the toolkit folder.  

Open the file Tabs.css under AjaxControlToolkit/Tabs/Tabs.css

And make the following changes.

/* default layout */.ajax__tab_default .ajax__tab_header {}
.ajax__tab_default .ajax__tab_outer {display:-moz-inline-box;display:inline-block}
.ajax__tab_default .ajax__tab_inner {display:-moz-inline-box;display:inline-block}
.ajax__tab_default .ajax__tab_tab {margin-right:4px;overflow:hidden;text-align:center;cursor:pointer;display:-moz-inline-box;display:inline-block}

Now click on Build -> Build Solution to build the solution.


Use the AjaxControlToolkit.dll under ToolkitTests/Bin folder as your reference from now on.


Add this dll file as reference to your current website and you should have the 2 rows.


 

 

Currently rated 4.4 by 10 people

  • Currently 4.400001/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5


Special GridView

clock October 4, 2007 02:28 by author Nazar Rizvi

I have been going through the ASP.net forums and many people have had issues with GridViews especially the situation where the user wants to group each row by a particular condition.

There are controls available in the market which solve the issue (only sad part is we need to buy them).

I have used up 2 GridViews and AJAX Control Toolkit's accordion to achieve the required result. I have not done any back-end code, so this enables even a novice developer to create this page. Also I am using the NorthWind database provided by Microsoft.

 

Working Link

Download the source-code

Screenshot:

Code:

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="CategoryID"                
DataSourceID="getCategories">                
<Columns>                    
<asp:TemplateField HeaderText="CategoryName" SortExpression="CategoryName">                        
<ItemTemplate>                            
<asp:Label Visible="false" ID="labelCategoryID" runat="server" Text='<%# Bind("CategoryID") %>'></asp:Label>                           
<cc1:Accordion ID="MyAccordion" runat="server" SelectedIndex="-1" HeaderCssClass="accordionHeader"                                
ContentCssClass="accordionContent" FadeTransitions="true" FramesPerSecond="30"                                
TransitionDuration="250" Width="500px" AutoSize="None" RequireOpenedPane="false"                                
SuppressHeaderPostbacks="true">                                
<Panes>                                    
<cc1:AccordionPane ID="pane1" runat="server">                                        
<Header>                                            
<asp:DataList ID="DataList2" runat="server" DataSourceID="getNamefromID">                                                
<ItemTemplate>                                                    
<asp:HyperLink NavigateUrl="~/Default.aspx" runat="server" Text='<%# Eval("CategoryName") %>'></asp:HyperLink>                                                
</ItemTemplate>                                           
</asp:DataList>                                        
</Header>                                        
<Content>                                            
<asp:GridView CellPadding="4" ForeColor="#333333" GridLines="None" ID="GridView2"                                                
runat="server" AutoGenerateColumns="False" DataKeyNames="ProductID" DataSourceID="getProducts">                                                
<FooterStyle BackColor="#1C5E55" Font-Bold="True" ForeColor="White" />                                                
<RowStyle BackColor="#E3EAEB" />                                                
<PagerStyle BackColor="#666666" ForeColor="White" HorizontalAlign="Center" />                                                
<SelectedRowStyle BackColor="#C5BBAF" Font-Bold="True" ForeColor="#333333" />                                                
<HeaderStyle BackColor="#1C5E55" Font-Bold="True" ForeColor="White" />                                                
<EditRowStyle BackColor="#7C6F57" />                                                
<AlternatingRowStyle BackColor="White" />                                                
<Columns>                                                    
<asp:BoundField DataField="ProductID" HeaderText="ProductID" InsertVisible="False"                                                        
ReadOnly="True" SortExpression="ProductID" />                                                    
<asp:BoundField DataField="ProductName" HeaderText="ProductName" SortExpression="ProductName" />                                                    
<asp:BoundField DataField="SupplierID" HeaderText="SupplierID" SortExpression="SupplierID" />                                                    
<asp:BoundField DataField="QuantityPerUnit" HeaderText="QuantityPerUnit" SortExpression="QuantityPerUnit" />                                                
</Columns>                                            
</asp:GridView>                                        
</Content>                                    
</cc1:AccordionPane>                                
</Panes>                            
</cc1:Accordion>                            
<asp:AccessDataSource ID="getNamefromID" runat="server" DataFile="~/App_Data/Nwind.mdb"                                
SelectCommand="SELECT [CategoryName],[CategoryID] FROM [Categories] WHERE ([CategoryID] = ?)">                                
<SelectParameters>                                    
<asp:ControlParameter ControlID="labelCategoryID" Name="CategoryID" PropertyName="Text"                                       
 Type="Int32" />                                
</SelectParameters>                            
</asp:AccessDataSource>                            
<asp:AccessDataSource ID="getProducts" runat="server" DataFile="~/App_Data/Nwind.mdb"                                
SelectCommand="SELECT [ProductID], [ProductName], [SupplierID], [QuantityPerUnit] FROM [Products] WHERE ([CategoryID] = ?)">                                
<SelectParameters>                                    
<asp:ControlParameter ControlID="labelCategoryID" Name="CategoryID" PropertyName="Text"                                        
Type="Int32" />                                
</SelectParameters>                            
</asp:AccessDataSource>                        
</ItemTemplate>                    
</asp:TemplateField>                
</Columns>            
</asp:GridView>            
<asp:AccessDataSource ID="getCategories" runat="server" DataFile="~/App_Data/Nwind.mdb"                
SelectCommand="SELECT [CategoryName], [CategoryID] FROM [Categories]"></asp:AccessDataSource>

 

Currently rated 5.0 by 6 people

  • Currently 5/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5


Editing all the rows in a GridView (Bulk edit)

clock October 3, 2007 15:26 by author Nazar Rizvi

I was trying to find a solution which did bulk updating for all the rows in a gridview, as the gridview provided by VS2005 had its usability issue (at least that's what I thought). After doing some googling I found a set of different grid views available at codeplex called 'ASP.NET Real World Controls'.

Its got a BulkEditGridView, FrozenGridView, GroupingGridView, InlineInsertGridView and TwoHeadedGridView. You can get a hold of the .dll file from http://www.codeplex.com/ASPNetRealWorldContr.
Here is an example of bulk edit grid view.

<cc1:BulkEditGridView ID="BulkEditGridView1" runat="server" AutoGenerateColumns="False"            

DataKeyNames="CategoryID" DataSourceID="AccessDataSource1" EnableInsert="False"            

InsertRowCount="1" SaveButtonID="Button1" AllowPaging="True" BackColor="LightGoldenrodYellow" BorderColor="Tan" BorderWidth="1px" CellPadding="2" ForeColor="Black" GridLines="None" Width="502px"><Columns>

<asp:BoundField ReadOnly="True" DataField="CategoryID" InsertVisible="False" SortExpression="CategoryID" HeaderText="CategoryID"></asp:BoundField>

<asp:BoundField DataField="CategoryName" SortExpression="CategoryName" HeaderText="CategoryName"></asp:BoundField>

<asp:BoundField DataField="Description" SortExpression="Description" HeaderText="Description"></asp:BoundField>

</Columns>            

<FooterStyle BackColor="Tan" />            

<SelectedRowStyle BackColor="DarkSlateBlue" ForeColor="GhostWhite" />            

<PagerStyle BackColor="PaleGoldenrod" ForeColor="DarkSlateBlue" HorizontalAlign="Center" />            

<HeaderStyle BackColor="Tan" Font-Bold="True" />            

<AlternatingRowStyle BackColor="PaleGoldenrod" /> </cc1:BulkEditGridView>        

<asp:AccessDataSource ID="AccessDataSource1" runat="server" DataFile="~/App_Data/Nwind.mdb"            

DeleteCommand="DELETE FROM [Categories] WHERE [CategoryID] = ?" InsertCommand="INSERT INTO [Categories] ([CategoryID], [CategoryName], [Description]) VALUES (?, ?, ?)"             SelectCommand="SELECT [CategoryID], [CategoryName], [Description] FROM [Categories]"            

UpdateCommand="UPDATE [Categories] SET [CategoryName] = ?, [Description] = ? WHERE [CategoryID] = ?">             <DeleteParameters>                 <asp:Parameter Name="CategoryID" Type="Int32" />             </DeleteParameters>            

<UpdateParameters>                 <asp:Parameter Name="CategoryName" Type="String" />                

<asp:Parameter Name="Description" Type="String" />                 <asp:Parameter Name="CategoryID" Type="Int32" />            

 </UpdateParameters>             <InsertParameters>                 <asp:Parameter Name="CategoryID" Type="Int32" />      

           <asp:Parameter Name="CategoryName" Type="String" />                 <asp:Parameter Name="Description" Type="String" />             </InsertParameters>         </asp:AccessDataSource>         <asp:Button ID="Button1" runat="server" Text="Update" Width="200px" />

 


You just need to make sure that you changed the SaveButtonID property to the button's ID.


 

Currently rated 3.0 by 1 people

  • Currently 3/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5


Search

Calendar

<<  November 2008  >>
SuMoTuWeThFrSa
2627282930311
2345678
9101112131415
16171819202122
23242526272829
30123456

Archive

Tags

    Categories


    Disclaimer

    The opinions expressed herein are my own personal opinions and do not represent my employer's view in anyway.

    © Copyright 2008

    Sign in