[CLOSED] CheckBox BoxLabel

  1. #1

    [CLOSED] CheckBox BoxLabel

    I have the following code that mimics the Registration Form example, but I would have tweaked it and have a minor issue.

    I have disabled the checkbox initially. When the user reads the "Terms of Use" by clicking on the BoxLabel (which floats the East Panel) or clicks the East Panel header the float listener on the EastPanel will enable the checkbox for the user to select. My issue is:

    Even though the checkbox is disabled I can click on the boxlabel, but I would like the boxlabel not to be grayed out. I assume there is a css class I can overrided, but not sure which one.

    <ext:Checkbox runat="server" ID="AcceptTerms" Name="acceptTerms" FieldLabel="Terms of Use"
             Disabled="true" HideLabel="true" StyleSpec="font-size:11px;" PaddingSpec="2 0 5 5"
             BoxLabel="I have read and accept the <a href='#' class='terms'>Terms of Use</a>.">
       <Listeners>
          <AfterRender Handler="this.boxLabelEl.on('click', acceptTermsBoxLabelClick);" />
       </Listeners>
       <GetErrors Handler="return this.getValue() ? [] : ['You must accept the Terms of Use'];" />
    </ext:Checkbox>
    
    ...
    
    <funtion acceptTermsBoxLabelClick(e) {
       #{EastTermsOfUse}.floatCollapsedPanel();
       }
    Last edited by Daniil; Oct 09, 2012 at 4:02 PM. Reason: [CLOSED]
  2. #2
    Hi Chris,

    Hope I understood the requirement well.

    Example
    <%@ Page Language="C#" %>
     
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    
    <!DOCTYPE html>
    
    <html>
    <head runat="server">
        <title>Ext.NET v2 Example</title>
    
        <style type="text/css">
            .my-checkbox.x-item-disabled .x-form-cb-label {
                opacity: 1;   
            }
        </style>
    </head>
    <body>
        <ext:ResourceManager runat="server" />
        <ext:Checkbox runat="server" BoxLabel="BoxLabel" Disabled="true" Cls="my-checkbox" />
    </body>
    </html>
    This post can help to sort out similar issues in the future.
    http://forums.ext.net/showthread.php...ll=1#post92291
  3. #3
    Please close the thread. You provided exactly what I asked for, but after implementing it I decided to remove the BoxLabel attribute and add an additional ext:Label. I decided it was more trouble then it was worth to change the opacity and pointer for the boxlabel to fakeout it being disabled. It was just easier to add a new label that is always enabled.

    <ext:Checkbox runat="server" ID="AcceptTerms" Name="acceptTerms" FieldLabel="Terms of Use"
             Disabled="true" HideLabel="true"  PaddingSpec="2 0 5 5">
       <GetErrors Handler="return this.getValue() ? [] : ['You must accept the Terms of Use'];" />
    </ext:Checkbox>
    <ext:Label runat="server" ID="AcceptTermsLabel" StyleSpec=font-size: 11px;" PaddingSpec="5 0 5 5"
        Html="I have read and accept the <a href='#'>Terms of Use</a>." >
       <Listeners>
          <AfterRender Handler="this.el.on('click', floatTermsOfUse);" />
       </Listeners>
  4. #4
    Ok, marked closed.

    Thank you for sharing the solution. It looks good.

Similar Threads

  1. [CLOSED] checkbox duplicate boxlabel
    By PoloTheMonk in forum 1.x Legacy Premium Help
    Replies: 10
    Last Post: Nov 02, 2011, 11:08 AM
  2. Set boxlabel of checkbox to the left side
    By wh0urdady in forum 1.x Help
    Replies: 0
    Last Post: Jun 14, 2010, 5:52 PM
  3. Replies: 1
    Last Post: Aug 07, 2009, 12:56 AM
  4. [CLOSED] Checkbox BoxLabel font different
    By jchau in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Jan 27, 2009, 8:15 AM
  5. [INVALID] CheckBox BoxLabel?
    By Timothy in forum Bugs
    Replies: 3
    Last Post: Jun 24, 2008, 5:43 AM

Posting Permissions