[WiZaxx]

Is it possible to attach a function to the toggle component so when it changes status it can actually do something rather behaving dumb???

Thank you

[support-michael]

@WiZaxx

The toggle widget is implemented in HTML using an styled checkbox, example:

<div id="m1-Untitled1-toggle1" class="m1-toggle m1-iscroll-no-prevent-default">
    <input type="checkbox" checked="true"/>
</div>

In the following snippet of JQuery I added to the phoneui.documentReadyHandler function a call to my handler function when the toggle widget changes value:

/**
 * Called when document is loaded.
 */
phoneui.documentReadyHandler = function() {
  
  $('#m1-Untitled1-toggle1 input').change(
      function() {
        if ($(this).val()) {
          alert('toggle value: ON');
        } else {
          alert('toggle value: OFF');
        }
      });
}

[lemorlenny]

@support-wayne wrote:

@WiZaxx

The toggle widget is implemented in HTML using an styled checkbox, example:

<div id="m1-Untitled1-toggle1" class="m1-toggle m1-iscroll-no-prevent-default">
    <input type="checkbox" checked="true"/>
</div>

In the following snippet of JQuery I added to the phoneui.documentReadyHandler function a call to my handler function when the toggle widget changes value:

/**
 * Called when document is loaded.
 */
phoneui.documentReadyHandler = function() {
  
  $('#m1-Untitled1-toggle1 input').change(
      function() {
        if ($(this).val()) {
          alert('toggle value: ON');
        } else {
          alert('toggle value: OFF');
        }
      });
}

Why when I try this example I receive always ON alert?.

[paulD]

Thats because you have to give the toggle 1 a value for the if statement to work. At the moment because there is no value set at the .val() The if statement fires ON every time.

[lemorlenny]

@paulD wrote:

Thats because you have to give the toggle 1 a value for the if statement to work. At the moment because there is no value set at the .val() The if statement fires ON every time.

you means in the value property?, I tried to insert a value (literal,boolean or numeric) but $(this).val() return only this, can you clarify pls.

Thanks.

[paulD]

In the widget properties panel for the toggle widget you can assign values for the two states of the toggle.

thats the value you need to use in the if statement.

[lemorlenny]

@paulD wrote:

In the widget properties panel for the toggle widget you can assign values for the two states of the toggle.

thats the value you need to use in the if statement.

Ok, I used this:

alert( $('input[name="toggle1"]').is(':checked'));

[paulD]

So sorry Lenny i was wrong in what I was saying. I am also learning!

I had a play this morning and got it to work using

/**
 * Called when document is loaded.
 */
phoneui.documentReadyHandler = function() {

  $('#m1-toggle-toggle1 input').change(
  
      function() {
        if ($('input[name="toggle1"]').is(':checked')) {
          alert('toggle value: ON');
    
        } else {
          alert('toggle value: OFF');
          
        }
      });
  

}
  

It now fires on and off depending on the state. Hope this helps

Paul

[lemorlenny]

@paulD wrote:

So sorry Lenny i was wrong in what I was saying. I am also learning!

I had a play this morning and got it to work using

/**
 * Called when document is loaded.
 */
phoneui.documentReadyHandler = function() {

  $('#m1-toggle-toggle1 input').change(
  
      function() {
        if ($('input[name="toggle1"]').is(':checked')) {
          alert('toggle value: ON');
    
        } else {
          alert('toggle value: OFF');
          
        }
      });
  

}
  

It now fires on and off depending on the state. Hope this helps

Paul

Many thanks for your reply Paul.

[Author]

Posts