Tuesday, 26 July 2016

Adding gridview row values using viewstate and delete the temporary rows with conformation

Step 1 : Adding the two text box and one button and gridview  like below in your page.

Step 2: Add the code in aspx page.


<%@ Page Language="C#" AutoEventWireup="true" CodeFile="CS.aspx.cs" Inherits="CS" %>

<!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>
    <style type="text/css">
        body
        {
            font-family: Arial;
            font-size: 10pt;
        }
        
    </style>
</head>
<body>
    <form id="form1" runat="server">
        <br />
        <center>

        
    <table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse">
        <tr>
            <td style="padding-bottom: 10px">
                Name:<br />
                <asp:TextBox ID="txtName" runat="server" />
            </td>
        </tr>
        <tr>
            <td style="padding-bottom: 10px">
                Country:<br />
                <asp:TextBox ID="txtCountry" runat="server" />
            </td>
        </tr>
        <tr>
            <td style="width: 100px">
                <asp:Button ID="btnAdd" runat="server" Text="Add" OnClick="Insert" />
            </td>
        </tr>
    </table>
        <br />
        <asp:GridView ID="GridView1" runat="server" CssClass="Grid" AutoGenerateColumns="False"
        EmptyDataText="No records has been added." CellPadding="4" ForeColor="#333333" GridLines="None" OnRowDeleting="OnRowDeleting" OnRowDataBound = "OnRowDataBound">
         <AlternatingRowStyle BackColor="White" />
         <Columns>
              <asp:CommandField ShowDeleteButton="True" ButtonType="Button" />
            <asp:BoundField DataField="Name" HeaderText="Name" ItemStyle-Width="120" >
<ItemStyle Width="120px"></ItemStyle>
            </asp:BoundField>
            <asp:BoundField DataField="Country" HeaderText="Country" ItemStyle-Width="120" >
<ItemStyle Width="120px"></ItemStyle>
            </asp:BoundField>
        </Columns>
                      <FooterStyle BackColor="#990000" Font-Bold="True" ForeColor="White" />
         <HeaderStyle BackColor="#990000" Font-Bold="True" ForeColor="White" />
         <PagerStyle BackColor="#FFCC66" ForeColor="#333333" HorizontalAlign="Center" />
         <RowStyle BackColor="#FFFBD6" ForeColor="#333333" />
         <SelectedRowStyle BackColor="#FFCC66" Font-Bold="True" ForeColor="Navy" />
         <SortedAscendingCellStyle BackColor="#FDF5AC" />
         <SortedAscendingHeaderStyle BackColor="#4D0000" />
         <SortedDescendingCellStyle BackColor="#FCF6C0" />
         <SortedDescendingHeaderStyle BackColor="#820000" />
                      </asp:GridView>
            </center>
    </form>
</body>
</html>

Step 2: Add the code in C#  page.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;

public partial class CS : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!this.IsPostBack)
        {
            DataTable dt = new DataTable();
            dt.Columns.AddRange(new DataColumn[2] { new DataColumn("Name"), new DataColumn("Country") });
            ViewState["jkt"] = dt;
            this.BindGrid();
        }
    }

    protected void BindGrid()
    {
        GridView1.DataSource = (DataTable)ViewState["jkt"];
        GridView1.DataBind();
    }

    protected void Insert(object sender, EventArgs e)
    {
        DataTable dt = (DataTable)ViewState["jkt"];
        dt.Rows.Add(txtName.Text.Trim(), txtCountry.Text.Trim());
        ViewState["jkt"] = dt;
        this.BindGrid();
        txtName.Text = string.Empty;
        txtCountry.Text = string.Empty;
    }
    protected void OnRowDeleting(object sender, GridViewDeleteEventArgs e)
    {
        int index = Convert.ToInt32(e.RowIndex);
        DataTable dt = ViewState["jkt"] as DataTable;
        dt.Rows[index].Delete();
        ViewState["jkt"] = dt;
        BindGrid();
    }

    protected void OnRowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.DataRow)
        {
            string item = e.Row.Cells[0].Text;
            foreach (Button button in e.Row.Cells[0].Controls.OfType<Button>())
            {
                if (button.CommandName == "Delete")
                {
                    button.Attributes["onclick"] = "if(!confirm('Do you want to delete " + item + "?')){ return false; };";
                }
            }
        }
    }
}


