Monday, June 25, 2012

Login with Session and Master Page/Web control

Lot's of my friends asking me that, they are all trouble with  login controls using in asp.net with session..? how it possible with master pages and web controls..? how cookies related with login controls..?

This article, i gonna be explain how all these possible in a simple manner... as an asp.net developer i needed to create a secure login web form but i also needed it to be a easy to implement, not so complicated, and also accomplish the mission
Session are a real impotent thing, that used in many cases we can't even imagine. You can use sessions in passing variables between Webpages instead of query-strings when passing secure values, it can also be used to create secure, and easy login.Sessions can be used to store even complex data for the user just like cookies. Actually sessions will use the cookies for store the data,unless you explicitly tell it not to. Sessions can be used easily in ASP.NET with the Session object. We will re-use the cookie example, and use sessions instead. Keep in mind though, that sessions will expire after a certain amount of minutes, as configured in the web.config file
Here, i need to explain all circumstances behind a login with a web user control.for that i can explain how a simple login works..!it can be detailed thru following program

Download sample program
Step 1 :
At first, set your master page [site.master]  with a web user control [LoginHeader.ascx] the path that i can  used for web control as


<%@ Register Src="~/LoginControls/LoginHeader.ascx" TagName="LoginHeader" TagPrefix="Uc1" %>

All the files such as webforms, database [Register.mdf], that are needed for this program are shown in solution explorer
Most Probably, the .ascx files contain link button and loginview controls and that can access to all web forms  through a masterpage [site.master] 
before that take a look for, how the design parts and code behind works in the .ascx file
LoginHeader.ascx


LoginHeader.ascx.cs































In .cs file convert all the cookie value into a session.. its not obviously termed as 'Convert', get the values from cookies and define all other links like register/edit
 Once the user is authenticated,.. he/she can view the profile and the edit page
Step 2:
before going to LoginHeader.ascx, it may check all users are authorized or not through a web form           [ Login.aspx]
Login.aspx

Login.aspx.cs
here it can assign  the cookie values for session 




Step 3:

For all these program, it has to define the connection string for its database [Register.mdf] and a registration form for inserting new clients

You can Download whole program Here

Now our code is ready for testing. Run your Application with Home.aspx as a start page and enter an incorrect password deliberately and see what message you see and when you enter the correct login you will receive a message that says

"Congratulations...!your session is starts..!"

In this application you can redirect the user to another page and store the Session that you will use through out your application And abondon when the user exit your application. Please note that for some application it is good to enable and disable Controls based on the Session value, meaning that you can check if the user is logged in , and display the benefits that logged in user can get in the same page. 

Thats all enJoY proGraMminG...!


Thank you for visiting http://rocingshani.blogspot.in
Shanith thekkayil-  techshaan2@gmail.com



Saturday, June 16, 2012

Popup calendar Using JQuery/Ajax

This article describes how to demonstrate a popup calendar in asp.net with two ways, that is either 
1) how to to add an Ajax popup calendar to a textbox with the help of the AjaxControlToolkit or 2) with the help of the js(JQuery). This is a simple demonstration with nothing but the required elements on the page so we can study the code and not get confused by other distracting elements

Step 1 : with AjaxControl toolkit
         a)    create a new web form in your web application site ie. Default.aspx
Before anything else, drag and drop an ajax toolscript manager onto your page like shown below,with design.

Above the script manager, drag and drop Text boxes and sets its ID's to txtDateJS and txtDateAjax respectively.
         b)  in the txtDateAjax, you can add a calendar extender from the tag menu, The CalendarExtender is an Asp.net AJAX control that is associated with a TextBox control. When the user clicks on the TextBox, a client-side Calendar control pops up. The user can then set a date by clicking on a day, navigate months by clicking on the left and right arrow and perform other such actions without a postback.
        c) now we can create a css style property for our ajax calendar in the head section
its look like following.
to define your txtDateAjax and calendarextender as follows:-

      d) That's all.. now run the program, we will see how the textbox navigate the popup calendar when the user clicks over..

 Step 2:  With JQuery:-
         a) here, we will see how to use  the jquery calendar popup for an asp.net web application,For every application there is a basic need to select a date from the calendar control. For that we have the AJAX calendar popup extender but this Ajax calendar extender works with our ASP.Net controls but not with HTML controls. As we know, in MVC,we prefer to use HTML controls rather than ASP.Net controls like textboxes. In this application we will see how to use the calendar control of jquery for a HTML textbox when the focus is on the textbox, but in my article i have chosen from asp.net textbox control...
Before starting our work with JQ,.we need to download the custom jquery UI from here
         b) Unzip your downloaded folders and copy all the items into your web application as follows



       c) . We will use this UI and script to build our calendar popup control for MVC/Web application. So let's get started with the calendar popup
you can check out the jquery source code from the above pictures
after running your application you will see the output as follows.....

That's All....
Download sample program from here

Enjoy Programming
Thanks & Regards
techshaan2@gmail.com



          


Thursday, June 14, 2012

How can we use a Captcha in Asp.net

Captcha

What is a captcha how can we use them with either a handler file or .dll file in asp.net 4.0
This article demonstrates how to create such an Captcha image and employ it within an ASP.NET web form.
 What is..?
          - [completely automated public Turing test to tell computers and humans apart] is a program that can tell humans from machines using some type of generated test. A test most people can easily pass but a computer program cannot.You've probably encountered such tests when signing up for an online email or forum account. The form might include an image of distorted text, like that seen above, which you are required to type into a text field. t
