Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
?
Solved

Using javascript to insert text into a textbox in a DetalilView

Posted on 2009-02-19
17
Medium Priority
?
1,615 Views
Last Modified: 2012-08-13
I'm trying to use this...

function SetSelected(code)
        {
              document.getElementById("TextBox1").value = code;
       {

... to insert a value into a textbox contained in a DetailsView.

The name of the textbox is 'TextBox1' but when rendered in html it is 'table_Insert$ctl01'.

I can get it to work with a test textbox outside of the details view... but I cant get it to refer to the text box in the DetailsView. Please help!

0
Comment
Question by:robaherne
  • 10
  • 6
17 Comments
 
LVL 41

Expert Comment

by:HonorGod
ID: 23680743
What kind of DOM element is "TextBox1"?


function SetSelected(code) {
  var textbox = document.getElementById("TextBox1")
  alert( 'TextBox1.nodeName = ' + textbox.nodeName )
  textbox.value = code;
}

Open in new window

0
 
LVL 4

Expert Comment

by:siancell
ID: 23681191
How are you calling the SetSelected function?
0
 

Author Comment

by:robaherne
ID: 23681397
Thanks...

The TextBox1 is in the DetailsView Below... as is the call to the SetSelected function, which is in an imageMap href=""


<asp:DetailsView ID="table_Insert" runat="server" AutoGenerateRows="False" DataKeyNames="id" DataSourceID="ObjectDataSource1" CellPadding="4" ForeColor="#333333" GridLines="None" DefaultMode="Insert" Caption="<div style='text-align:left;'><b>Add Postcode</b></div>" OnItemInserting="table_Insert_ItemInserting" Width="250px" >
        <Fields>
            <asp:BoundField DataField="postcode"  HeaderText="Postcode" SortExpression="postcode" >
                <HeaderStyle Font-Bold="False" />
            </asp:BoundField>
            <asp:TemplateField HeaderText="Zone" SortExpression="zone">
                <EditItemTemplate>
                    <asp:TextBox   ID="TextBox1" runat="server" Text='<%# Bind("zone") %>'></asp:TextBox>
                </EditItemTemplate>
                <InsertItemTemplate>
                    
                    <asp:DropDownList ID="DropDownList1" runat="server" Text='<%# Bind("zone") %>'>
                    <asp:ListItem Value="1" Text="1"></asp:ListItem>
                    <asp:ListItem Value="2" Text="2"></asp:ListItem>
                    
                    </asp:DropDownList>
                </InsertItemTemplate>
                <ItemTemplate>
                    <asp:Label ID="Label1" runat="server" Text='<%# Bind("zone") %>'></asp:Label>
                </ItemTemplate>
                <HeaderStyle Font-Bold="False" />
            </asp:TemplateField>
            <asp:CommandField ShowInsertButton="True" />
        </Fields>
        <FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
        <CommandRowStyle BackColor="#D1DDF1" Font-Bold="True" />
        <RowStyle BackColor="#EFF3FB" />
        <FieldHeaderStyle BackColor="#DEE8F5" Font-Bold="True" />
        <PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
        <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
        <EditRowStyle BackColor="#2461BF" />
        <AlternatingRowStyle BackColor="White" />
    </asp:DetailsView>
 
 
<img src="../Image/LoindonPostcodes.gif" width="430" height="392" usemap="#map" style="border:0px;">
<map id="map" name="map">
<area href="javascript:SetSelected('NW1')" shape="POLY" coords="116,92,113,69,96,69,90,50,61,46,79,74,74,85,84,85,82,92,94,96,107,90"/>

Open in new window

0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
LVL 4

Expert Comment

by:siancell
ID: 23681568
Will it work for you if you were to replace the
<asp:TextBox   ID="TextBox1" runat="server" Text='<%# Bind("zone") %>'></asp:TextBox>
with
<input type="text" id="TextBox1" name="TextBox1" value="<%# Bind("zone") %>"/>
and obtain the value of the textbox via post?
0
 

Author Comment

by:robaherne
ID: 23681660
Thanks...

That doesn't seem to work. It starts complaining that "A call to bind must be assigned to a property of a control inside a template".

Just to clarify... I want to use this:

<area href="javascript:SetSelected('NW1')" shape="POLY" coords="116,92,113,69,96,69,90,50,61,46,79,74,74,85,84,85,82,92,94,96,107,90"/>

to set the value of TextBox1 to 'NW1'.
0
 
LVL 4

Expert Comment

by:siancell
ID: 23682034
OK this is going to be tricky,
 place a hidden field outside of your DetailsView:
<asp:HiddenField ID="HiddenField1" runat="server" />

then on your code behind, on the DetailsView's Databound event put this in

HiddenField1.value = ctype(sender,DetailsView).FindControl("TextBox1").ClientID
(assuing you are using VB.NET and the textbox's ID is TextBox1)

then on the html side of the page(where you have your DetailsView)
use the value of the hidden field like this

function SetSelected(code)
        {
              document.getElementById("<%=HiddenField1.ClientId%>").value = code;
       {

This should workout for you
0
 
LVL 4

Expert Comment

by:siancell
ID: 23682120
Sorry, made a mistake, the javascript function should me like this

function SetSelected(code)
        {
              var temp = document.getElementById("<%=HiddenField1.ClientId%>").value;
              document.getElementById(temp).value = code;
       {
0
 

Author Comment

by:robaherne
ID: 23682204
Thanks that looks good! Although I just getting this error...

Error      297      'System.Web.UI.WebControls.HiddenField' does not contain a definition for 'ClientId'      C:\Documents and Settings\Robski\My Documents\Visual Studio 2005\WebSites\........
0
 

Author Comment

by:robaherne
ID: 23682379
That was just 'ClientId' should have been 'ClientID'

Now I'm getting...

Object reference not set to an instance of an object.

"HiddenField1.Value =  table_Insert.FindControl("TextBox1").ClientID;"

which I thought was my c# equivallent of your...

"HiddenField1.value = ctype(sender,DetailsView).FindControl("TextBox1").ClientID"

Do you know what the C# equivallent of ctype is?




0
 
LVL 4

Expert Comment

by:siancell
ID: 23682632
I think for c# its

HiddenField1.value = (System.Web.UI.WebControls.DetailsView)sender.FindControl("TextBox1").ClientID

0
 

Author Comment

by:robaherne
ID: 23682736
Dammit!

Object reference not set to an instance of an object.

HiddenField1.Value = ((DetailsView)sender).FindControl("TextBox1").ClientID;
0
 
LVL 4

Accepted Solution

by:
siancell earned 2000 total points
ID: 23682918
Make sure the statement is inside the DataBound event, to do this, while on design mode, on the properties pane there should be a little lightning bolt, click that and then find the DataBound event. Double click the event name and it should create an event handler on the code behind. Then in that event handler put in the code. It  should look something like this:

protected void table_Insert_DataBound(object sender, EventArgs e)
{
     DetailsView temp = (System.Web.UI.WebControls.DetailsView)sender;
     HiddenField1.Value = temp.FindControl("TextBox1").ClientID;
}

also make sure the ID of the textbox is exactly how spelled inside the "FindControl" method or else you'll get the object reference exception.
0
 

Author Comment

by:robaherne
ID: 23690704
Hi there... thanks for all your help. I think I've nailed down the problem.

I can identify the DetailsView text box in the code behind because this works...

    TextBox mybox = (TextBox)((DetailsView)sender).FindControl("TextBox1");

But as soon as I make a reference to it's ClientID....

   string boxid = mybox.ClientID;

I get...

"Object reference not set to an instance of an object.
string boxid = mybox.ClientID;"

It's as if there is no ClientID associated with the box!!!???
0
 

Author Comment

by:robaherne
ID: 23690803
On second thoughts... I don't necessarily have the TextBox object after declaring...

   TextBox mybox = (TextBox)((DetailsView)sender).FindControl("TextBox1");

Because if I try.... mybox.Text = "Whatever"; it gives me the "Object reference not set to an instance of an object." error again.

So still... It cant find the TextBox in the details view by it's ID "TextBox1".

I've tried changing it's ID and even using the html generated ID from the page source but neither works!!!
0
 

Author Comment

by:robaherne
ID: 23690955
Strange....

I also have a dropdown list in the detailsview and I can alter the selectedIdex on that using....

  DropDownList mylist = (DropDownList)((DetailsView)sender).FindControl("DropDownList1");
  mylist.SelectedIndex = 1;

But altering the textbox like this does not work...
   
   TextBox mybox = (TextBox)((DetailsView)sender).FindControl("TextBox1");
   mybox.Text = "whatever";

What the hell is going on???!!!
0
 

Author Comment

by:robaherne
ID: 23691014
Figured it out...

The TextBox in my details view was not the the one I had set up in the code as a template and named "TextBox1".

I needed to use the "convert field into a template field" first and then I could refer to it.
0
 

Author Closing Comment

by:robaherne
ID: 31548726
Thanks a million... I understand whats going on a lot better now!
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Having worked on larger scale sites, we found out that you are bound to look at more scalable solutions to integrating widgets, code snippets or complete applications and mesh them into functional sites, in any given composition. To share some of…
The article shows the basic steps of integrating an HTML theme template into an ASP.NET MVC project
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

569 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question