[Max87]

Hi guys,
I experiment with toggle buttons in my app – the goal is to let user choose alarm type. He can choose from beeping or vibrating(or both).
When I set up Settings page, toggles appears to work fine. But late in my app I reload all pages, so toggles are in default state. Is there any way to save it’s state and re-set it back after reload?
Thanks

[support-octavio]

Hi Max,

I did a little test design. Create a function save, that is called when user pushes a button:

  function save(){
  
   var status = $('#m1-Togle-toggle1 > input').attr('checked');
  localStorage.setItem("togle-value",status);
    
  }

And put the next code in phoneui.documentReadyHandler function:

if(localStorage.getItem("togle-value")==true){
  
    $('#m1-Togle-toggle1 > input').attr('checked','checked') ;

}
else{
     $('#m1-Togle-toggle1 > input').attr('checked','') ;
}

It works fine for me. Let me know if is helpful for you.

[Max87]

Hi Octavio,
thanks for code, it’s working for me now. But I had to do some changes, because condition which is placed in documentReady was not working properly – even if value toggle-value was set in localstorage to undeffined, the checkbox was checked.
Solution is simple – I had to change if(localStorage.getItem(“togle-value”)==true) to if(localStorage.getItem(“togle-value”)==“checked”) and $(‘#m1-Togle-toggle1 > input’).attr(‘checked’,”) to $(‘#m1-Togle-toggle1 > input’).attr(‘checked’,false)

Now everything seems to be working OK(in TestCenter), I’ll try to test in my iPhone.
Thanks again for help.

[will]

hi max,

sorry if this is unrelated but do you know how you could have a code that deselects checklists both for computations and visually.
currently i use a button with runJavascript:
$(‘select[name*=”list”] :selected’).prop(“selected”, false);
it deselects for computations but visually they still appear ticked

your problem sounds similar so wondered if you could help.

thanks

[Max87]

Hi will,
I would try preprocess DOM function, which forces UI to update.
Syntax is phoneui.preprocessDOM(‘name of screen to update UI’);

Please let me know if it helps you.
Regards

[will]

thanks for help using:

phoneui.preprocessDOM(‘name*=[m1]’){
$(‘select[name*=”list”] :selected’).prop(“selected”, false);
}
called in the custom java libray on a transition back to the home page but no luck
will keep playing around and post if i can get it to work.

[support-octavio]

Hi Will,

After discuss your request with the dev team. This is the way to achieve it.

// Note: m1-unselect-list1 is an ID 
// of <ul> element, taken from TC/Tools/DOM Inspector
var selListId = 'm1-unselect-list1';
var listName = 'list1';

var itemToSelect = $('select[name='+listName+'] :selected').prop("selected", false); 

var selId = $('#' + selListId + '> li').each(
function (i) {
  $(this)[i == itemToSelect ? 'addClass' : 'removeClass'](m1Design.css("selected"));
});

// This line updates hidden select, for the case the whole 
// design will be used as a form
phoneui.preprocessDOM('#' + selListId);

Please let me know how it goes for you.

[will]

thanks this works great using:
function REFRESH() {
var selListId = ‘m1-accessories_home-list1’;
var listName = ‘list1’;

var itemToSelect = $(‘select[name=’+listName+’] :selected’).prop(“selected”, false);

var selId = $(‘#’ + selListId + ‘> li’).each(
function (i) {
$(this)[i == itemToSelect ? ‘addClass’ : ‘removeClass’](m1Design.css(“selected”));
});

phoneui.preprocessDOM(‘#’ + selListId);
}

Could I ask if there is any way I could amend this code so I apply the deselect to every list with “list” in the i.d. somewhere.
similar to the code $(‘select[name*=”list”] :selected’).val when collecting values for “list1”, “list2”, “list3”
or do i need to make an individual function for each list name and page?
(there are at least a 50 different list id’s i want to deselect and even more if the page name is a variable so i would appreciate a quick way :))

[support-octavio]

Hi will,

This code should do what you requested:

$('.m1-selection-list > li').each(function (i) {
  $(this).removeClass(m1Design.css("selected"));
});
phoneui.preprocessDOM();

[will]

Thanks works perfectly 🙂

[will]

can this code be extended to reset select list menus also and if so could you post it for me please.

[KariSolamaki]

@support-octavio wrote:

Hi will,
This code should do what you requested:

$('.m1-selection-list > li').each(function (i) {
$(this).removeClass(m1Design.css("selected"));
});
phoneui.preprocessDOM();

I have search this board how to change programmatically selection in (single selection) list, but not have figured out how to do that.
My page is Page1 and list is listTable and item ID (which should be selected instead of an other) is itemNro3.

BTW, code above does not need function(i), just function() is enough.

Best regards, ET

[support-octavio]

Hi ET,

According to your reply on this thread with the same question, you managed to have it working with the solution provided there, right?
http://www.genuitec.com/support-genuitec/viewtopic.php?p=22856#p22856

[Author]

Posts