Wednesday, 19 June 2013

JAVASCRIPT VALIDATION FOR PASSWORD COMPARISION

<html>
<script type="text/javascript">
function checkPass() {

var pass1 = document.getElementById("<%=txtpassword.ClientID %>");
var pass2 = document.getElementById("<%=txtconformpass.ClientID %>");

var message = document.getElementById('confirmMessage');

var goodColor = "#66cc66";
var badColor = "#ff6666";

if (pass1.value == pass2.value)
{
message.style.color = goodColor;
message.innerHTML = "Passwords Match!"
}
else
{
message.style.color = badColor;
message.innerHTML = "Passwords not match!"
}
} 
</script>
<body>
<form id="form1" runat="server">

<label>Password</label><asp:TextBox ID="txtpassword" runat="server"
Width="160px" TextMode="Password"></asp:TextBox>
<br /><br />
<label>Conform Password</label><asp:TextBox ID="txtconformpass" runat="server"onKeyup="checkPass()" Width="160px" TextMode="Password"></asp:TextBox>
<span id="confirmMessage" class="confirmMessage"></span>  </form> </body>
</html>

Wednesday, 24 April 2013

How to store date and time separately using datetime picker in C#


Click Add New Item --> Select Windows Form --> Click Toolbox --> Select 2 datetime pickers as
dateTimePicker1 and dateTimePicker2.

Right Click on dateTimePicker1 --> Select properties --> Select Format --> Change it to Short .
Similarly Right Click on dateTimePicker2 --> Select properties --> Select Format --> Change it to Time .

Now Add an Button(button1) and name it as Insert.

Now Double click on the button, the coding .cs page will be opened. In that for the button click event write the following code.

