Fire event without change

2 posts, 0 answers
  1. Ethan
    Ethan avatar
    5 posts
    Member since:
    Oct 2013

    Posted 09 Jul 2014 Link to this post

    I'm trying to fire an event without change happening and I'm having some trouble figuring it out.

    I have the Kendo UI widget on my webpage and the default value is #000000 when the color picker loads. If I click the Apply button in the color picker the 'change' event doesn't fire because I didn't change anything. If I change the slider and click 'Apply' then the value changes and is also put into the 'input text' field.
    How do I get it so the value #000000 is set when I click Apply without changing anything?

    Code snippet:
    <input type="text" class="text colorPicker" size="25" maxlength="100" title="${geo:loc attribute=&quot;title&quot; phrase=&quot;Please enter the hexadecimal value for the font color.&quot; /}" name="${geo:object name='CntwChooseColorScheme.PRIMHEAD_FONTCOLOR' attribute='name'/}" id="${geo:object name='CntwChooseColorScheme.PRIMHEAD_FONTCOLOR' attribute='id'/}" value="${geo:object name='DERIVED_COMPONENT.Wizard.GetValue(CntwChooseColorScheme.PRIMHEAD_FONTCOLOR)' attribute='value'/}" /> <input id="primaryheaderfontcolor" type="color" value="${geo:object name='DERIVED_COMPONENT.Wizard.GetValue(CntwChooseColorScheme.PRIMHEAD_FONTCOLOR)' attribute='value'/}" /> <script> $("#primaryheaderfontcolor").kendoColorPicker({ value: "#000000", buttons: true, change: function(e) { $('#prim_head_font_color').val(e.value); console.log("The picked color is ", e.value); console.log(e); } }); </script>
  2. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2565 posts

    Posted 11 Jul 2014 Link to this post

    Hello Ethan,

    I am not really sure that I understand exactly what your questions is, so please accept my apologies. In general when you set the value property of the widget the color is applied and shown. The change event is fired only when there is a difference between the already selected value and the one that is currently selected. Please see the following example and let me know what I missed:

    http://jsbin.com/qekeg/1/edit

    Regards,
    Kiril Nikolov
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
Back to Top