Please help : question on how to reference web controls from client-side Javascript .

Folks,
 I have some simple Javascript here that needs to reference not only a
CheckBox object being passed as a parameter, but also various other
fields on my web page.

 My main question is HOW do I access/manipulate controls with
client-side script ?

 I know how to access the value of the Checkbox because I pass it to my
javascript function like this : QuoteConv(this) . However, since Asp
2.0 renames all the ID properties of my web controls, what's the best
way to reference all the various controls (i.e. html TextBox, checkbox,
radio, etc) ???

Here's the beginning of my aspx page with the client-side javascript :

<%@ Page Language="C#" ... %>
<asp:Content ContentPlaceHolderID="ContentPlaceHolder1" runat="server">

<script language="javascript" type="text/javascript">
function QuoteConv(chk) {

         /* I'M TAKING A GUESS HERE !!! */
     cCurr1 = document.aspnetForm.EditDropDownCur1.value ;
     cCurr2 = document.aspnetForm.EditDropDownCur2.value ;

     if (document.aspnetForm.hidInvert.value == "Off") {
          cQteCur1 = cCurr1;
          cQteCur2 = cCurr2;
     } else {
          cQteCur1 = cCurr2;
          cQteCur2 = cCurr1;
     }
     document.aspnetForm.txtQuoteConv1.value = cQteCur1;
     document.aspnetForm.txtQuoteConv1.value = cQteCur2;
     return;
}
</script>

and some controls on the EditItemTemplate that I need to
access/manipulate :

<asp:RadioButtonList ID="radioBuySell" runat="server"
                                 SelectedValue='<%# Bind("buy_sell")%>'
>
          <asp:ListItem Value="1">Buy</asp:ListItem>
          <asp:ListItem Value="2">Sell</asp:ListItem>
 </asp:RadioButtonList>

<asp:DropDownList ID="EditDropDownCur1"
DataSourceID="ObjectDataSource2" ... />
       <asp:ListItem ... />

 <asp:TextBox ID="txtEditAmount"  ... />

  <asp:CheckBox ID="chkEditAct_Cur" runat=...
onClick="QuoteConv(this);"        Checked='<%
#Eval("act_cur").ToString()=="1" ? false : true %>' />

 <input id="txtQuoteConv1" value="USA" readonly="readonly"  ... />
 <input id="txtQuoteConv2" value="JPY" readonly="readonly"  ...  />
.
.
.

I know I can do all this stuff through server-side code, but that would
require AutoPostBack="True" on those controls I need to either validate
or manipulate.

Please help...

Sincerely,
Bob
0
robertmazzo
1/10/2006 3:29:53 PM
asp.net.client-side 24353 articles. 2 followers. Follow

4 Replies
973 Views

Similar Articles

[PageSpeed] 7
Get it on Google Play
Get it on Apple App Store

First, I would recommend that you never reference controls like this:  

document.aspnetForm.EditDropDownCur1.value ;

You should use

document.getElementById( "EditDropDownCur1" ).value;

What I have done for getting to the client side controls of a ItemRepeater (or actually any control in an INamingContainer ).  I am not sure if this work in every scenario, but it works for me reasonably well.

In any given row, the same prefix gets applied to all the IDs.  I use this function to get the prefix that is shared by all controls in the same row.

function GetBaseControlID( control )
{
    var id = control.id;
    var sa = id.split( "_" );
    sa.length = sa.length - 1;
    id = sa.join( "_" );
    
    return id;
}


So in my click handler I can reference all of the "sibling" controls.

function QuoteConv( cbControl )
{
    var baseID = GetBaseControlID( cbControl );
    var ddl = document.getElementById( baseID + "_EditDropDownCur1" );
    var txt = document.getElementById( baseID + "_txtEditAmount" );
}


bill
0
billrob458
1/10/2006 4:45:35 PM

I usually drop aliases to controls like:

Page.RegisterClientScriptBlock("DDLAliases", "var DDLAlias = '" + EditDropDownCur1.ClientID +"';</script>");

And then use the alias in your javascript:

var objDDL = document.getElementById(DDLAlias);

cCurr1 = objDDL.value;

0
stiletto
1/10/2006 4:47:59 PM
Great ideas everyone. 
I've tried document.getElementById(), but always run into a road block on that .
I like the Alias idea. I will experiment with it.
Thanks !
Bob  

0
robertmazzo
1/10/2006 10:38:47 PM
I notice that several suggest accessing a web control directly such as
EditDropDownCur1.ClientID; however, without getting a handle to it via
the FindControl() method I always get the "EditDrop... does not exists
in this context" error.