private void button1_Click_1(object sender, EventArgs e)
{

datevalue = Convert.ToString(dateTimePicker1.Value);

DateTime tdate = DateTime.Now;

vdate = Convert.ToDateTime(datevalue);

datevalue= vdate.ToString("yyyy-MM-dd");

string timevalue = Convert.ToString(dateTimePicker2.Value);
DateTime vtime = DateTime.Now;

vtime= Convert.ToDateTime(timevalue);

timevalue = string.Format("{0}:{1} {2}", tt.Hour, tt.Minute, tt.Hour > 12 ? "PM" : "AM");

SqlConnection con = new SqlConnection ("Data Source=.\\SQLEXPRESS; Initial Catalog=sampledb;Integrated Security=True");

con.Open();

SqlCommand cmd = new SqlCommand("INSERT INTO TABLENAME (datefield,timefield)
VALUE ('" +datevalue+"','" +timevalue+"')", con); //Create database with fields datefield,timefield

cmd.ExecuteNonQuery();

con.Close();
}

Friday, 19 April 2013

3 - Tier architecture Asp.net C#

The 3- Tier architecture consists of 3 layers.They are
Application Layer or Presentation Layer
Buisness Logic Layer(BLL) or Buisness Access Layer(BAL)
Data Access Layer(DAL)

Application Layer or Presentation Layer

This layer is for contains the UI part.Through this layer only we get the input. FOR EXAMPLE:  In the aspx page textbox , button,etc... are used for getting the input and to display or present the output.

Here i will show an example to insert the username and password using 2 text boxes and a button.Write the following in the "userinsert.aspx" page.

<asp:TextBox ID="txtusername" runat="server"></asp:TextBox>
<asp:TextBox ID="txtpassword" runat="server"></asp:TextBox>
<asp:Button ID="btninsert" runat="server">Insert</asp:Button>

Buisness Logic Layer(BLL) or Buisness Access Layer(BAL) 

This layer acts as a interface between Application layer and Data Access Layer.Here we use this layer to assign the parameters i.e, get and set and other calculations related with the data like insert data, retrieve data and validating the data.

Right click on your project web application---> select add new item ----> select class file in wizard --->give name as userBLL.CS


using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Drawing;
using System.Data;

public class userBLL

{

    userDAL DAL;
public userBLL()
{
        DAL = new userDAL(this);
}

    private string _UserName;
    private string _Password;
    

    private string _Mode;
    private string _Procedure;
  


    public string UserName    {
        get
        {
            return _UserName;
        }
        set
        {
            _UserName = value;
        }
    }

    public string Password

    {
        get
        {
            return _Password;
        }
        set
        {
           _Password = value;
        }
    }

   public string Mode

    {

        get
        {
            return _Mode;
        }
        set
        {
           _Mode = value;
        }
    }

    public string Procedure
    {
        get
        {
            return _Procedure;
        }
        set
        {
            _Procedure = value;
        }
    
    }


   public void Insert(string Connect)
    {
        DAL.Insert(Connect);
    }
  }

Data Access Layer(DAL)
This Layer contains methods or procedures to connect with database and to perform insert,update,delete,get data from database based on our input data.
Right click on your project web application---> select add new item ----> select class file in wizard --->give name as userDAL.CS

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Data;
using System.Data.SqlClient;

public class userDAL
{

    userBAL BAL;
    SqlConnection Con;
    SqlCommand cmd;

     public userDAL(userBAL BAL1)
    {
     BAL=BAL1;
    }
      public void Connection(string Conn)
    {
        Con = new SqlConnection(Conn);
        if (Con.State == ConnectionState.Closed)
        {
            Con.Open();
        }
    }
    public void Insert(string Connect)
    {
        Connection(Connect);
        cmd = new SqlCommand(BAL.Procedure, Con);
        cmd.CommandType = CommandType.StoredProcedure;
        cmd.Parameters.Add("@UserName", SqlDbType.VarChar).Value = BAL.UserName;
        cmd.Parameters.Add("@Password", SqlDbType.VarChar).Value = BAL.Password;     
        cmd.Parameters.Add("@Mode", SqlDbType.VarChar).Value = BAL.Mode;
        cmd.ExecuteNonQuery();
        Con.Close();
    }
}

Now BLL and DAL are ready.Now once again return to the application layer and write the following in the button click event of the "userinsert.aspx.cs" page.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Configuration;
using System.Data;
public partial class _Default : System.Web.UI.Page
{
string Conne = ConfigurationManager.ConnectionStrings["Connects"].ConnectionString.ToString();
    userBAL BAL = new userBAL();

  protected void Button1_Click(object sender, EventArgs e)
    {
        BAL.UserName =txtusername.Text;
        BAL.Password = txtpassword;
        BAL.Mode = "Insert"; //Stored procedure for insert
        BAL.Procedure = "SP_Tbl_userinsesrt"; //Stored procedure name 

        BAL.Insert(Conne);
    }

Thats it..3 Layers are completed.Now its ready to run....


Friday, 15 March 2013

UPLOADING AND DOWNLOADING THE PDF FILES FROM THE DATABASE


CREATE TABLE [dbo].[books]
(
[ID] [int] IDENTITY(1,1) NOT NULL,
[Pdlfiles] [varbinary](max) NULL,
[File name] [varchar](max) NULL
)

CREATE A PAGE FOR UPLOADING PDF AS addpdf.aspx AND ADD THE FOLLOWING
         <label>PDF FILE</label>
         <asp:TextBox ID="txtauthor" runat="server"></asp:TextBox>
         <br />
         <label>FILE NAME</label>
         <asp:FileUpload ID="fileupldsample" runat="server" />
         <br />
         <asp:Button ID="btnupload" runat="server" Text="Upload" onclick="btnupload_Click" />

   
IN THE  addpdf.aspx.cs PAGE  ADD THE FOLLOWING
// This namespace should be there
using System.IO;
 protected void btnupload_Click(object sender, EventArgs e)
 {
if(fileupldsample.HasFile)
{
Stream fs = default(Stream);
fs = fileupldsample.PostedFile.InputStream;
BinaryReader br = new BinaryReader(fs);
byte[] pdfbytes = br.ReadBytes(fileupldsample.PostedFile.ContentLength);
SqlCommand cmd = new SqlCommand("insert into tablename",);
}
 }

Tuesday, 12 March 2013

PASSING VALUE FROM ONE FORM TO ANOTHER USING C#


This an example of transferring a value from Form1 to Form2..

IN THE FORM1 TYPE THE FOLLOWING CODE


   public partial class Form1 : Form
    {
        public Form1()
        {

            InitializeComponent();
         }

        public static string Sno;  //Declaring a Global variable ID

    private void button1_Click(object sender, EventArgs e)
        {

         Sno = textBox1.Text;    //Type any value in the textbox and click the button
         Form2 f2 = new Form2();
         f2.Show();
        }
      }

IN THE FORM2 TYPE THE FOLLOWING CODE

  public partial class Form2 : Form
    {
        public Form2()
        {
            InitializeComponent();
         }

  private void Form2_Load(object sender, EventArgs e)
        {

          int v1 =  int.Parse(Form1.Sno);  //Getting the Sno value from Form1
          Label1.Text  = Sno.ToString();  //Displaing the Sno value got from Form1
        }
     }

Sunday, 10 March 2013

HOW TO CALCULATE COLUMN TOTAL IN DATAGRIDVIEW USING C#


// POPULATE THE DATAGRIDVIEW AND THEN INCLUDE THE FOLLOWING CODE IN ANY EVENT.HERE I AM USING IT IN A BUTTON CLICK EVENT.
private void button1_Click(object sender, EventArgs e)
{

int Total = 0;

for (int i = 0; i < dataGridView1.Rows.Count; i++)

{

Total += Convert.ToInt32(dataGridView1.Rows[i].Cells["Columnname"].Value);

}

textBox1.Text = Total.ToString();
}

Wednesday, 30 January 2013

DYNAMIC TOOLTIP FROM DATABASE TO DISPLAY IMAGE DURING MOUSEOVER IN GRIDVIEW

This will display the image and other required fields from database during the mouseover in the gridview column or row using handler(ashx).

IN THE ASPX PAGE
<html>
<head>
<%-- Java script for tooltip display--%>

<script language="javascript" type="text/javascript">
        // Declare General Variables
        var sTooTipId = 'divTooTip';
        var sToolTipPlacement = "Right"; // Right, Left

        // For Hiding tool tip
        function HideTooTipImage() {
            // Get the Div element which was created dynamically on ShowToolTipImage function
            var divTip = document.getElementById(sTooTipId);
            if (divTip) {
                while (divTip.childNodes.length > 0)
                // Remove all child content which are added inside on the Div content
                    divTip.removeChild(divTip.childNodes[0]);
            }
            // Invisible th Div (which removed all child content)
            divTip.style.visibility = "hidden";

        }

        function MoveToolTipImage(event) {

            // Verify if the Div content already present?
            if (document.getElementById(sTooTipId)) {

                // Get the Div content
                var newDiv = document.getElementById(sTooTipId);

                if ('pageX' in event) { // all browsers except IE before version 9
                    var pageX = event.pageX;
                    var pageY = event.pageY;
                }
                else { // IE before version 9
                    var pageX = event.clientX + document.documentElement.scrollLeft;
                    var pageY = event.clientY + document.documentElement.scrollTop;
                }

                if (sToolTipPlacement == "Right")
                    newDiv.style.left = (pageX + 17) + "px";
                else // Left
                    newDiv.style.left = (pageX - (parseInt(newDiv.style.width) + 17)) + "px";

                // Portion of div when hide by browser top
                if ((pageY - (parseInt(newDiv.style.height) + 3)) < 0)
                // Showing below the cursor
                    newDiv.style.top = pageY + "px";
                else
                // Showing above the cursor
                    newDiv.style.top = (pageY - (parseInt(newDiv.style.height) + 3)) + "px";

                // Finally visibling the div which has the image
                newDiv.style.visibility = "visible";
            }
        }
        // For showing tool tip
        function ShowToolTipImage(event, pId) {

            var newDiv = null;

            // Verify if the Div content already present?
            if (!document.getElementById(sTooTipId)) {

                // If not create a new Div element
                newDiv = document.createElement("div");
                // Set the id for the Div element to refer further
                newDiv.setAttribute("id", sTooTipId);

                // Add it to the page
                document.body.appendChild(newDiv);

            }
            else {
                // Get the Div content which was invisible on HideTooTipImage function
                newDiv = document.getElementById(sTooTipId);
            }

            var url = '';

            // Here the pId is the id of the image + a flag
            // (0 - when no image stored on the database or
            // 1 - when image stored on the in database)
            // which indicate whether the image required to show or not
            if (pId.split(",")[1] == 'False ')
                url = "Images/ImageNotAvailable.jpg";
            else
                url = "Imagehandler.ashx?ProductID= " + pId.split(",")[0];
         

            /*// Create an html image element
            var NewImg = document.createElement("img");

            NewImg.setAttribute("src", url);

            //        // Setting the style - if u required set what style you required
            //        NewImg.style.width = "100%";
            //        NewImg.style.height = "100%";
            // Adding the image element to div created
            newDiv.appendChild(NewImg);*/

            var strImageContent =
        '<div class="border_preview"> ' +
        '   <div id="loader_container"> ' +
        '       <div id="loader"> ' +
        '           <div align="center">Loading image preview...</div> ' +
        '           <div id="loader_bg"> ' +
        '               <div id="progress"> </div>' +
        '           </div> ' +
        '       </div> ' +
        '   </div> ' +
        '   <div class="preview_temp_load"> ' +
        '       <img id="previewImage" onload="javascript:remove_loading();" src="' + url + '" border="0" width="100%" height="100%"> ' +
        '   </div> ' +
        '</div>';
            newDiv.innerHTML = strImageContent;

            // Here I am setting the style for example purpose,
            // you can modify what you required.
            // You can even set the css class also.
            newDiv.style.zIndex = 999;
            newDiv.style.width = "200px";
            newDiv.style.height = "80px";

            // Make absolute to the div for floating on the screen.
            newDiv.style.position = "absolute";

            if ('pageX' in event) { // all browsers except IE before version 9
                var pageX = event.pageX;
                var pageY = event.pageY;
            }
            else { // IE before version 9
                var pageX = event.clientX + document.documentElement.scrollLeft;
                var pageY = event.clientY + document.documentElement.scrollTop;
            }


            if (sToolTipPlacement == "Right")
                newDiv.style.left = (pageX + 17) + "px";
            else // Left
                newDiv.style.left = (pageX - (parseInt(newDiv.style.width) + 17)) + "px";

            // Portion of div when hide by browser top
            if ((pageY - (parseInt(newDiv.style.height) + 3)) < 0)
            // Showing below the cursor
                newDiv.style.top = pageY + "px";
            else
            // Showing above the cursor
                newDiv.style.top = (pageY - (parseInt(newDiv.style.height) + 3)) + "px";

            // Finally visibling the div which has the image
            newDiv.style.visibility = "visible";
        }

        var t_id = setInterval(animate, 20);
        var pos = 0;
        var dir = 2;
        var len = 0;

        function animate() {
            var elem = document.getElementById('progress');
            if (elem != null) {
                if (pos == 0) len += dir;
                if (len > 32 || pos > 79) pos += dir;
                if (pos > 79) len -= dir;
                if (pos > 79 && len == 0) pos = 0;
                elem.style.left = pos + "px";
                elem.style.width = len + "px";
            }
        }
        function remove_loading() {
            var targelem = document.getElementById('loader_container');
            targelem.style.display = 'none';
            targelem.style.visibility = 'hidden';
        }
</script>
<%-- CSS for tooltip display--%>
<style type="text/css">
    /*Styles*/
    .border_preview{
            z-index:100;
            position:absolute;
            background: #fff;
            border: 1px solid #444;
            padding:3px;
            width:100%;
    }
    #loader_container {text-align:left;position:absolute;}
    #loader {
        font-family:Tahoma, Helvetica, sans;
        font-size:10px;
        color:#000000;
        background-color:#FFFFFF;
        padding:10px 0 16px 0;
        margin:0 auto;
        display:block;
        width:135px;
        border:1px solid #6A6A6A;
        text-align:left;
        z-index:255;
    }
    #progress {
        height:5px;
        font-size:1px;
        width:1px;
        position:relative;
        top:1px;
        left:10px;
        background-color:#9D9D94
    }
    #loader_bg {
        background-color:#EBEBE4;
        position:relative;
        top:8px;left:8px;height:7px;
        width:113px;font-size:1px
    }
    .title_h2 {
        color:#000;
        text-align: left;
        padding:12px 0 0 18px;
        margin:0;
        font-size:14px;
    }
    .preview_temp_load {
        vertical-align:middle;
        text-align:center;
        padding: 0px;
    }
    .preview_temp_load img{
        vertical-align:middle;
        text-align:center;
    }
