• If this is your first visit, be sure to check out the FAQ by clicking the link above. You may have to register before you can post: click the register link above to proceed. To start viewing messages, select the forum that you want to visit from the selection below.

Announcement

Collapse
No announcement yet.

Value for slider

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Value for slider

    If I create a panel having a slider, how can I always show the value of the slider? I know when you use the slider, the value is shown. I'd like to show the current value of the slider in either a field next to the slider or by putting a value scale above/below the slider.

    Thanks...

  • #2
    All you need to do is put a change listener on your slider to update any field in real time as the slider is moving. See the example below. Just add the listeners part to your slider and change the myField name to whatever field you want to update as the slider is moving.

    Code:
        mySlider = new Ext.slider.Single({
            width: 214,
            minValue: 0,
            maxValue: 100,
            useTips: true,
            tipText: function(thumb) {
                return Ext.String.format('{0}% complete', thumb.value);
            },
            listeners: {
                change: function(f, newVal, oldVal) {
                    Ext.getCmp('myField').setValue(newVal);
                }
            }
        });

    Comment


    • #3
      I have a question about the "function" syntax.

      I see it all over, function(), function(e,t,o) and the example you used, "function(f, newVal, oldVal)". I've looked all over the Sencha API docs, Googled it to death, and can't seem to find a good description of it. I assume the chars in the parens, IE, (), (e,t,o), etc are parms. Remember I'm trying to understand this from a 25+ year AS400/RPG perspective. Is there a REALLY go manual for this? I've reading and practicing with the EXTJS 4 API docs.

      Thanks...

      Comment


      • #4
        Function is a part of Javascript, it is not specific to Ext, so I would just do a search on "javascript function".

        Comment


        • #5
          The Sencha API docs will tell you the parms that will be passed to the function for each event. Go to the docs and look up Slider, then go to the Events section near the bottom and look for the "change" event. The details there will show you the parms. That's what I looked at when I did the example for you.

          As Sean pointed out, function is a pretty basic part of JavaScript. A good book for basic JavaScript that I use as a reference all the time is "Object-Oriented JavaScript" by Stoyan Stefanov. Here's a link to it on Amazon:

          http://www.amazon.com/Object-Oriente...5506718&sr=1-3

          Comment


          • #6
            Thanks Richard.

            Comment

            Working...
            X