Loading ...
Sorry, an error occurred while loading the content.

Disable Controls

Expand Messages
  • Michael Terry
    I have a set of controls that edits rows in a datatable, several autocompletes and sliders. Sometimes I want the controls to be in a disabled state so no
    Message 1 of 5 , May 1 10:19 AM
    • 0 Attachment
      I have a set of controls that edits rows in a datatable, several autocompletes and sliders. Sometimes I want the controls to be in a disabled state so no editing can be done. What is a good UI strategy for this? The YUI controls don't seem to have a feature for this built in.

      Michael
    • Satyam
      If you are using the in-line cell editors, you are listening to cellClickEvent and passing that on to onEventShowCellEditor. Make that conditional. The
      Message 2 of 5 , May 1 10:40 AM
      • 0 Attachment
         
         
        If you are using the in-line cell editors, you are listening to "cellClickEvent" and passing that on to onEventShowCellEditor.  Make that conditional.  
         
         The cursor, though, will still change shape to a pointing hand.  You can fix that easily by combining Dom.batch and the Selector component to remove the "yui-dt-editable" class, which is the one that sets the cursor. You can also render the table again, and it should change the cursor setting.  You might also change the setting for the "yui-dt-editable" class, whichever is easier
         
        Satyam
         
         
         
        ----- Original Message -----
        Sent: Thursday, May 01, 2008 7:19 PM
        Subject: [ydn-javascript] Disable Controls

        I have a set of controls that edits rows in a datatable, several autocompletes and sliders. Sometimes I want the controls to be in a disabled state so no editing can be done. What is a good UI strategy for this? The YUI controls don't seem to have a feature for this built in.

        Michael


        No virus found in this incoming message.
        Checked by AVG.
        Version: 7.5.524 / Virus Database: 269.23.7/1408 - Release Date: 30/04/2008 18:10
      • Michael Terry
        Hi Satyam, I couldn t use the built-in cell editors for reasons too boring to bring up now, unfortunately. It would have been really nice if I could have. No,
        Message 3 of 5 , May 1 10:57 AM
        • 0 Attachment
          Hi Satyam,

          I couldn't use the built-in cell editors for reasons too boring to bring up now, unfortunately. It would have been really nice if I could have. No, I have a panel of editors above the table, but if no rows are selected, I'd like them disabled. Although I haven't looked into it too much, I'm thinking I can lock all the inputs and the textarea. I know I can lock the sliders. The two that seem the most problematic:

          1. The autocomplete. I have it set to always stay open. I can't think of an easy way to block it from user interaction and visually indicate it's disabled status. I didn't see anything in the api.

          2. The calendar. I actually haven't checked the api on this one yet, but I don't remember anything from when I was browsing it before.

          Your articles were *extremely* helpful, by the way, thanks.

          Michael

          On Thu, May 1, 2008 at 10:40 AM, Satyam <satyam@...> wrote:

           
           
          If you are using the in-line cell editors, you are listening to "cellClickEvent" and passing that on to onEventShowCellEditor.  Make that conditional.  
           
           The cursor, though, will still change shape to a pointing hand.  You can fix that easily by combining Dom.batch and the Selector component to remove the "yui-dt-editable" class, which is the one that sets the cursor. You can also render the table again, and it should change the cursor setting.  You might also change the setting for the "yui-dt-editable" class, whichever is easier
           
          Satyam
           
           
           
          ----- Original Message -----
          Sent: Thursday, May 01, 2008 7:19 PM
          Subject: [ydn-javascript] Disable Controls

          I have a set of controls that edits rows in a datatable, several autocompletes and sliders. Sometimes I want the controls to be in a disabled state so no editing can be done. What is a good UI strategy for this? The YUI controls don't seem to have a feature for this built in.

          Michael


          No virus found in this incoming message.
          Checked by AVG.
          Version: 7.5.524 / Virus Database: 269.23.7/1408 - Release Date: 30/04/2008 18:10

        • Satyam
          You can enable and disable some controls, but not the calendar. One way you might want to try is, if they are all within a single container, you can put on it
          Message 4 of 5 , May 1 2:01 PM
          • 0 Attachment
            You can enable and disable some controls, but not the calendar.  One way you might want to try is, if they are all within a single container, you can put on it a floating panel, actually an Overlay from the Container family, of exactly the same size and with a semi-transparent background. That's the trick used to make Simple Dialog modal, see:
             
             
             
            This is the style used on the mask:
             
            .yui-skin-sam .mask {container.css (line 7)
                background-color:#000000;
                opacity:0.25;
            }
             
            or you could use a transparent background with some image containing alternate transparent and colored pixels.
             
            Satyam
             
            ----- Original Message -----
            Sent: Thursday, May 01, 2008 7:57 PM
            Subject: Re: [ydn-javascript] Disable Controls

            Hi Satyam,

            I couldn't use the built-in cell editors for reasons too boring to bring up now, unfortunately. It would have been really nice if I could have. No, I have a panel of editors above the table, but if no rows are selected, I'd like them disabled. Although I haven't looked into it too much, I'm thinking I can lock all the inputs and the textarea. I know I can lock the sliders. The two that seem the most problematic:

            1. The autocomplete. I have it set to always stay open. I can't think of an easy way to block it from user interaction and visually indicate it's disabled status. I didn't see anything in the api.

            2. The calendar. I actually haven't checked the api on this one yet, but I don't remember anything from when I was browsing it before.

            Your articles were *extremely* helpful, by the way, thanks.

            Michael

            On Thu, May 1, 2008 at 10:40 AM, Satyam <satyam@...> wrote:

             
             
            If you are using the in-line cell editors, you are listening to "cellClickEvent" and passing that on to onEventShowCellEditor.  Make that conditional.  
             
             The cursor, though, will still change shape to a pointing hand.  You can fix that easily by combining Dom.batch and the Selector component to remove the "yui-dt-editable" class, which is the one that sets the cursor. You can also render the table again, and it should change the cursor setting.  You might also change the setting for the "yui-dt-editable" class, whichever is easier
             
            Satyam
             
             
             
            ----- Original Message -----
            Sent: Thursday, May 01, 2008 7:19 PM
            Subject: [ydn-javascript] Disable Controls

            I have a set of controls that edits rows in a datatable, several autocompletes and sliders. Sometimes I want the controls to be in a disabled state so no editing can be done. What is a good UI strategy for this? The YUI controls don't seem to have a feature for this built in.

            Michael


            No virus found in this incoming message.
            Checked by AVG.
            Version: 7.5.524 / Virus Database: 269.23.7/1408 - Release Date: 30/04/2008 18:10


            No virus found in this incoming message.
            Checked by AVG.
            Version: 7.5.524 / Virus Database: 269.23.7/1408 - Release Date: 30/04/2008 18:10
          • Michael Terry
            This is a fantastic idea. I ll do it. Michael
            Message 5 of 5 , May 2 1:31 PM
            • 0 Attachment
              This is a fantastic idea. I'll do it.

              Michael

              On Thu, May 1, 2008 at 2:01 PM, Satyam <satyam@...> wrote:

              You can enable and disable some controls, but not the calendar.  One way you might want to try is, if they are all within a single container, you can put on it a floating panel, actually an Overlay from the Container family, of exactly the same size and with a semi-transparent background. That's the trick used to make Simple Dialog modal, see:
               
               
               
              This is the style used on the mask:
               
              .yui-skin-sam .mask {container.css (line 7)
                  background-color:#000000;
                  opacity:0.25;
              }
               
              or you could use a transparent background with some image containing alternate transparent and colored pixels.
               
              Satyam
               
              ----- Original Message -----
              Sent: Thursday, May 01, 2008 7:57 PM
              Subject: Re: [ydn-javascript] Disable Controls

              Hi Satyam,

              I couldn't use the built-in cell editors for reasons too boring to bring up now, unfortunately. It would have been really nice if I could have. No, I have a panel of editors above the table, but if no rows are selected, I'd like them disabled. Although I haven't looked into it too much, I'm thinking I can lock all the inputs and the textarea. I know I can lock the sliders. The two that seem the most problematic:

              1. The autocomplete. I have it set to always stay open. I can't think of an easy way to block it from user interaction and visually indicate it's disabled status. I didn't see anything in the api.

              2. The calendar. I actually haven't checked the api on this one yet, but I don't remember anything from when I was browsing it before.

              Your articles were *extremely* helpful, by the way, thanks.

              Michael

              On Thu, May 1, 2008 at 10:40 AM, Satyam <satyam@...> wrote:

               
               
              If you are using the in-line cell editors, you are listening to "cellClickEvent" and passing that on to onEventShowCellEditor.  Make that conditional.  
               
               The cursor, though, will still change shape to a pointing hand.  You can fix that easily by combining Dom.batch and the Selector component to remove the "yui-dt-editable" class, which is the one that sets the cursor. You can also render the table again, and it should change the cursor setting.  You might also change the setting for the "yui-dt-editable" class, whichever is easier
               
              Satyam
               
               
               
              ----- Original Message -----
              Sent: Thursday, May 01, 2008 7:19 PM
              Subject: [ydn-javascript] Disable Controls

              I have a set of controls that edits rows in a datatable, several autocompletes and sliders. Sometimes I want the controls to be in a disabled state so no editing can be done. What is a good UI strategy for this? The YUI controls don't seem to have a feature for this built in.

              Michael


              No virus found in this incoming message.
              Checked by AVG.
              Version: 7.5.524 / Virus Database: 269.23.7/1408 - Release Date: 30/04/2008 18:10


              No virus found in this incoming message.
              Checked by AVG.
              Version: 7.5.524 / Virus Database: 269.23.7/1408 - Release Date: 30/04/2008 18:10

            Your message has been successfully submitted and would be delivered to recipients shortly.