Pages

Monday, May 9, 2011

Free Open Source Rich-text editors List

Free Open Source Rich-text editors List

Rich-text editors are web components that allow users to edit and enter text within a web browser.
Its allows you to format the text .Following are the list of open source html editors .

Tinymce

Its a Javascript WYSIWYG Editor and Open Source under LGPL by Moxiecode Systems AB.It is a easy to integrate , custimizable and lightweight .


Following is the example of the tinymce editor :-

Example :-



Download
Demo



FCK Editor

FCKeditor has been around for more than six years. Since 2003 it has built a strong user community becoming the most used editor in the market, accumulating more than 3,5 million downloads.
In 2009, it renamed to the editor CKEditor, bringing to light the next generation of our software: CKEditor 3.0.

Because CKEditor is licensed under flexible Open Source and commercial licenses, you'll be able to integrate and use it inside any kind of application.
This is the ideal editor for developers, created to provide easy and powerful solutions to their users.
Editor with all features
- Interface color
- Multi-language interface
- Custom toolbar
- Skins

Example :-




Download
Demo


FreeTextBox HTML Editor

The free version of FreeTextBox enables users to do basic HTML editing in a WYSIWYG environment with a look and feel similar to desktop products.
It is the  popular free ASP.NET WYSIWYG rich HTML editor

Browser Support

    IE 6,7,8,9
    Firefox 1+
    Google Chrome 1+
    Apple Safari 3,4,5
    Opera 7,8,9,10

Example :-


Demo
Download

Related Other posts Html Code in Blodspot Radiobuttonlist Example Image In Datalist Database backup in sql Server CheckboxList example Datetime format in gridview

Thursday, May 5, 2011

Bind Image In Datalist Control In Asp.net c#

Bind Image In Datalist Control In Asp.net c#

Introduction :-
I have used the dataList asp control to display images and images are stored in application directory .
I have written the html code as well as the code behind code to bind the images in datakist control in c# .
The itemTemplate of dataList is used to display images of product .

Display of Images :-


HTML Code of Datalist :-

<asp:DataList ID="dlImages" runat="server" RepeatDirection="Horizontal" RepeatColumns="2" BackColor="#CCCCCC" BorderColor="#999999" BorderStyle="Solid" BorderWidth="3px"
CellPadding="4" CellSpacing="2" ForeColor="Black" GridLines="Both">
<FooterStyle BackColor="#CCCCCC" />
<ItemTemplate>
    <table  style="font-family:Courier New;border-style:dotted;border-width:thick" >
        <tr>
            <td align="right">Product Name :-</td>
            <td><asp:Label ID="lblName" Text='<%# Eval("Name") %>' runat="server"></asp:Label></td>
        </tr>
        <tr>
            <td valign="top">Product Image :-</td>
            <td><asp:Image ID="imageProduct" Width="150" Height="150" ImageUrl='<%# Eval("ImagePath") %>' runat="server" /></td>
        </tr>
    </table>
</ItemTemplate>
<ItemStyle BackColor="White" />
<SeparatorStyle Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False"
    Font-Underline="False" />
<SelectedItemStyle BackColor="#000099" Font-Bold="True" ForeColor="White" />
<HeaderStyle BackColor="Black" Font-Bold="True" ForeColor="White" />
</asp:DataList>


c# Code for Bind Image Datalist :

