I have this ASP.NET web page that makes use of the <asp:TextBox> tag and I would like to use it with my codebehind as well as an a small AJAX code. The text box field will be use to edit/enter data into a database. at the same time, I would like to use the text box field to load table data back into the page via a small AJAX program that will be executed by an onclick event.

Example AJAX

<script language="javascript" type="text/javascript">
    function LoadForm(ContactID)
    {
        var xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
        var url = "../GeoPlaneServices.asmx/AlertsForm";
        xmlHttp.open("POST", url, true);
        xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
        xmlHttp.onreadystatechange = function()
        {
            if(xmlHttp.readystate == 4)
            {
                var response = xmlHttp.responseText;
                var XMLObject = new ActiveXObject("Microsoft.XMLDOM");
                XMLObject.async = false;
                try
                {
                    XMLObject.loadXML(response);
                    var responseStatus = XMLObject.getElementsByTagName("ArrayOfContactDataStructure/ContactDataStructure");
                    for(var index = 0; index < responseStatus.length; index++)
                    {
                        var ContactName = responseStatus[index].getElementsByTagName("UserName").item(0).text;
                        var SMS = responseStatus[index].getElementsByTagName("SMS").item(0).text;
                        var Email = responseStatus[index].getElementsByTagName("Email").item(0).text;
                        
                        //loadcontent into form
                        alert(Email);
                        document.getElementById('txtUser').innerHTML = ContactName;
                        document.getElementById('txtSMS').innerHTML = SMS;
                        document.getElementById('txtEmail').innerHTML = Email;
                        alert(Email);
                    }
                }
                catch(e)
                {
                    alert(e);
                }
            }
        }
        xmlHttp.send('ContactID=' + ContactID);
    }
    </script>

ASP form filed and row control

<td align="left" onmouseover="this.style.backgroundColor='#778899'" onmouseout="this.style.backgroundColor='#efefeb'" onclick='javascript:LoadForm(<%#DataBinder.Eval(Container.DataItem, "ContactID") %>)'><%# DataBinder.Eval(Container.DataItem, "UserName") %></td>
<tr>
                <td>&nbsp;</td>
                <td colspan="9" style="height: 26px">Name: <asp:TextBox ID="txtUser" runat="server" Width="130"></asp:TextBox>
                SMS #: <asp:TextBox ID="txtSMS" runat="server" Width="78"></asp:TextBox>&nbsp;Carrier Name:&nbsp;
                <asp:DropDownList ID="ddlCarrier" runat="server"></asp:DropDownList></td>
            </tr>

The AJAX function works fine with regular HTML tags; but it does not work with the asp:TextBox tag. I think on of the reasons is because the tag is running at a server level and it cannot be access by the AJAX function.

If anyone out there has another view or implementation that would allow me to accomplish this job, I would greatly appreciate it.

you inspect the code at client side, there u check the property of text box and then try to put id over text box, using this id access the textbox and use it for ajax,
probably it should work.

hi
dont use innerHTML property with text box. its property of tag element like div.
use
document.getElementById('txtSMS').value="hiiiii";

or see an example;

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

<!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>Untitled Page</title>
  <script type="text/javascript" >
    function clickMe()
    {
        alert(document.getElementById('id_TB1').value);
        document.getElementById('id_TB1').value="hiiiii";
    }
  </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:TextBox ID="id_TB1" runat="server"></asp:TextBox>
    </form>
    <input type='Button' ID="Button1" OnClick="javascript:clickMe();" Text="Click Me" /></div>

</body>
</html>
Comments
Nice example

I see, it makes sense. I don't know what I was thinking. Text boxes have value properties thus innerHTML would not have worked. I guest I need to take a break from C#/C++ and Java programming and improve on my Java scripting and HTML properties.

Thank you very much for your help.

This question has already been answered. Start a new discussion instead.