Client-Side enabling of a Server-Side disabled control?

Recently I came into a situation that required me to enable a control client-side, which was previously disabled server-side. Let me explain using a checkbox as an example. When I run chkMyCheckBox.enabled = false, the resulting HTML includs a dynamically created a span that encloses the control. This span is does not have an ID and has the attribute disabled="disabled". This inturn disables the control and it's associated label. Problem being, I see a way to enable the control on the client-side, which requires me to enabled the span as well.

Has anyone needed to do this before? I've noticed that while spans can be disabled/enabled just like any other control via javascript, #1 I would need some ID, and #2 if there is a runat="server" in the span tag, the javascript will no longer work. So I assume this is an in depth issue that will need some explaination (if it's even possible).

 

0
Xorcist
6/26/2006 2:42:46 PM
asp.net.web-forms 93655 articles. 5 followers. Follow

8 Replies
1086 Views

Similar Articles

[PageSpeed] 9

ASP controls have both an ID property and a read only ClientID property. You can use the ClientID property to determine it's client side id value... eg (roughly)

<asp:CheckBox ID="MYCHECKBOX" Enabled="False" runat="server" />

<javascript>

function happensOnLoadOrSomething() {

   if (conditionIsRight) {

      var cB = document.GetElementById('<%=   MYCHECKBOX.ClientID %>');
      cB.enabled = true;

  }

}

</javascrip>

0
timbushell
6/26/2006 3:20:36 PM

That didn't seem to help out much. While the Client ID is returned fine, this is not the issue. I already know the proper client side ID. The problem is when a control like this is disabled on the server side (please read my original post) a physical span is inserted... changing resulting HTML from:

<input id="chkTest" type="checkbox" name="chkTest" /><label for="chkTest">Control to be disabled</label>

to this:

<span disabled="disabled"><input id="chkTest" type="checkbox" name="chkTest" disabled="disabled" /><label for="chkTest">Control to be disabled</label></span>

it's that surrounding span that is the culprit. I could enable the checkbox all day and never get the results I'm looking for because the span is keeping everything inside disabled. I need to be able to change the span in order to enabled the rest. But I can't find a way to do this client-side.

Now I can enabled/disable spans that I have inserted myself, and that do not include a runat="server" in their tag. But I have little choice when the span is dynamically created on the server, and not given an ID for me to reference it by? Below I've included a small test page in case anyone is interested in playing around with this. It's currently setup with a span to be enabled/disabled, uncommenting the line in Page_Load will show that enabling just the checkbox client-side has no effect (once again due to the dynamically inserted span).

<%@Page Language="VB" %>
<%@Import Namespace="System.Data" %>


<SCRIPT LANGUAGE="javascript">

  function Disable() {

    var spn = document.all.spnTest
    var chk = document.frmTest.chkTest
    var btn = document.frmTest.btnTest

    if (spn.disabled) {
      spn.disabled = false;
      chk.disabled = false;
      btn.value = 'Disable';

    } else {
      spn.disabled = true;
      chk.disabled = true;
      btn.value = 'Enable';

    }

  }

</SCRIPT>


<SCRIPT LANGUAGE="VB" RUNAT="server">

  Sub Page_Load(Sender as Object, E As EventArgs)
    ''chkTest.enabled = false
  End Sub

</SCRIPT>


<HTML>
  <HEAD>
    <TITLE>
      Test Page
    </TITLE>
  </HEAD>
  <BODY>
    <FORM ID="frmTest" RUNAT="server">
      <INPUT TYPE=BUTTON ID="btnTest" NAME="btnTest" ONCLICK="Disable();" VALUE="Disable"/>
      <br>
      <SPAN ID="spnTest" NAME="spnTest">
        <ASP:CheckBox id="chkTest" text="Control to be disabled" runat="server"/>
      </SPAN>
    </FORM>
  </BODY>
</HTML>
0
Xorcist
6/27/2006 1:08:23 PM

How about instead of use the chkBox.Disabled = True command on the server side, which is for some reason producing the erroneous span, use

chkBox.Attributes.Add("disabled", "disabled") which you can then easier revert client side using the ClientID

 

0
timbushell
6/27/2006 2:46:58 PM

While that would seem to make sense... I've already tried it, and it doesn't work. That method also inserts a span. Seriously, take the code I listed above, throw it into a file and run it. Even using the chkTest.attributes.add("disabled", "disabled") you'll see the resulting source of the final page has a dynamically inserted span.

