List row expander - works in Live & Working preview, but not when published.

[RobPolley]

This List Row expander works correctly in "mobile mode" in Live and Working preview, and it works correctly on a pc when published, but it does not work on a mobile device when published. Tapping "more" has no effect. I've temporarily published it to this link;

http://www.swimamerica.info/curriculumtemp.a5w

Thanks!

--Rob

[Lance Gurd]

Can confirm it is as you say, can you share the component so we can look at the events being used

[Lance Gurd]

I use vivaldi browser on my android phone, and when first loaded the more button does nothing, when I switch to desktop site on my phone the More button works as it should, very strange

[RobPolley]

I've zipped and attached the component. The Javascript function is below. I got both from a link in Selwin's video demonstration.

Thank you!

--Rob LessonWebsiteCopy.zip

function showRE(rowNum,listId) {


var eleB = $('{dialog.componentName}.'+listId+'.' +rowNum + '.BTN');
var ele = $('{dialog.componentName}.'+listId+'.' +rowNum + '.LPH');
A5.u.element.toggle(ele,{
show: {
type: 'slide',
duration: 'slow',
onComplete: function() { eleB.innerHTML = 'Less...'; }
},
hide: {
type: 'slide',
duration: 'slow',
onComplete: function() { eleB.innerHTML = 'More...'; }
}
} );

}

[RobPolley]

Component

[Lance Gurd]

Hi Rob,

Would also need the database, cannot open any parts of the list to check what is going on without that. You could convert your data to static JSON, near bottom of data source page on list builder and then resend the component

[RobPolley]

Lance, I wasn't sure how to send a mysql file, so I've sent the text file. There are not many records. Will this suffice? I appreciate your help.

Rob

[RobPolley]

...and it works correctly when I publish it to localhost on my dev computer, but not when I do remote test using my phone.

[RobPolley]

Found it!

There's an event called "ontouchstart". I found it in the release notes, which I've pasted, below.

UX Component - List Control - Free-form Template - Event Handlers in HTML Markup - Touch Devices - When you create a List control that uses a Freeform Layout, you define an HTML template for each row in the List.

Consider the following very trivial template:



{Firstname} {Lastname}<br />
<button onclick="alert('button1')" >button1</button>


In this example, the template contains a button with an onclick attribute that defines the button action.



NOTE: Of course the button could have been added in the 'Fields' pane of the List builder in which case the template would simply have a placeholder for the button (e.g. {Button1} ), but we are just trying to illustrate a point here.



When you run the UX that contains the List on a desktop browser, clicking on the button will fire the event. However, when you run on a mobile device (i.e. a device that supports touch events). clicking on the button will not fire the button event!

To solve this problem, the ontouchstart event can be used. In the example below, the template markup has been modified. Note that both the onclick and the ontouchstart attributes are used so that the same component will run on both touch and non-touch devices.

{Firstname} {Lastname}<br />
<button onclick="alert('button1')" ontouchstart="alert('button1')" >button1</button>

[claireshut]

RobPolley I used to work at the same time as you did on alpha 5 I have not worked in alpha for a while and I was wanting some help on getting up to speed again and was wondering if you had time or could recommend someone who had time to do a couple of hours consulting. I need basic stuff...
1. Security setup in UX environment for cloud. Just standard setup even standard app incorporated into mine
2. Help with a UX with embedded grid that has another grid with 1 to many with parent grid situation
3. publishing to cloud setup

happy to chat about rates.... I just dont know anyone anymore and cant post yet on my new email address.
thanks

[Lance Gurd]

Good news Rob,
I did manage to get your txt file into JSON and get the UX rendering, however we had a heavy family weekend, full of events which prevented me testing further.

[RobPolley]

Lance,

I appreciate your efforts!

Thank you,

Rob