This works though :
           CheckBox chkInvert = (CheckBox)FormView1.FindControl("chkEditInvert"); // get handle

            StringBuilder cJavaScriptCode = new StringBuilder();
            cJavaScriptCode.Append("<SCRIPT Language='JavaScript'>");
            cJavaScriptCode.Append("var chkInvertAlias = " + chkInvert.ClientID);
            cJavaScriptCode.Append("</SCRIPT>");
            ClientScript.RegisterClientScriptBlock(this.GetType(),"chkInvertAlias",                                
                                                                         cJavaScriptCode.ToString());

Thanks again.
Bob


0
robertmazzo
1/11/2006 3:11:04 PM
Reply:

Similar Artilces:

Question re: accessing web control values via client-side javascript
This block of variables gets generated dynamically from my _PreRender event of my formView : <SCRIPT Language='JavaScript'>  var chkInvertAliasID = 'ctl00_ContentPlaceHolder1_FormView1_chkEditInvert';  var chkAct_CurAliasID = 'ctl00_ContentPlaceHolder1_FormView1_chkEditAct_Cur';  var radBuy_SellAliasID = 'ctl00_ContentPlaceHolder1_FormView1_radioEditBuySell'; </SCRIPT> Now on the client-side I get a handle to above-declared var's : function QuoteConvention(obj) {         var objChkInvert = document.getElementById(chkInv...

List of client side function of extenders and controls for client side
Hello All,I am using AJAX control toolkit for my current project. Now I need to find out what client side functions I can call on an extender. Lets say I am using a PopControlExtender. Now I want to show the popup from a JS funtions.If I can do a guess then it would be something like this$find('ppce').show();From where I can find what client side functions I can call on those extensders. This is really a frusterating thing. I learn about extenders only from Learn tutorials, no help here and there. Can anybody please tell me where are documentations about all the extenders in the tool...

Validation Controls in .NET ( Client side or server side?)
 i have a very basic question. We have all these validation controls in asp.net ( required field, range validator and others)..my question is the required field validator is a server side control. So does that mean that it does a post back?..is it client side or server side control  The only controls that post back are buttons and other inputs where you set AutoPostback="True", such as a dropdownlist or a textbox.  Another way of posting back is using an UpdatePanel and placing a trigger in it for a specified control and/or event. All controls are considered clien...

Web solution help
------=_NextPart_000_015B_01C35A1D.F3D06C60 Content-Type: text/plain; charset="iso-8859-1" Content-Transfer-Encoding: quoted-printable Hi, I was looking for an idea of how I might accomplish something and if = Perl/CGI is going to handle what I have in mind. I have a site that will list = information with links to another site or there may just be additional information available. To = include the=20 more information with every listing would create a very large web page. = I'd rather have something like the following: Here is item one (more information on i...

How to write data to a file in client side using javascript or someother client side scripting language.
Hi, I would like to know how to write a data to a client side file using javascript or someother client side scripting language. The file type expected is ini file. txt file would also be appreciable. Thanks in advance.   If the site is a trusted and you are running IE then you could try http://www.w3schools.com/asp/asp_ref_filesystem.asp The Old Sewing FactoryThat twitter nonsense. You can write to the server, but not to the client's machine.  Being able to do so would be a huge security breach.When you ask a question, remember to click "mark as answered"...

What are diff Server-side control and Client-side control ?
What are diff Server-side control and Client-side control ? and diff server -side coding and client -side coding ? please help I have answered the first part of your question in your previous posting. Server-side coding languages are ASP, ASP.NET, PHP, CGI (Perl) and many, many more. They are used to create dynamic web content (based on additional information that is attached to the request) and are often used to extract information from databases. Client-side coding languages are JavaScript, VBScript, EMACScript and are used to create dynamic content that responds to the u...

Combining a server-side control with a client-side control!
Hi all, I am trying to combine a server-side control with a client-side control. I have created a listbox in both sides, the client-side control's code is: <select size="4" name="lstFruit" id="Select1" ondblclick="lst_dblClick" visible="false"> <option value="Banana">Banana</option> <option value="Apple">Apple</option> <option value="Mango">Mango</option> <option value="Orange">Orange</option> </select> The other one is the server-side control which has this code:   I wanted to add the ondblClick attribute to the se...

Accessing server-side control in client-side javascript function; on Content page
I am trying to set an asp:textbox value in the Client side javascript function. It works fine on the standalone page. But when i try to do this the Content page, it’s giving the follwoing error message. document.getElementByID[...] is null of not an object  Any idea? Thanks, Riz   Hi, are you using ClientID property of that server control, to get its ID (which is rendered at the client and can be used with document.getElementById )?Thanks,Teemu KeiskiFinland, EU Thank you my problem is solved....