protected void Page_Load(object sender, EventArgs e) {
         if (!IsPostBack)
        {
            dlImages.DataSource = DataBindInDataLIST();
            dlImages.DataBind();
        }
    }
    public DataTable DataBindInDataLIST()
    {
        //--Decalration Of Data Table ---//
        DataTable Dt = new DataTable();
        //--Decalration Of Data Column-----//
        DataColumn DCID = new DataColumn("Name", typeof(String));
        DataColumn DCName = new DataColumn("ImagePath", typeof(String));
        //-- Add Data Column to DataTable --//
        Dt.Columns.Add(DCID);
        Dt.Columns.Add(DCName);
        //-- Add Data Rows to DataTable --//
        DataRow Dr1 = Dt.NewRow();
        Dr1["ImagePath"] = "~\\ProductImage\\Blue hills.jpg";
        Dr1["Name"] = "Blue hills";

        DataRow Dr2 = Dt.NewRow();
        Dr2["ImagePath"] = "ProductImage\\Sunset.jpg";
        Dr2["Name"] = "Sunset";
        DataRow Dr3 = Dt.NewRow();
        Dr3["ImagePath"] = "ProductImage\\Water lilies.jpg";
        Dr3["Name"] = "Water lilies";
        DataRow Dr4 = Dt.NewRow();
        Dr4["ImagePath"] = "ProductImage\\Winter.jpg";
        Dr4["Name"] = "Winter";   
        Dt.Rows.Add(Dr1);
        Dt.Rows.Add(Dr2);
        Dt.Rows.Add(Dr3);
        Dt.Rows.Add(Dr4);
        return Dt;
    }

I hope this article will help You .

Related Other posts

Fetch Highest second Record In SQL Server

Fetch Highest second Record In SQL Server.

Introduction : In this article i will show you how to fetch second highest salary record in sql server database .Here you can fetch entire second highest row from the table in sql server .To achieve the highest record i have used Row_number().

Example :  Following is example which fetch second highest salary record from the table in sql server .

Select * from ( select  Row_number() over (  order by salary desc ) as Row_INDEX , * From Data ) as Temp where Row_INDEX = 2



Related Other posts

To take back up of database In Sql Server

To take back up of database In SQL Server Database .


Follow the steps :

I have explained how to take back up of database using SQL Server Management Studio .

1. Fisrt Connect to the appropriate SQL Server Database Engine .

2. Expand Databases and select the databse which you want to take a back up  .
3. Rigth Click On Database and Go to the Task Option and In task Option Click on the Back Up option .
4.After then One dialog box will open then Add the destination file path where you want to save the back up file .
5.Click on the add button for the destination path .
6.One Dialog Box will open then choose the destination path and give the file name with .bak extension ,Like TestBaup.bak .
7.Finally you need click on OK Button .


8.Once back Up of database complete , One message will prompt that "The backup of database 'DatabaseName' completed successfully .

Wednesday, May 4, 2011

Checking All CheckBoxes in a GridView By JavaScript


Checking All CheckBoxes in a GridView 

In the code you can  checking All CheckBoxes in a GridView follwing is the image of interface .


Using the Client Side Javascript checking the header checkbox would check all checkboxes in the GridView and after unchecking the
header checkbox would uncheck all checkboxes in the GridView .


Copy the following javascript code and put it inside the head tag .

Javascript Code for ASP.Net GridView Check All Checkbox

<script type="text/javascript">
  function chkAllCheckbox(obj) {
            var gv = document.getElementById('<%=GVMain.ClientID %>');
                for (var i = 0; i < gv.all.length; i++) {
                     var node = gv.all[i];
                     node.checked = obj.checked;               
                   }          
              }
 </script>

HTML Code for ASP.Net GridView Check All Checkbox

<asp:GridView ID="GVMain" runat="server" AutoGenerateColumns="False" BackColor="White"
            BorderColor="#CCCCCC" BorderStyle="None" BorderWidth="1px" CellPadding="3">
            <RowStyle ForeColor="#000066" />
            <Columns>
                <asp:TemplateField HeaderText="Select All">
                    <HeaderTemplate>
                        <asp:CheckBox ID="chkSelectAll" onClick="javascript:chkAllCheckbox(this);" Text="Select All" runat="server" />
                    </HeaderTemplate>
                    <ItemTemplate>
                        <asp:CheckBox ID="chkSelect" runat="server" />
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="ID">
                    <ItemTemplate>
                        <asp:Label ID="lblID" Text='<%# Eval("ID") %>' runat="server"></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Name">
                    <ItemTemplate>
                        <asp:Label ID="lblName" Text='<%# Eval("Name") %>' runat="server"></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>
            </Columns>
            <FooterStyle BackColor="White" ForeColor="#000066" />
            <PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Left" />
            <SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />
            <HeaderStyle BackColor="#006699" Font-Bold="True" ForeColor="White" />
        </asp:GridView>