This could very well be due to the Text attribute of the control being inserted as a <label> after the <input> and the fact .NET wants to disable that text as well (since technically it's part of the control). Which brings us back to the base case, how to modify this span (or get rid of it entirely)?

0
Xorcist
6/28/2006 1:23:00 PM

Hello Xorcist:

Let me first point out that your javascript code works against any controls, despite the runat=server, because they are anyway finally rendered as html tags into the page.

As to your problem, i can see a couple of work-arounds:

1) you could work it out with javascript walking the DOM hierarchy and getting needed references to controls (the span is just a direct parent for your checkbox);

2) maybe easier, you won't disable the control from server-side; you can handle all enabling-disabling on the client-side, maybe starting the control state from a startup script (RegisterStartupScript i mean) or from body onload handler. Then *you* might put a span with an ID, around it, to properly disable...

Hope this can be a starting point. -LV


Julio P. Di Egidio
Software Analyst Programmer
=BUSINESS AND SCIENTIFIC=
=SOFTWARE DEVELOPMENT=
http://julio.diegidio.name

(Peace X Love] = [++1)
0
LudovicoVan
6/28/2006 2:14:13 PM

Actually I thought of both of those options too. The one I finally went with was #2. But I was hoping for it to be a temporary fix, until I could get tit working the way I really wanted it to. I'm not sure why, but when I attempted to get the parent element of my checkbox (via javascript) I kept getting an undefined object? It's possible I was doing something wrong. But I also noticed that I was not able to aquire the span through a form reference, which is why my above code uses document.all.spnTest instead of document.frmTest.spnTest. Where can I find a good javascript reference guide online?

BTW, Thanks for the tips.

0
Xorcist
6/29/2006 2:05:55 PM
Xorcist:
Where can I find a good javascript reference guide online?

Well, there are two different issues: the Javascript language per se, and the DOM exposed by the browser. The scenario gets more complicated because there are underlying standards and browser implementations. Below i give links to the significant standards, and to Microsoft specific documentation (for each item, MSDN also specifies which standard applies if any).

About the Javascript language:
- Standard ECMAScript: http://www.ecma-international.org/publications/standards/Ecma-262.htm
- Microsoft JScript: http://msdn.microsoft.com/library/default.asp?url=/library/en-us/script56/html/1e9b3876-3d38-4fd8-8596-1bbfe2330aa9.asp

About the DOM:
- W3C DOM: see http://www.w3.org/TR/
- Microsoft DHTML: http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/dhtml_reference_entry.asp

Hope this helps. -LV


Julio P. Di Egidio
Software Analyst Programmer
=BUSINESS AND SCIENTIFIC=
=SOFTWARE DEVELOPMENT=
http://julio.diegidio.name

(Peace X Love] = [++1)
0
LudovicoVan
6/29/2006 7:21:07 PM

I was finally able to get this working using:

 document.frmTest.chkTest.parentElement.disabled

and setting it accordingly. Thanks again.

0
Xorcist
6/30/2006 7:11:53 PM
Reply:

Similar Artilces:

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 forms with client and server side controls??
Hi, I have a form that has client and server side controls. I have a problem in that any client controls (textbox) within the form runat="server" can not be accessed with client side code. Anyone got any ideas why and what work arounds are possible. Regards, Graham. once a form element is inside a <FORM> tag, you can no longer refer to it by its ID alone. you have to refer to it by formname.elementid or document.all.elementid. use document.getElementById(yourtextboxid) to get a ref to the element in the form. using this allows u to bypass the formn...

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...

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...

server side controls in a non-server side form
I want to use server side controls in a non-server side form.I use server side controls (like dropdownlists) so I can fill them with the right options from the database.My question is, what is the best way to approach this?CAN I use server-side controls in a client side form? If so, how can I get the values contained in the controls when I do a post? (not in a querystring).Here's a sample of my code: <form id="frmAdvancedSearch" method="post" action="advancedSearch.aspx"> <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> <input type="submit" /> </form>...