The idea is to prevent spammers from using web bots to automatically post form data in order to create email accounts (for sending spam) or to submit feedback comments or guestbook entries containing spam messages. The text in the image is usually distorted to prevent the use of OCR (optical character reader) software to defeat the process. Hotmail, PayPal, Yahoo and a number of blog sites have employed this technique.
you can download a complete captcha program from here  [Link]
 Files we need...!
  •  JpegImage_CS.aspx and JpegImage_CS.aspx .cs- defines the CapchaImage object which actually creates the image. 
  •  captcha.aspx, captcha.aspx.cs - a sample web form.
    button-refresh-captcha.jpg [ an image for button refresh ]
  • Refer the assembly CaptchaDLL.dll in your project --as you can download from here....! CaptchaDLL.dll 
Step 1: Add a page file in your web application and name it "captcha.aspx". It will be used to create Textbox,CAPTCHA image as a bitmap using a class and a dll file. Add following code in the .aspx file: 
  
veryfication styling
<%--Verification
        
Please type the characters you see in the picture :
          
--%>
and

put the following src into a ImageButton!

 runat="server" Height="31px"
   ImageUrl="~/SrcPic/button-refresh-captcha.jpg" OnClick="ibtnRefresh_Click"
        ToolTip="Click here to load a new image" Width="32px" />
                            

and a text box with an id  txtCaptcha

          TextBox ID="txtCaptcha" runat="server" BorderColor="Silver"
     BorderStyle="Solid" BorderWidth="1px" CssClass="style82" Height="20px"
                                    Width="145px">

and with a button
               

Button ID="Button1" runat="server" onclick="Button1_Click" Text="Check" />
                           



Step 2 :
 Now a .aspx file in your web application and name it "JpegImage_CS.aspx ". This  file implements a custom web control which displays the bitmap CAPTCHA image created by the "CaptchaDLL.dll" . Add following code in this file (in the source code itself):
<%@ Page Language="C#" %>
<%@ Import Namespace="System.Drawing.Imaging" %>
<%@ Import Namespace="CaptchaDLL" %>

and within script paste following codes

private void Page_Load(object sender, System.EventArgs e)
    {
        if (Session["CaptchaImageText"] != null)
        {
            // CREATE A CAPTCHA IMAGE USING THE TEXT STORED IN THE SESSION OBJECT.
            CaptchaImage ci = new CaptchaImage(Session["CaptchaImageText"].ToString(), 200, 50);
           
            //YOU CAN USE THE OTHER OVERLOADED METHODS ALSO
            //CaptchaImage ci = new CaptchaImage(Session["CaptchaImageText"].ToString(), 200, 50, "Courier New");
            //CaptchaImage ci = new CaptchaImage(Session["CaptchaImageText"].ToString(), 200, 50, "Courier New" ,System.Drawing.Color.White, System.Drawing.Color.Red);
           
            // Change the response headers to output a JPEG image.
            this.Response.Clear();
            this.Response.ContentType = "image/jpeg";

            // Write the image to the response stream in JPEG format.
            ci.Image.Save(this.Response.OutputStream, ImageFormat.Jpeg);

            // Dispose of the CAPTCHA image object.
            ci.Dispose();
        }
    }






   


Step3: 

Now define a namespace for the created CAPTCHA dll. To do this, locate the tags in the captcha.aspx.cs file and add a namespace tag as below:
 using System.Data;
using System.Data.SqlClient;
using System.Configuration;
using System.IO;
using System.Collections;
using System.ComponentModel;
using System.Drawing;
using System.Web.SessionState;
using System.Web.UI.HtmlControls;

using CaptchaDLL;
   

Step4: 

 Now add the code behind in the web page where CAPTCHA image needs to be displayed. Following code snippet can be used:
 

protected void Page_Load(object sender, EventArgs e)

    {

        if (!IsPostBack)

       

{ Session["CaptchaImageText"] = CaptchaImage.GenerateRandomCode(CaptchaType.AlphaNumeric, 6);

 //creating the strting to show in CAPTCHA image

          

        }

        //cnn = new SqlConnection(ConfigurationManager.ConnectionStrings["con"].ConnectionString);

        //cnn.Open();

    }

    protected void ibtnRefresh_Click(object sender, ImageClickEventArgs e)

    {

        Session["CaptchaImageText"] = CaptchaImage.GenerateRandomCode(CaptchaType.AlphaNumeric, 6); //generate new string

    }

    protected void Button1_Click(object sender, EventArgs e)

    {

        if (Session["CaptchaImageText"] != null &amp;&amp; txtCaptcha.Text.ToLower() == Session["CaptchaImageText"].ToString().ToLower())

        {

            Label1.Text="Well done captcha passed..!";

                  }

        else

        {

            Session["CaptchaImageText"] = CaptchaImage.GenerateRandomCode(CaptchaType.AlphaNumeric, 6);

            txtCaptcha.Text = "";

Label1.Text=" Enter correct characters as shown in image...!";

               }

    }
Visual Verification--- Ok that's all now you can run your program....! enjoy programming Shanith Thekayil  Software Developer Smartzin info venture techshaan2@gmail.com
Twitter Bird Gadget