Related Other posts

Nested gridview In Asp.net

Nested Gridview In Asp.net C# with toggle  

Introduction : This article describe you how add nested gridview in asp.net . Many times we require to add nested gridview .

Nested Gridview Code : I have written the html code and code behind code for binding the nested gridview .which is shown below .It is very easy to implement nested gridview in your application just you need to add it and change the connection string and query as per you requirement . I have added the toggle for nested gridview too.its toggle using javascript code.
Html code nested gridview :
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="NestedGridview.aspx.cs" Inherits="HamidSite.NestedGridview" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript" language="javascript">
        function toggle(toggeldivid, toggeltext) {                    
            var divelement = document.getElementById(toggeldivid);
            var lbltext = document.getElementById(toggeltext);
            if (divelement.style.display == "block")
             {
                divelement.style.display = "none";              
                lbltext.innerHTML = "+ Show Orders";
            }
            else {
                divelement.style.display = "block";                
                lbltext.innerHTML = "- Hide Orders";
            }
        }
</script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:GridView ID="GVMain" runat="server" AutoGenerateColumns="False" BackColor="#DEBA84"
            BorderColor="#DEBA84" BorderStyle="Double" BorderWidth="3px" CellPadding="5" 
            OnRowDataBound="GVMain_RowDataBound" CellSpacing="2">
            <RowStyle ForeColor="#8C4510" BackColor="#FFF7E7" />
            <Columns>
                <asp:TemplateField HeaderText="ID">
                    <ItemTemplate>
                        <asp:Label ID="lblID" Text='<%# Eval("CustomerID") %>' runat="server"></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Customer Name">
                    <ItemTemplate>
                        <asp:Label ID="lblName" Text='<%# Eval("CustomerName") %>' runat="server"></asp:Label>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Orders">
                    <ItemTemplate>
                        <asp:Label ID="lbltoggel" runat="server" >+ Hide Orders</asp:Label>
                        <asp:Label ID="lblCustomerID" Visible="false" Text='<%# Eval("CustomerID") %>' runat="server"></asp:Label>
                        <asp:GridView ID="GVChild" style="display:block" runat="server" AutoGenerateColumns="False" BackColor="White"
                            BorderColor="#E7E7FF" BorderStyle="Solid" BorderWidth="1px" CellPadding="5" GridLines="Horizontal">
                            <RowStyle BackColor="#E7E7FF" ForeColor="#4A3C8C" />
                            <Columns>
                                <asp:TemplateField HeaderText="Order No">
                                    <ItemTemplate>
                                        <asp:Label ID="lblOrderID" Text='<%# Eval("Orderid") %>' runat="server"></asp:Label>
                                    </ItemTemplate>
                                </asp:TemplateField>
                                <asp:TemplateField HeaderText="Description">
                                    <ItemTemplate>
                                        <asp:Label ID="lblTotal" Text='<%# Eval("description") %>' runat="server"></asp:Label>
                                    </ItemTemplate>
                                </asp:TemplateField>
                            </Columns>
                            <FooterStyle BackColor="#B5C7DE" ForeColor="#4A3C8C" />
                            <PagerStyle BackColor="#E7E7FF" ForeColor="#4A3C8C" HorizontalAlign="Right" />
                            <SelectedRowStyle BackColor="#738A9C" Font-Bold="True" ForeColor="#F7F7F7" />
                            <HeaderStyle BackColor="#4A3C8C" Font-Bold="True" ForeColor="#F7F7F7" />
                            <AlternatingRowStyle BackColor="#F7F7F7" />
                        </asp:GridView>
                    </ItemTemplate>
                </asp:TemplateField>
            </Columns>
            <FooterStyle BackColor="#F7DFB5" ForeColor="#8C4510" />
            <PagerStyle ForeColor="#8C4510" HorizontalAlign="Center" />
            <SelectedRowStyle BackColor="#738A9C" Font-Bold="True" ForeColor="White" />
            <HeaderStyle BackColor="#A55129" Font-Bold="True" ForeColor="White" />
            <SortedAscendingCellStyle BackColor="#FFF1D4" />
            <SortedAscendingHeaderStyle BackColor="#B95C30" />
            <SortedDescendingCellStyle BackColor="#F1E5CE" />
            <SortedDescendingHeaderStyle BackColor="#93451F" />
        </asp:GridView>
    </div>
    </form>
