Month: October 2013

How to set focus on first Textbox and Clear all textbox using Jquery ?

ChandradevLeave a comment

Default_Focus
Hi

Recently i used one of the cool feature of jquery in my asp.net project with writing very few line of code.

My requirement was there to make focus on first textbox on client side and clear all textbox on reset button click. I did this task using jquery like this code.


<%@ Page Title="" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
    CodeFile="Default2.aspx.cs" Inherits="Default2" %>

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="Server">
<script type="text/javascript" src="Scripts/jquery-1.4.1.min.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $('input:text:first').focus();

        $('#MainContent_btnReset').click(
        function () {
            $('form')[0].reset();
        });

    });

</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="Server">
    <div>
        <fieldset style="width: 400px; height: 200px;">
            <table cellpadding="3" cellspacing="3" border="0">
                <tr>
                    <td>
                        <asp:Label ID="lblName" Text="Name: " runat="server"></asp:Label>
                    </td>
                    <td>
                        <asp:TextBox ID="txtName" Width="200px" runat="server"></asp:TextBox>
                    </td>
                </tr>
                <tr>
                    <td>s: " runat="server"></asp:Label>
                    </td>
                    <td>
                        <asp:TextBox ID="txtAddress" Width="200px" runat="server"></asp:TextBox>
                    </td>
                        <asp:Label ID="lblAddress" Text="Addres
                </tr>
                <tr>
                    <td>
                        <asp:Label ID="lblEmail" Text="Email: " runat="server"></asp:Label>
                    </td>
                    <td>
                        <asp:TextBox ID="txtEmail" Width="200px" runat="server"></asp:TextBox>
                    </td>
                </tr>
                <tr>
                    <td>
                    </td>
                    <td>
                        <asp:Button ID="btnSubmit" Text="Submit" runat="server" />
                        <asp:Button ID="btnReset" Text="Reset" runat="server" />
                    </td>
                </tr>
            </table>
        </fieldset>
    </div>
</asp:Content>

How to hide and display panel in asp.net using Javascript ?

ChandradevLeave a comment

PanelHide
Hi

While working on asp.net we will get scenario to hide and display panel or Div or any asp.net control. So many person used to fire event on that asp.net control and write code in code behind file.

But this process is not a good one. It will decrease the performance so much. We can do this task using Javascript or Jquery on client side only. It will give very good user experience.


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

<!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">
        .style1
        {
            width: 100%;
        }
    </style>
    <script type="text/javascript">

        function ChangePanel() {
            var dll = document.getElementById('<%=DropDownList1.ClientID %>');
            var panelCountry = document.getElementById('<%=PanelCountry.ClientID %>');
            var val = dll.options[dll.selectedIndex].value;
            if (val == 1) {
                panelCountry.style.visibility = "visible";
            }
            else {
                panelCountry.style.visibility = "hidden";
            }
        }
    
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    </div>
    <table class="style1">
        <tr>
            <td>
                &nbsp;
            </td>
            <td>
            <br />
            <br />

                <asp:DropDownList ID="DropDownList1" onchange="return ChangePanel()" runat="server">
                    <asp:ListItem Value="0">Select</asp:ListItem>
                    <asp:ListItem Value="1">India</asp:ListItem>
                    <asp:ListItem Value="2">Nepal</asp:ListItem>
                </asp:DropDownList>
            </td>
        </tr>
        <tr>
            <td>
                &nbsp;
            </td>
            <td>
                &nbsp;
            </td>
        </tr>
        <tr>
            <td>
                &nbsp;
            </td>
            <td>
                <asp:Panel ID="PanelCountry" runat="server">
                 <fieldset>
                <legend> This is the design part for India Registration Form</legend>
                    <asp:Label ID="lblmsg" runat="server" Font-Bold="true" Text="This design for Country"></asp:Label>
                    <br />
                    <br />
                    <br />
                 </fieldset>
               </asp:Panel>
            </td>
        </tr>
    </table>
    </form>
</body>
</html>

How to access user Control field in asp.net ?

ChandradevLeave a comment

UCProperty
Hi

If you are using asp.net user control in project then obviously you will get requirement to access that field in your parent page.

For example you are creating UserRegistration form as User control and going to use in so many module then you will create user control. Now you have to read all fields in your parent page then you can not read that field directly.

You can do like this

Step1: Create properties for field which one you are going to expose from your usercontrol like this.


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

public partial class UserReg : System.Web.UI.UserControl
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }

    public string Name 
    {
        get { return txtName.Text; }
        set { txtName.Text = value; }
    }

    public string Address   
    {
        get { return txtAddress.Text; }
        set { txtAddress.Text = value; }
    }

    public string EmailId
    {
        get { return txtEmailId.Text; }
        set { txtEmailId.Text = value; }
    }


}

Step2: Now on button click i have to read that field then i can read like this

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

public partial class Default3 : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
         
    }

    protected void btnSave_Click(object sender, EventArgs e)
    {
        string empName = EmpRegUserControl.Name;
        string empAddress = EmpRegUserControl.Address; 
        string emailId = EmpRegUserControl.EmailId;
    }
}