Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
120
FormatValueLabal cannot set the label for the secondary slider
posted

I use the following function to format the value labels:

<!--

function wsDepartureDate_FormatValueLabel(sender, eventArgs)

{

    var val = eventArgs.get_isSecondary() ? eventArgs.get_otherValue() :

        eventArgs.get_value();

 

    var label = val.getDate() + '-' +

        (val.getMonth() + 1) + '-' + val.getFullYear();

 

    eventArgs.set_label(label);

 

}// -->

The problem is, the set_label() method of the eventArgs doesn't seem to make a distinction between the primary and secondary thumbs, so it sets the same label for both (or at least that's what I see when I hover over them). Can you please suggest how to get this working correctly?

Parents
No Data
Reply
  • 24497
    posted

    Hi Morar,

    The logic to show value-label depends on the ValueLabel.Format property. If that is not set then defaults value uses format "{0}" of "{0}:{1}", depending on ValueLabel.Location. If defaults are confusing, then application may set explicit value for Format.

    If Format contains "{1}", then single label for both thumbs is used, otherwise each thumb has its own label. The client event FormatValueLabel is also provides different values depending on the presence of "{1}" in the ValueLabel.Format.

    If each thumb has its own label (Format is set to "{0}", or it is not set and Location is float), then client event can be implemented by something like

    function WebSlider1_FormatValueLabel(sender, eventArgs)
    {
     var val = eventArgs.get_value();
     var label = val.getDate() + '-' + (val.getMonth() + 1) + '-' + val.getFullYear();
     eventArgs.set_label(label);
    }

    If both thumbs have single label (Format contains "{1}" or it is empty and Location is not float), then client event can be implemented by something like

    function WebSlider1_FormatValueLabel(sender, eventArgs)
    {
     var val1 = eventArgs.get_value();
     var val2 = eventArgs.get_otherValue();
     val1 = val1.getDate() + '-' + (val1.getMonth() + 1) + '-' + val1.getFullYear();
     val2 = val2.getDate() + '-' + (val2.getMonth() + 1) + '-' + val2.getFullYear();
     var label = val1 + ' : ' + val2;
     eventArgs.set_label(label);
    }

    And at last when application does not know which format is used or it uses same client event for multiple sliders with different configurations of formats and number of thumbs, then client event can be implemented by following

    function WebSlider1_FormatValueLabel(sender, eventArgs)
    {
     var val1 = eventArgs.get_value();
     var val2 = eventArgs.get_otherValue();
     var format = sender.get_valueLabelFormat();
     val1 = val1.getDate() + '-' + (val1.getMonth() + 1) + '-' + val1.getFullYear();
     val2 = val2.getDate() + '-' + (val2.getMonth() + 1) + '-' + val2.getFullYear();
     var label = format.replace('{0}', val1).replace('{1}', val2);
     eventArgs.set_label(label);
    }

    Note: usage of sender.get_valueLabelFormat() as base for "replace" is preferrable, because it uses value which was set on server (until client does not need server values).

Children
No Data