facebook

Add list items dynamically : CLOSED

  1. MobiOne Archive
  2.  > 
  3. Getting Help – General
Viewing 15 posts - 1 through 15 (of 18 total)
  • Author
    Posts
  • #346033 Reply

    Code_A
    Member

    I am trying to dynamically add list items to a select list based on a json response from a database on my web server. I tried to follow the Mobi Bike News example (along with referencing the m1 generated html), but I am not able to get the list items to show up in the simulator. Below is my code, and I have confirmed that there is data in the response.

    var list = $('#m1-RSS-lstSite');
    
              //get total items to add
              var itemCnt = response.sitestatus.length; 
    
              //remove current list items
              $(list).empty();
              //$(list).children().remove(); 
              phoneui.showActivityDialog('Loading sites...');
              
            //build list 
            for (var i=0; i<itemCnt; i++){
                   $(list).append(
                       
                        '<li id="m1-RRS-site' + i + '" class="' +
                           (i == 0 ? 'm1-first' : '') + 
                        (i == (itemCnt - 1) ? 'm1-last' : '') + 
                         ' m1-clickable m1-highlight" ' +
                         ' value="' + response.sitestatus[i].siteID + '">' +
                         ' <label id="m1-RRS-' + i + '" class="m1-active-color-1">' + response.sitestatus[i].siteName + '</label>' +
                       '</li>'
                   );
            
            }
            // Set scrollable panel size
            list.parent().attr('data-layout-content-height', (itemCnt-1)*44 + 20);
            phoneui.preprocessDOM(list);  
            phoneui.hideActivityDialog();

    Thanks for your help!

    #346059 Reply

    Hi Code A,

    Have you check if there is some javascript syntax error?
    Is the list built without data?
    Could you share a sample project so we can review it easily? If you want to keep data private send it to support at genuitec dot com, use title mobione data from Code A

    #346078 Reply

    Code_A
    Member

    Thank you for the reply.

    I do not believe there is a syntax error in the script. The list is built without data in MobiOne. I have a list without any children. I am trying to add the children (list items) dynamically.

    I have simplified the code for testing but still no luck. Am I going about this the right way or is there an easier method?

    var list = $('#m1-RSS-lstSite');
    
    //remove current list items
    $(list).empty();
           
    //build list
    for (var i=0; i<10; i++){
    list.append('<li id = "'+i+'"> '+i+' List Item </li>');
    }
    phoneui.preprocessDOM(list); 
    #346115 Reply

    Brandon
    Member

    Just a guess without seeing any additional code, but are you sure that response.sitestatus.length is returning a value?
    to check it try: alert(response.sitestatus.length);

    #346127 Reply

    Hi Code A,

    I have compared the code you have provided with the code in the custom list example and found out that there’s a little difference in the way you are removing previous items:

    var list = $(‘#m1-RSS-lstSite’);

    //remove current list items
    $(list).empty();

    //build list
    for (var i=0; i<10; i++){
    list.append(‘<li id = “‘+i+'”> ‘+i+’ List Item </li>’);
    }
    phoneui.preprocessDOM(list);

    Change code in bold for:

    list.children(list).remove();

    Tested it in that way and worked well for me. Let me know how it goes.

    #346149 Reply

    Code_A
    Member

    Thanks for the reply.

    I tried the code change you suggested but it did not seem to fix the issue. I will download the custom list example you provided and see if I can get it working by building a smaller, simpler app and following the example. I will feedback my findings.

    Somehow I missed that how-to!

    #346177 Reply

    Hi Code A,

    Let us know how it goes and if you need further assistance just let us know.

    #346188 Reply

    Code_A
    Member

    After following the example, I am closer but still cannot seem to get things to work properly. Not sure if this is right or not, but I am using the code from the m1 generated html. In the example, the code is calling the images externally. Is that a necessity?

    The list is building, but I am seeing 3 issues:

    1. The selection “checkmarks” are not showing up when a list item is selected.
    2. The selectListItem “widths” are taking up the whole screen.
    3. The “firstItem” class is not being applied.

    I have attached the file I have been testing.

    Attachments:
    You must be logged in to view attached files.
    #346242 Reply

    Hi Code A,

    This sample design should be helpful:

    Attachments:
    You must be logged in to view attached files.
    #346251 Reply

    Code_A
    Member

    Thank You Ocatavio! I got it working correctly with the example you provided.

    #346365 Reply

    Code_A
    Member

    I am building my list dynamically exactly as the example shows. Everything is working great, until I try to get the value of one of the list items. I am trying the 2 methods below, but neither are giving me what I would expect. How do I retrieve the “data-val” value that I assigned to the item?

    alert($('select[name="list1"] :selected')) //returns [object object]
    alert($('select[name="list1"]').val()) //returns the text value from the "original" list before it dynamically changed, i.e. "Item"

    Per the example, the data value is being assigned dynamically using the method below:

    clone.attr('data-val', "val" + i);

    Thanks for the help.

    Attachments:
    You must be logged in to view attached files.
    #346399 Reply

    Code_A
    Member

    I have also tried using the following methods too but with no luck. I feel like I am missing something very simple.

    alert($('select[name="list1"]').attr('data-val'));
    alert($('select[name="list1"]').data('val'));
    #346503 Reply

    Code_A
    Member

    Anyone?

    I could really use some help with this…

    #346516 Reply

    Hi Code A,

    I have escalated this problem to the dev team. The problem seems to be that the hidden <s elect>(disregard space) that mobione uses to manage user’s data is keeping just the old item so it can’t get the value that you select on the UI side. Will share more info as soon as I have an status update.

    #346517 Reply

    Code_A
    Member

    Thank you for the reply and letting me know what us going on. This has been driving me crazy and my app development is at a standstill right now until I can get this working.

    I would like to know what the eta is on a fix because if it’s going to be awhile then I may just need to redesign my GUI. Do you know if the same issue exists with the combobox or the select list menu?

Viewing 15 posts - 1 through 15 (of 18 total)
Reply To: Add list items dynamically : CLOSED

You must be logged in to post in the forum log in