Wednesday, August 25, 2010

How to access server side control values using java script and change in the client side - Part 1 [in a Page]

We can use ClientID propery of any control to access values of controls in the client side java scripts.
var input = document.getElementById('<%=txtName.ClientID %>');

Example
<%@ Page Language="C#" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <script language="javascript">
        function GetValue() {
            var input = document.getElementById('<%=txtValue1.ClientID %>');
            alert(input.value);
            return false;
        }
        function SetValue() {
            var value = prompt("Input Value""BMW");
            var input = document.getElementById('<%=txtValue2.ClientID %>');
            input.value = value;
            return false;
        }
        function TransferValue() {
            var input1 = document.getElementById('<%=txtValue1.ClientID %>');
            var input3 = document.getElementById('<%=txtValue3.ClientID %>');
            input3.value = input1.value;
            return false;
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <h4>Get Value</h4>
        <asp:TextBox runat="server" ID="txtValue1" Text="Toyota" />
        <asp:Button runat="server" ID="btnGetValue" Text="Get Value" OnClientClick="javascript:return GetValue()" />
        <hr />
        <h4>Set Value</h4>
        <asp:TextBox runat="server" ID="txtValue2" />
        <asp:Button runat="server" ID="btnSetvalue" Text="Set Value" OnClientClick="javascript:return SetValue()" />
        <hr />
        <h4>Transfer Value</h4>
        <asp:TextBox runat="server" ID="txtValue3" />
        <asp:Button runat="server" ID="btnTransferValue" Text="Transfer Value" OnClientClick="javascript:return TransferValue()" />
    </form>
</body>
</html>

No comments:

Azure Storage Account Types

Defferent Types of Blobs Block blobs store text and binary data. Block blobs are made up of blocks of data that can be managed individually...