Go Premium for a chance to win a PS4. Enter to Win

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 3911
  • Last Modified:

javascript to get formview control

How do i use javascript to get the value of a formview control? Below is my code and the error I get back is that the object is null.
<script language="javascript" type="text/javascript">
function ValidateForm()
{
	//var form = document.getElementById('form1.FormView5');
	
var formServiceDate = document.getElementById('<%= FormView5.FindControl("txtbxServiceDate").ClientID %>');

Open in new window

0
fwstealer
Asked:
fwstealer
  • 10
  • 6
  • 4
1 Solution
 
mohan_sekarCommented:
assuming FormView5 is your formview's name,

var form = document.getElementById('<%=FormView5.ClientId%>');

Note: ID in ClientId should NOT be in all CAPS
0
 
fwstealerAuthor Commented:
System.Web.UI.WebControls.FormView' does not contain a definition for 'ClientId' and no extension method 'ClientId' accepting a first argument of type 'System.Web.UI.WebControls.FormView' could be found (are you missing a using directive or an assembly reference?)

formview5 is inside the parent form

<form id="form1" name="form1" runat="server">
<asp:FormView ID="FormView5"

0
 
mohan_sekarCommented:
Is this not working? - document.getElementById("<%=txtbxServiceDate.ClientId%>");
0
Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

 
fwstealerAuthor Commented:
changed it to;

      var form = document.getElementById('<%=FormView5.ClientID%>');

it allowed me to load the page.

now when i test for the javascript with an empty textbox value i get:
Microsoft JScript runtime error: 'txtbxServiceDate.value' is null or not an object

       if(form.txtbxServiceDate.value != "") //blows up here and this textbox is in formview5
0
 
mohan_sekarCommented:
As I indicated in my earlier post, document.getElementById("<%=txtbxServiceDate.ClientId%>").value will get you what you want
0
 
fwstealerAuthor Commented:
yes, it is not working inside a formview.

<script language="javascript" type="text/javascript">
function ValidateForm()
{
    var form = document.getElementById('<%=FormView5.ClientID%>');

    //validate txtbxServiceDate
       if(document.getElementById("<%=txtbxServiceDate.ClientID%>").value != "")//errors here

error:  The name 'txtbxServiceDate' does not exist in the current context

if i use this
if(form.txtbxServiceDate.value != "") //errors here

my error is: Microsoft JScript runtime error: 'txtbxServiceDate.value' is null or not an object
0
 
mohan_sekarCommented:
Do you use any templates inside the formview?
0
 
fwstealerAuthor Commented:
dang, yes the -- EditItemTemplate

here is what the 1st textbox looks like:

        <asp:TextBox ID="ServiceDateTextBox" runat="server" Text='<%# Bind("ServiceDate") %>' />
0
 
fwstealerAuthor Commented:
i tried this:

       if(document.getElementById('<%=FormView5.FindControl( "txtbxServiceDate").ClientID%>'))

and got the error: The name 'txtbxServiceDate' does not exist in the current context

Ahhh

0
 
fwstealerAuthor Commented:
Instead, you should be retrieving your controls from PreRender event handler.  Be sure to check for your FormView's CurrentMode to make sure it's in FormViewMode.Edit mode before retrieving any controls within your EditItemTemplate.


<asp:FormView ID="FormView5" runat="server" DataKeyNames="ReqId"
            DataSourceID="SqlDataSource6" DefaultMode="Edit"
            ondatabound="FormView5_DataBound" name="FormView5" >

this is getting confusing!!
0
 
strickddCommented:
First off: "ClientId" is WRONG! when you are using the Response.Write() short-hand "<%= %>" the code inside is .Net code. It is NOT javascript code. Therefore "ClientID" is correct.

Secondly, there are several things to remember about a FormView. These are specially designed .Net controls. They allow things to exist that don't follow the norm. For example, there are three templates (insert, edit, item) and they can all have a control with the same ID.

<asp:FormView>
<EditTemplate>
   <asp:TextBox ID="MyText"/>
</EditTemplate>

<ItemTemplate>
   <asp:Label ID="MyText"/>
</ItemTemplate>
</asp:FormView>

In this example, the Edit and Item templates both have a control with ID of "MyText" but the Update template does not. This means when you do a FindControl when it is in Update mode, you will not pull back a control, rather it will be NULL.

Because of this, you will need to MAKE SURE you are in the template you *think* you are in when you are executing the javascript. I would recommend adding <b>TemplateType</b> (where TemplateType is "Edit" or "Item" respectively). That will help distinguish.

Since it appears you are writing the javascript in the code-in-front you don't need to worry about when it is added to the page compared to when the control is added.

Next I would try adding the following to the page and see what you get.

<%= FormView5.ToString() %> <!-- should be System.Web...FormView -->
<%= FormView5.FindControl("txtbxServiceDate").ToString() %> <!-- Should be System.Web...TextBox -->
<%= FormView5.FindControl("txtbxServiceDate").ClientID.ToString() %> <!-- Should be the client id something like xxxx_xxxx_txtbxServiceDate" -->

If none of these return anything like mentioned in the comments, I would recommend that you check the spelling and CASE of the ID. For example "TxtBxServiceDate" is different from "txtbxServiceDate".

If none of these ideas pan out, let me know.
0
 
fwstealerAuthor Commented:
here is what I got

<body >
<%= FormView5.ToString() %> <!-- should be System.Web...FormView -->
System.Web.UI.WebControls.FormView

nullreferenceexception
<%= 'FormView5.FindControl("txtbxServiceDate").ToString() %>
0
 
strickddCommented:
The null reference exception means that the control with ID="txtbxServiceDate" does NOT exist in the currently active template. That is why the javascript you have is not working. Until you can get the right template to be active with the correct ID for the control, it will not work.

Add this to your page to be able to tell what template the FormView is using:

<%= FormView5.CurrentMode.ToString() %>

That will tell you what template you are using. At which point, add the control you need to to it and your javascript will work.
0
 
fwstealerAuthor Commented:
its Edit

Any idea how to get into it?
0
 
strickddCommented:
can you post the EditTempalte?
0
 
fwstealerAuthor Commented:
all the code for it?
0
 
fwstealerAuthor Commented:
<asp:FormView ID="FormView5" runat="server" DataKeyNames="ReqId"
            DataSourceID="SqlDataSource6" DefaultMode="Edit"
            ondatabound="FormView5_DataBound" name="FormView5" >   
<EditItemTemplate>
<table cellpadding="0" cellspacing="0" class="style1"
    style="background-color:#EFF3FB;border-color:#B5C7DE;border-width:1px;border-style:Solid;border-collapse:collapse;">
            <tr>
            <td align="center" style="color:White;background-color:#507CD1;font-size:0.9em;font-weight:bold;" colspan="2">
            Requisition Core Data</td>
            </tr>
<tr>
  <td width="152" >
                <asp:Label ID="ReqIdLabel1" runat="server" Text='<%# Eval("ReqId") %>' Visible="false"  />
          * Service Date:
          </td>
<td width="546">
        <asp:TextBox ID="ServiceDateTextBox" runat="server" Text='<%# Bind("ServiceDate") %>' />
            </td>
            </tr>


other stuff

<tr>
            <td colspan="2">
            <asp:Button ID="btnAdd" runat="server" Text="Update Requisition" onclick="btnAdd_Click" OnClientClick="return ValidateForm()" />
            </td>
            </tr>
           </table>
    </EditItemTemplate>
0
 
strickddCommented:
I'm sorry if I sound a little rude here, but I really wish you would have read my first two comments, it would have saved a LOT of time.

From Comment 1:
If none of these return anything like mentioned in the comments, I would recommend that you check the spelling and CASE of the ID. For example "TxtBxServiceDate" is different from "txtbxServiceDate".

From Comment 2:
The null reference exception means that the control with ID="txtbxServiceDate" does NOT exist in the currently active template.

Putting it together:
Your EditTemplate does NOT contain a textbox (or any control for that matter) with the ID of "txtbxServiceDate". The ID of the text box (I assume) that you want to reference in your javascript is "ServiceDateTextBox". Remember this IS case sensitive and must be spelled correctly. Also keep in mind that this javascript will be dependent on you being in the correct template.
0

Featured Post

Ask an Anonymous Question!

Don't feel intimidated by what you don't know. Ask your question anonymously. It's easy! Learn more and upgrade.

  • 10
  • 6
  • 4
Tackle projects and never again get stuck behind a technical roadblock.
Join Now