Accessing and Manipulating HTML Form in ASP.NET Page

Accessing and Manipulating HTML Form in ASP.NET Page – हम हमारे पिछले Example Form को निम्नानुसार Modify भी कर सकते हैं, ताकि हम उसके विभिन्न Client Side Form Elements को Server Side की Code Behind File में Access व Manipulate कर सकें-


<!-- File NameDefault.aspx -->
<%@Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebForms.Default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/x html">
<head runat="server">
    <title> HTML Form Example</title>
</head>

<body>
    <form id="frmCalculate"action="Default.aspx" runat="server">
        <h1>Addition Form</h1>
        <table>
            <tr>
                <td><label for="firstValue">First: </label></td>
                <td>
                    <input type="text" id="txtFirstValue" name="txtFirstValue" runat="server" value="0"/>
                </td>
            </tr>
            <tr>
            <td><label for="secondValue">Second: </label></td>
            <td>
                <input type="text" id="txtSecondValue" name="txtSecondValue" runat="server" value="0"/>
            </td>
            </tr>
            <tr>
            <td>
                <label for="total">Total: </label></td><td><label id="lblTotal" runat="server"></label>
            </td>
            </tr>
            <tr><td colspan="2">
                <button type="submit" id="btnAddition"name="addition">Submit for Addition</button>
            </td></tr>
        </table>
    </form>
</body>
</html>

जब हम ASP.NET Web Forms धारित Web Application Create करते हैं, तब एक Web Page पर केवल एक ही <form> Element हो सकता है और Page पर जितने भी UI Controls होते हैं, उन्हें इस इकलौते <form> Element के बीच ही Enclosed रखना भी जरूरी होता है। साथ ही इस <form> Element में भी runat=”server Attribute का Specified होना भी जरूरी होता है।

जब हम उपरोक्तानुसार तरीके से अपने Webpage को Modify करते हैं, तब Default.aspx Page पर Created  HTML Form में Specified उन Elements को हम हमारे Server Side Default.aspx.cs Code Behind File में भी Directly Access कर सकते हैं, जिनके साथ  runat=”server Attribute को Specify किया गया है। उपरोक्त Code में हमने Extra Background के साथ उन Code Statements को Highlight भी किया है।

अत: हम हमारी Code Behind File में निम्नानुसार Code लिखते हुए Client Side Form के Controls के Data को Access करते हुए उनकी Processing से सम्बंधित Code भी लिख सकते हैं और Processed Data को फिर से Response के रूप में User के लिए Send किए जाने हेतु Specify भी कर सकते हैं:


File Name: Default.aspx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace WebForms
{
    public partial class Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            string firstValue = txtFirstValue.Value;
            string secondValue = txtSecondValue.Value;
            lblTotal.InnerText = (Convert.ToInt32(firstValue) + Convert.ToInt32(secondValue)).ToString();
        }
    }
}

जब हम उपरोक्तानुसार Code Behind File में Logic Codes लिख देते हैं, उसके बाद जब User Default.aspx Page के लिए Request करता है, तो txtFirstValue txtSecondValue ID वाले दोनों Input Elements में Value के रूप में 0 होता है।

परिणामस्वरूप निम्न Codes का Execution होता है और इन Elements के Value Attribute के मान को Access करके इस मान 0 को क्रमश: firstValue secondValue नाम के String Type के Variables में Store कर दिया जाता है:

string firstValue = txtFirstValue.Value;
string secondValue = txtSecondValue.Value;

इसके Just अगले Statement में firstValue व secondValue नाम के String Type के Variable में Stored मानों को पहले एक Integer Value में Convert किया जाता है, ताकि इन पर Arithmetical Calculation को Perform किया जा सके और फिर इन दोनों Variables में Stored मानों को जोडकर उन्हें फिर से ToString() Method का प्रयोग करते हुए एक String Value में Convert करके <form> पर उपलब्ध उस Element की Text Value के रूप में Store कर दिया जाता है, जिसका ID lblTotal है। परिणामस्वरूप हमें निम्नानुसार Output Page दिखाई देता है:

Accessing and Manipulating HTML Form in ASP.NET Page in Hindi

जबकि इस Page पर दिखाई देने वाले पहले व दूसरे Input Element में मान 10002000 Specify करके जब हम “Submit for Addition” Button पर Click करते हैं, तब भी उपरोक्त Process फिर से Follow होती है और Code Behind File Execute होकर निम्नानुसार Resultant Output Page Display करता है:

Accessing and Manipulating HTML Form in ASP.NET Page in Hindi

इस प्रकार से हम Client Side के  HTML Form के उन  HTML Elements को Server Side की Code Behind File में Directly Access व Manipulate कर सकते हैं, जिन में runat=”server” Attribute को Specify किया गया होता है और Client Side से आने वाले Data को Process करते हुए Resultant Output Generate कर सकते हैं, जैसाकि उपरोक्त Example में किया गया है।

Working with HTML Form in ASP.NET Page - Simple Example
Working with State in HTML Forms Page

Core ASP.NET WebForms in Hindi - BccFalna.com: TechTalks in Hindiये Article इस वेबसाईट पर Selling हेतु उपलब्‍ध EBook Core ASP.NET WebForms with C# in Hindi से लिया गया है। इसलिए यदि ये Article आपके लिए उपयोगी रहा, तो निश्चित रूप से ये पुस्तक भी आपके लिए काफी उपयोगी साबित होगी। 

Core ASP.NET WebForms in Hindi | Page:647 | Format: PDF

BUY NOW GET DEMO REVIEWS