Results 1 to 2 of 2
  1.    #1  
    I'm trying to embed a list in a scene overlay that I have:

    Code:
    		<div id="overlayMain2" class="overlay2">
    			<table>
    				<tr>
    					<br><span id="mixText">#{mixInfo}</span>
    				</tr>
    				<tr>
    					   <div class="palm-list" id="taglist" x-mojo-element="List">
          					#{-listElements}
       					</div>
    				</tr>
    				<tr>
    					<div x-mojo-tap-feedback="delayed">
    						<div id="userFull"><br><span id="userInfo">#{user}</span></div>
    					</div>
    				</tr>
    				<tr>
    					<div x-mojo-tap-feedback="delayed">
    						<br><img src="images/playunselected.png" alt="playbutton" class="playIcon" id="play"/> <img src="images/blank.png" alt="likebutton" class="likeIcon" id="like"/>
    					</div>
    				</tr>
    			</table>
    		</div>
    item template:

    Code:
    <div class="palm-row">
    <table style="width:100%; height:100%">
      <tr>
        <th>
          <div x-mojo-touch-feedback="delayed">
           <id="tag1" style="font-size:11pt;  border:solid;  border-color:white; background-color:  #FFFFFF;  -webkit-border-radius:5pt; padding:2pt; float:center;">
              #{tag1}
          </div>  
        </th>
        <th>
          <div x-mojo-touch-feedback="delayed">
            <id="tag2" style="font-size:11pt; border:solid;  border-color:white; background-color: #FFFFFF;  -webkit-border-radius:5pt; padding:2pt; float:center;">
              #{tag2}
         </div>
        </th>
        <th>
          <div x-mojo-touch-feedback="delayed">
            <id="tag3" style="font-size:11pt; border:solid; border-color:white; background-color: #FFFFFF; -webkit-border-radius:5pt; padding:2pt; float:center;">
              #{tag3}
          </div>  
        </th>
      </tr>
    </table>
    </div>
    The overlay appears when a image is tapped, and the contents of the overlay depend on the image you tap, so i have to setup the list on each new tap event.

    Here's my setup code:

    Code:
    			attributes = {
    					itemTemplate: "templates/tagTemplate",
    					//listTemplate: "template/tagContainer",
    					swipeToDelete: false,
    					reorderable: false
    					};
    			model = {
          listTitle: "tags",
          items : this.fillTagGrid(tags.split(",")).getList().items
          };
    			this.controller.setupWidget("taglist", attributes, model);
    this.fillTagGrid(tags.split(",")).getList().items looks like this [{tag1:"rock", tag2:"synth", tag3:"dubstep},...]

    Everything is working great except the list doesn't show up.

    Any ideas? I have never setup a list in straight html before, i've always used ares, so i'm not sure if i'm doing it right.
  2. #2  
    I consider Mojo to be one of the worst things about WebOS (and that is not a short list), so I don't really know it's syntax, however this is not proper html:

    <div x-mojo-touch-feedback="delayed">
    <id="tag1" style="font-size:11pt; border:solid; border-color:white; background-color: #FFFFFF; -webkit-border-radius:5pt; padding:2pt; float:center;">
    #{tag1}
    </div>

    It should be:

    <div x-mojo-touch-feedback="delayed" id="tag1" style="font-size:11pt; border:solid; border-color:white; background-color: #FFFFFF; -webkit-border-radius:5pt; padding:2pt; float:center;">
    #{tag1}
    </div>

Posting Permissions