Step 3: Run the page .




Step 4:Enter some values .


Step 5: Delete any one row .


Step 6: Click OK.





Step 7: Download the source code the given the below link .

Monday, 25 July 2016

Email Text Box with auto suggestion multiple email using Jquery :

Step 1:  Download CSS  & Jquery  file below link -



Step 2:  Create a new empty website -

Step 3:  Add new page and copy the downloaded files in your website -

Step 4:  Add the code below  -

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <link href="css/mailtip.css" rel="stylesheet" />
    <script src="qury/jquery-1.11.3.js"></script>
    <script src="qury/jquery.mailtip.js"></script>
    <style type="text/css">
        .styletxt {
            text-transform:lowercase;
            border-bottom-width:1px;
            font-family:'Times New Roman';
            font-size:larger;
            height:20px;
            width:200px;
           
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
   
    <div class="box">
      <div><span >Enter Email Id:</span></div>
      <div>
          <asp:TextBox ID="mailtip" CssClass="styletxt" runat="server" Height="21px" Width="211px"></asp:TextBox>
    </div>
      </div>
    </div>
    <script type="text/javascript">
        $(function () {
            var info = $('.info');

            $('#mailtip').mailtip({
                onselected: function (mail) {
                    info.text('you choosed email: ' + mail)
                }
            });
        });
    </script>
       
    </form>
</body>
</html>


Step 5: Run the page  -

Step 6:  Add the code below  -

Normal text box  :

Auto suggestion email textbox :



Step 5: Download source code and all files below link -







Thursday, 7 July 2016

Auto Calculate (Sum) Bound Field Dynamic Gridview columns values and result shows Text Box or Label :

 Step 1: Add Text Box changed event in code behind page.       

 ontextchanged="TextBox1_TextChanged"
   

Step 2: Add code in your C#  page.

   protected void TextBox1_TextChanged(object sender, EventArgs e)

    {

        double total = 0;

             foreach (GridViewRow gvr in Gridview1.Rows)

        {

            TextBox tb = (TextBox)gvr.Cells[5].FindControl("Column1");

//Add column name insted of Column1 and Enter column cell index correctly.

            double sum;

            if (double.TryParse(tb.Text.Trim(), out sum))

            {

                total += sum;

            }

                   }

        totltxt.Text = total.ToString();

//You want to display label or textbox .

    }    


Step 3: Screen Shot.




    

Tuesday, 5 July 2016

Text highlighting using CSS on selection (Instead of blue color):

Step 1: Add the style in your web page head section . Its highlighted all texts.

<style type="text/css">
   
    ::selection {background:transparent; text-shadow:#000 0 0 2px;}
::-moz-selection {background:transparent; text-shadow:#000 0 0 2px;}
::-webkit-selection {background:transparent; text-shadow:#000 0 0 2px;}
::-o-selection {background:transparent; text-shadow:#000 0 0 2px;}
a object {background:#000;}
</style>

For Example:


<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">

    
    ::selection {background:transparent; text-shadow:#000 0 0 2px;}
::-moz-selection {background:transparent; text-shadow:#000 0 0 2px;}
::-webkit-selection {background:transparent; text-shadow:#000 0 0 2px;}
::-o-selection {background:transparent; text-shadow:#000 0 0 2px;}
a object {background:#000;}
        </style>
</head>
<body>
    <form id="form1" runat="server">
    <div style="text-align:left">
        

        <p>
            CSS is designed primarily to enable the separation of document content from document presentation, 
            including aspects such as the layout, colors, and fonts.[3] This separation can improve content accessibility, 
            provide more flexibility and control in the specification of presentation characteristics, enable multiple HTML pages to share 
            formatting by specifying the relevant CSS in a separate .css file, and reduce complexity and repetition in the structural content.
        </p>
        
    </div>
    </form>
</body>
</html>

Screen Shots:

Normal :



After applying CSS:





How to create a simple Hello World website in ASP.NET MVC using Razor Syntax: (Note: I am using Visual Studio 2012 ) Step 1: ...