simple javascript / client-side problem
ok, this is pretty simple, but as i have VERY little skill in this area and am on a bit of deadline... any help is greatly appreciated! this form (NoteENTRY.ASPX) POSTS to another form (NoteADMIN.aspx) - and i use ASP.NET Request.Form("txtObject") to read the objects on this form to save to a database. simple. this works fine. i wanted to allow the same NoteADMIN.ASPX form to handle deleting, so i figured i could just have the DELETE button (which is a "SUBMIT" HTML button just like the "SAVE" button) write into a hidden textbox ("txtAction")...

Running javascript client side code from a web server control
Hi, I need to execute some client side javascript code from an asp.net server side control. For example, in an asp.net button server control I have code for server side click event and also code for onclientclick property. However, the code in the onclientclick property does not run. What is the correct way to execute javascript code from an asp.net server control? Regards, Sandyhttp://www.thequinn.infohttp://www.sksdataservices.comhttp://www.infobasket.info What you want to do actually? You can add attributes to the server control on page_load or use the ClientScript blocks. To add attr...

how can i add client side javascript to a web user control?
i want to create a simple calculator so i have tried to create web user control "hesapmak.ascx" and insert hesapmak.ascx but it is not working i can't find solution? help me?    hesapmak.ascx <%@ Control Language="C#" AutoEventWireup="true" CodeFile="hesapmak.ascx.cs" Inherits="hesapmak" %><asp:WebPartManager ID="WebPartManager1" runat="server"> </asp:WebPartManager> <asp:WebPartZone ID="WebPartZone1" runat="server" Width="184px" BackColor="SandyB...

Disabling a TextBox web control using javascript (client-side)
I'm using two textboxes and one button for a C# .NET web app code: <form id="Form1" method="post" runat="server"> <asp:TextBox id="TextBox1" style="Z-INDEX: 101; LEFT: 248px; POSITION: absolute; TOP: 128px" runat="server"></asp:TextBox> <asp:TextBox id="TextBox2" style="Z-INDEX: 102; LEFT: 248px; POSITION: absolute; TOP: 168px" runat="server"></asp:TextBox> <asp:Button id="Button1" style="Z-INDEX: 103; LEFT: 248px; POSITION: absolute; TO...

Web User Control +Client Side Control
Two Questions if Possible:  1: Some controls have methods/properties that can be gotten/set client-side (IE ASP:Timer).  Can usally access them by "$find('<%=Control.ClientID%>').get_(set_)name()".  I made a User Control that has a "Enabled" Propertiy (basically sets a bunch of its components to "visible = false" and then a Timer.Enabled=false).  I can't access my user controls "enabled" via client side script (IE $find(UserControl.ClientID).set_enabled(false)).  How do I bundle this type of fu...

Need help in javascript dropdownlist, redirect page to carry parameters from client side to server side.
Hi experts,   I wrote asp.net web pages for company's portal, however, when I put the pages to the portal, the code conflicts with javascript on autopostback, so that the dropdownlist never do autopostback but give an IE Error: __EventTarget is null or not an object.After I searched the internet, I found people think this is a bug in asp.net 1.1 version.So, I want to change the asp:dropdownlist to a client side javascript control by using <Select><option></option></Select> but I have no experience on javascript.Here is what I want to do, and I need help ...

Web resources about - Please help : question on how to reference web controls from client-side Javascript . - asp.net.client-side

Client-side scripting - Wikipedia, the free encyclopedia
... different and changing content depending on user input, environmental conditions (such as the time of day), or other variables. Client-side ...

Senior Search Manager - Client Side!!
... strategy insight for senior IT management - resources to understand and leverage information technology. Senior Search Manager - Client Side ...

Account Manager - Client Side - Previous Agency Experience Welcome!!
Computerworld Australia is the leading source of technology news, analysis and tools for IT decision makers, managers and professionals.

Media Sales Executive - Client Side!!
Technology news and reviews for business and home.

PPC Paid Search Manager - CLIENT SIDE
Defining Technology for Australia's IT Leaders. PPC Paid Search Manager - SEM - **CLIENT SIDE** Sydney CBD Location Client side!! SEM/PPC/Paid ...

How Basecamp Next got to be so damn fast without using much client-side UI
When we started working on Basecamp Next last year, we had much internal debate about whether we should evolve the existing code base or rewrite ...

Seven Tips for Pitching From the Client's Side of the Table
I had a chance to sit on the other side of the pitch table. Here is what I learned.

Client-side coding: How to prevent malicious use?
Applications that run on a user-controlled device cannot be perfectly protected.

The client side
... regarding the professionals you seek to assist. Even better if you possess that understanding yourself, having worked on the client side. I'm ...

Ecommerce traffic being hijacked by client side malware
According to new research 15 to 30 percent of eCommerce site visitors are infected with Client Side Injected Malware (CSIM) that causes them ...

Resources last updated: 12/29/2015 5:01:06 PM