How to Access/Pass Server Side Array Variable at Another Web Form's Client Side
Hi All,I struck up with some intrested senario at my application development...hope some body will guide me or sends me some code snippets....Thanks in advance.Senario is like this.....in A.aspx (using C# .net 2.0 as code behind) I am going to have a array variable basically it is an TWO Dimensional array after populating the values in array I need to redirect/ reload another web form B.aspx, here i need to access the array in B.aspx client side JavaScript.How can I do this...Thanks AgainRaju Dont do a redirect but use server.transfer. That way the previous page will still hold its value, ...

Is there a correspondance for each server side control to be equivalent to a client side html control
Where can find the list and can use that equivalence and what is its usage plsThanksThanks a lot, I appreciate your taking the time to help me. What exactly do you mean? A correspondence of what?All controls have a ClientID property, which for most controls tells the DOM element ID that will be used in the HTML rendering. Aside from that certain controls might offer additional client-side functionality, but there's no one standard.Thanks,EilonBlog: http://weblogs.asp.net/LeftSlipper/ I mean. When I am using html control in my aspx page like:  <input type=text ..>  and...

Server-side versus Client-side controls?
Hi, I'm new to ASP.NET, and I was wondering how negligible the performance impact of using server-side controls over client-side controls is? Should I avoid using server-side controls and use client-side ones whereever I can? Or should I not care? From apurely aesthetic point-of-view, it would be nice to use mostly all server-side controls to keep everything consistent. What are your thoughts on this? Thanks. There are up's and down's of both server-side and client side controls.  Read this article and you will have a better understanding on which is better.http://www.eggh...

Disabling Client Side and Server Side Validation
I have a page which contains a User ID and Password field which have RequiredFieldValidators against them. The page can also load a User Control which contains another field which also has a RequiredFieldValidator against it. When I submit the form I use the ValidatorEnable function to disable the validator, on the User Control Page, when the user is signing in. This works fine on the client side but the page fails on the server side as I presume it does not know that I have disabled the control from the client side. Can anyone tell me the best way to solve this problem. Thanks M...

server-side control inside another server-side control
Hi everyone. I have a requirement where I need to create a custom server side control which will contain a series of ASP controls -- no problem there. However, this component also needs to itself be placed inside a server side control, and then placed into the page...so I'll have a custom server-side component inside a custom server-side component. Is that even possible? Everytime I start to think about it I get a headache. Thanks Matt  It's perfectly possible. Just give it a try and you'll see that it works.-- "Mark As Answer" if my reply helped you -- Yup...

differences between server side asynchronous Web methods and client side asynchronous Web methods
Hi,   can anyone expalin what are the differences between server side asynchronous Web methods  and client side asynchronous Web methods in ASP.Net 2.0 ?   any best articles on serverside asynchronous Web methods  ?   Thanks,  hi, check this url, Server-Side Asynchronous Methods for ASP.NET, http://www.codeproject.com/KB/cpp/asyncws.aspx   Calling the Server-Side method asynchronously from Client Script, http://www.c-sharpcorner.com/UploadFile/dipenlama22/Callbacks07182006093320AM/Callbacks.aspx...

Firing both Client side event and server side event for server side button
I am having some difficulties getting this to work.. I have button_click (Asp.net) and ClientClick (Javascript).  Javascript is firing fine.  Server script is not. may be you have return return false in the in the javascript which is why its not firing server side event.You should add javascript evelt like thisbutton1.onclientclick = "functionname" Function should nopt return false. Vikram www.vikramlakhotia.comPlease mark the answer if it helped you...

How to access dynamically Html controls (client side controls) using C# server side scripts
Folks,I have problem try to to access dynamically Html controls (client side controls) using C# server side scripts. Please give me helps.     The error is as follows Exception Details: System.InvalidCastException: Specified cast is not valid.Source Error: Line 79: { Line 80: Control c = Page.FindControl("ddlTC" + i); Line 81: ((DropDownList)c).DataSource = mdt; Line 82: ((DropDownList)c).DataTextField = "ClassID"; Line 83: ((DropDownList)c).DataValueField = "Course"; My aspx page source codes: ...<...

Client side clock using server side controls
Is it possible to create a client side clock using a server side control (label or textbox) in C# without accessing JavaScript?  If so, how? In principal it is possible, it depends how often you need to reload this clock ... if every second than: 1. It is no sens to do I mean 2. You need than to make setTimeout client script, to refresh page every second With FastPage it seems more real task ... http://fastpage.more.at...

Web resources about - Client-Side enabling of a Server-Side disabled control? - asp.net.web-forms

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/15/2015 2:51:11 PM