</body>
</html>

Code Behind Code :
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Data.SqlClient;

namespace HamidSite
{
    public partial class NestedGridview : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                bindGridview();
            }
        }
        private void bindGridview()
        {
            try
            {
                DataSet Ds = GetDataSet("Select * from Customers");
                GVMain.DataSource = Ds;                // Set DataSource Here
                GVMain.DataBind();
            }
            catch (Exception) { }
        }
        private void bindChildGridview(int customerId, GridView ChildGridview)
        {
            try
            {
                DataSet Ds = GetDataSet("Select * from CustomerOrder where customerid = "+customerId);
                ChildGridview.DataSource = Ds;                // Set DataSource Here
                ChildGridview.DataBind();
            }
            catch (Exception) { }
        }
        private DataSet GetDataSet(string Query)
        {
            DataSet Ds = new DataSet();
            try
            {
                string strCon = @"Data Source=ServerName;Initial Catalog=Test;Integrated Security=True;";  //Conntection String
                SqlConnection Con = new SqlConnection(strCon);
                SqlDataAdapter Da = new SqlDataAdapter(Query, Con);
                Da.Fill(Ds);
            }
            catch (Exception) { }
            return Ds;
        }
        protected void GVMain_RowDataBound(object sender, GridViewRowEventArgs e)
        {
            if (e.Row.RowType == DataControlRowType.DataRow)
            {
                Label lblCustomerID = (Label)e.Row.FindControl("lblCustomerID");
                Label lbltoggel = (Label)e.Row.FindControl("lbltoggel");
                
                GridView GvChild = (GridView)e.Row.FindControl("GVChild");
                bindChildGridview(Convert.ToInt32(lblCustomerID.Text), GvChild); //Bind the child gridvie here ..

                lbltoggel.Attributes.Add("onClick", "toggle('" + GvChild.ClientID + "' ,'"+lbltoggel.ClientID+"');");
            }
        }
    }
}
Happy Codding ...

Related Other posts

Create a DataTable Dynamically In C# .

Create a DataTable Dynamically In C# .

Introduction : In this article i will show you how to create DataTable Dynamically in c# .Many times we require to create a DataTable Dynamically in our code .It is very easy you just need to declare all the DataColumn and need to add in Datatable.

Dynamic DataTable code in c# :

//--Decalration Of Data Table ---//
DataTable Dt = new DataTable();

//--Decalration Of Data Column-----//
DataColumn DCID = new DataColumn("ID", typeof(Int32));
DataColumn DCName = new DataColumn("Name", typeof(String));
DataColumn DCCustomerID = new DataColumn("CustomerID", typeof(Int32));

//-- Add Data Column to DataTable --//
Dt.Columns.Add(DCID);
Dt.Columns.Add(DCName);
Dt.Columns.Add(DCCustomerID);


//-- Add Data Rows to DataTable --//
DataRow Dr1 = Dt.NewRow();
Dr1["ID"] = 1;
Dr1["Name"] = "Hamid Seta";
Dr1["CustomerID"] = 1;

DataRow Dr2 = Dt.NewRow();
Dr2["ID"] = 2;
Dr2["Name"] = "Ankur Shah";
Dr2["CustomerID"] = 2;

Dt.Rows.Add(Dr1);
Dt.Rows.Add(Dr2);



Related Other posts