anon
Posts: 0
Joined: Sun Apr 13, 2014 12:10 am

Manually Appending Appery DOM objects

Can someone who has done this give me a hand? I am trying to manually append these "chat1" list elements to a list "allChats1".
All I seem to be accomplishing is writing only one to the list. I am confident that the problem persists in the appendTo logic, as I am correctly creating list elements and setting their IDs uniquely.

Code: Select all

  for(var i = 0; i < this.cache[0].length; i++){ 
             var div = Appery("chat1"); 
             div.attr("id",currentPage+"_chat1_"+i); 
             div.find(Appery("messageID")).text(this.cache[0][i]._id); 
             div.find(Appery("buyerName")).text(this.cache[0][i].user_name); 
             div.find(Appery("productID")).text(this.cache[0][i].productID); 
          div.appendTo(Appery("allChats1")); 
         }
Yurii Orishchuk
Posts: 0
Joined: Fri Feb 14, 2014 8:20 am

Manually Appending Appery DOM objects

Hi Anon.

Your code has a lot of mistakes.

Please provide us information about what do you want to do with this code and we will help.

Regards.

anon
Posts: 0
Joined: Sun Apr 13, 2014 12:10 am

Manually Appending Appery DOM objects

I want to append a list with list elements. The only thing is that the append isn't appending, it is rewriting the previous element. allChats1 is the list and chat1 is the element which I want as many as I have in this.cache[0]. currentPage is passed as a parameter to the js which contains the page name.

anon
Posts: 0
Joined: Sun Apr 13, 2014 12:10 am

Manually Appending Appery DOM objects

Latest update.. I think I have narrowed it down to this. The append is literally appending nothing because the div variable that I assigned earlier to a DOM object is JSON. I need to convert it back to HTML so append knows what to do. There are no html tags in Appery("myDiv"). How do I do this?

Evgene Karachevtsev
Posts: 12
Joined: Mon Apr 28, 2014 1:12 pm

Manually Appending Appery DOM objects

Hello,
Test this sample example. You can change it for your purpose:
code
$('[name="mobilelist_2"]')&#46;append(' <li> asdsf</li>');
$('[name="mobilelist_2"]')&#46;listview('refresh');
/code
mobilelist_2 - name of your list component

anon
Posts: 0
Joined: Sun Apr 13, 2014 12:10 am

Manually Appending Appery DOM objects

Okay, so I managed to figure out the appending but this was done by manually adding the string .... which sucks and will be a nightmare for styling, but it is rendering to the page. Now the critical piece is really troubling me. So the list appends and correctly adds the list elements with the data desired (injecting the values into the html string). But when I go to log the li on click, the weirdest thing happens, it displays:

Code: Select all

 '&lt li id=​"BuyerItemList_chat2_0" name=​"chat2" data-icon=​"false" class=​"ui-li-static ui-body-inherit ui-last-child" &gt​... &lt /li &gt  

BUT when I try to expand this to see the inner HTML, it just deletes the ... and nothing else shows. This means that when I try to do a $.find(Appery("messageID")) or something on it (fields that I hard coded into the string I appended), it returns undefined. Infact, jQuery thinks that there are no children of the node.

Investigating this further, if I were to append any text (html) to an object, it looks like only the first level element is added to the element, and the innerHTML doesn't display in the element viewer on my browser.

Could this be a bug with jQuery Mobile, or Appery? Help is greatly appreciated

anon
Posts: 0
Joined: Sun Apr 13, 2014 12:10 am

Manually Appending Appery DOM objects

Appery("allChats1").append('&lt li id="'+id+'" name="chat2" data-icon="false"&gt &lt div class="ui-li-static-container"&gt &lt div class="'+currentPage+'_itemGrid2_wrapper" data-wrapper-for="itemGrid2" dsrefid="chat2" idx="'+j+'"&gt &lt table id="'+currentPage+'itemGrid2" class="'+currentPage+'itemGrid2" dsid="itemGrid2" name="itemGrid2" cellpadding="0" cellspacing="0"&gt &lt colgroup&gt &lt col style="width:auto;"&gt &lt col style="width:172px;"&gt &lt /colgroup&gt &lt tbody&gt &lt tr class="'+currentPage+'itemGrid2_row_0"&gt &lt td id="'+currentPage+'picCell2'+j+'" name="picCell2" class="'+currentPage+'picCell2" colspan="1" rowspan="1"&gt &lt div class="cell-wrapper"&gt &lt Image id="'+currentPage+'itemImage2" dsid="itemImage2" name="itemImage2"&gt &lt &gt &lt /td&gt &lt td id="'+currentPage+'Cell2'+j+'" name="Cell2" class="'+currentPage+'Cell2" colspan="1" rowspan="1"&gt &lt div class="cell-wrapper"&gt &lt div name="sellerName" id="'+currentPage+'sellerName" dsid="sellerName" data-role="appery_label" class="messagePerson '+currentPage+'sellerName"&gt '+sellerName+'&lt &gt &lt div name="lastMessage2" id="'+currentPage+'lastMessage2" dsid="lastMessage2" data-role="appery_label" class="'+currentPage+'lastMessage2"&gt '+message+'&lt &gt &lt div name="productID2" id="'+currentPage+'productID2" dsid="productID2" data-role="appery_label" class="'+currentPage+'productID2"&gt '+productID+'&lt &gt &lt div name="messageID2" id="'+currentPage+'messageID2" dsid="messageID2" data-role="appery_label" class="'+currentPage+'messageID2"&gt '+messageID+'&lt &gt &lt &gt &lt /td&gt &lt /tr&gt &lt /tbody&gt &lt /table&gt &lt &gt &lt &gt &lt /li&gt ').listview("refresh");

This is what the append looks like

Evgene Karachevtsev
Posts: 12
Joined: Mon Apr 28, 2014 1:12 pm

Manually Appending Appery DOM objects

Hello,

Could you share app link and write all steps which we have to do to reproduce errors.
http://docs.appery.io/documentation/s...

Kateryna Grynko
Posts: 0
Joined: Thu Nov 15, 2012 9:13 am

Manually Appending Appery DOM objects

Hello,

Did you solve the issue?

Return to “Issues”