</style>
</head>
<body>
<form id="form1" runat="server">
 <%-- using the rescpective handler and girdview binding function bind the gridview --%>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" Width="525px">
   
       <Columns>
            <asp:TemplateField  HeaderText="Model">
                <ItemTemplate>                 
                <img id="imgPhoto" src='<%# "Imagehandler.ashx?ProductID= " + Eval ("ProductID") %> '
                        onmouseover="ShowToolTipImage(event, this.alt)"
                        onmouseout="HideTooTipImage()"
                        onmousemove="MoveToolTipImage(event)"
                        alt="<%# Eval("ProductID") %>,<%# Eval("Pname") %>" 
                        width="50px" height="50px" 
                        title="<%# Eval("Pname") %>" 
                        style="cursor:hand" />
                </ItemTemplate>
            </asp:TemplateField>

            <asp:TemplateField HeaderText="Product">
                <ItemTemplate>
                   <asp:Label ID="lblname" runat="server" Text='<%# DataBinder.Eval(Container.DataItem,"Pname") %>'></asp:Label>
                </ItemTemplate>
            </asp:TemplateField>

            <asp:TemplateField HeaderText="u/p(र)">
                <ItemTemplate>
                     <asp:Label ID="lbluprice" runat="server"></asp:Label>
                </ItemTemplate>
            </asp:TemplateField>
      
        </Columns>
        </asp:GridView>
</form>
<body>
</html>
back to top