Windows Phone Build - On-click not working in list

[Andy Parker]

Hi,

I have ported my app to Windows Phone (using the export function) and ran it using the emulator in Visual Studio.

The app works fine in IOS and Android, but the "on-click" script below does not seem to work in Windows Phone, can you tell me where I'm going wrong please?

Basically, the "createmotorwaylist function is called at startup - and this runs fine.
When the list member is clicked on, it should call "createjunctionlist" and pass the row number selected, this does not seem to work.

code
function createmotorwaylist()
{
var listelement=" &quot
var data = ['M1','M2','M3','M4','M5','M6','M6(T)','M8','M9','M11','M18','M20','M23','M25','M26','M27','M32','M40','M42','M45','M48','M49','M50','M54','M55','M56','M60','M61','M62','M66','M69','M73','M74','M77','M80','M90','M180','M275','M602','M621','A1','A1(M)','A2','A3','A3(M)','A5','A7','A8','A9','A11/A14','A14','A20','A27','A30','A38','A38(M)','A42','A46','A50','A55','A64','A68','A75','A76','A77','A78','A82','A83','A85','A87','A90','A92','A95','A96','A168','A229','A303','A417','A419','A420/ A419','A494','A550','A556','A666','A701','A702','A720','A725','A726','A737','A823','A830','A835','A887','A889','A898','A902','A956','A985','Antelope','31297'];
var html =" &quot
for(var i=0; i<data&#46;length; i++)
{
html = "<tr id='mrow_" + i + "'><td><p class='solidm' onclick='createjunctionlist(" + i + ");'> "+data+" </p></td></tr>&quot
listElement = $(html);
Appery('mlist_div')&#46;append(listElement);
}
listElement&#46;listview();
}

function createjunctionlist(rownumstr)
{
console&#46;log("createjunctionlist");
/code

[Yurii Orishchuk]

Hi Andy,

Please try to use following code instead of yours:

pre

html = "<tr id='mrow_" + i + "'<td<p class='solidm' onclick='javascript:createjunctionlist(" + i + ");' "+data+" </p</td</tr";

/pre

Regards.

[Andy Parker]

Thanks Yurii,

that hasn't made any difference.
I even connected a device to test the app to ensure it wasn't the emulator causing an issue.

the same thing happens, it simply highlights the writing as if I wanted to copy/paste it.

Any ideas please?

[Andy Parker]

Just to add, all of this is taking place on a panel that slides open when selected.

I have changed the code further to test and simplify...still does not work....

code
function createmotorwaylist()
{
var listElement=" &quot
var data = ['M1','M2','M3','M4','M5','M6','M6(T)','M8','M9','M11','M18','M20','M23','M25','M26','M27','M32','M40','M42','M45','M48','M49','M50','M54','M55','M56','M60','M61','M62','M66','M69','M73','M74','M77','M80','M90','M180','M275','M602','M621','A1','A1(M)','A2','A3','A3(M)','A5','A7','A8','A9','A11/A14','A14','A20','A27','A30','A38','A38(M)','A42','A46','A50','A55','A64','A68','A75','A76','A77','A78','A82','A83','A85','A87','A90','A92','A95','A96','A168','A229','A303','A417','A419','A420/ A419','A494','A550','A556','A666','A701','A702','A720','A725','A726','A737','A823','A830','A835','A887','A889','A898','A902','A956','A985','Antelope','31297'];
var html ='<table><tr onclick="myFunction(this)"><td>Click to show rowIndex</td></tr><tr id="mrow_1" onclick="javascript:createjunctionlist1(this)"><td><p> M2</p></td</tr><tr id="mrow_2" onclick="javascript:createjunctionlist1(this)"><td><p> M3</p></td</tr><tr id="mrow_3" onclick="javascript:createjunctionlist1(this)"><td><p> M4</p></td</tr><script>function createjunctionlist1(x) {alert("Row index is: " + x&#46;rowIndex);}</script>';
console&#46;log(html);
Appery('mlist_div')&#46;append(html);
&#47;&#47; listElement&#46;listview();
}

/code

[Andy Parker]

Just to make things simple, I have created a new test project and added buttons dynamically instead of just a table, Windows phone does not respond to the onclick.

Is this a bug? or can you help please?

code
function dynamicgrid()
{
Appery("grid1")&#46;empty(); &#47;&#47; empty the grid; the default is one row from the builder
var data = ['M1','M2','M3','M4','M5','M6','M6(T)','M8','M9','M11','M18','M20','M23','M25','M26','M27','M32','M40','M42','M45','M48','M49','M50','M54','M55','M56','M60','M61','M62','M66','M69','M73','M74','M77','M80','M90','M180','M275','M602','M621','A1','A1(M)','A2','A3','A3(M)','A5','A7','A8','A9','A11/A14','A14','A20','A27','A30','A38','A38(M)','A42','A46','A50','A55','A64','A68','A75','A76','A77','A78','A82','A83','A85','A87','A90','A92','A95','A96','A168','A229','A303','A417','A419','A420/ A419','A494','A550','A556','A666','A701','A702','A720','A725','A726','A737','A823','A830','A835','A887','A889','A898','A902','A956','A985','Antelope','31297'];

Code: Select all

 var html=" &quot 
 for (var j=0;j<10;j++) { 

html = "<tr id='row_" + j + "'>&quot
align:center onclick='javascript:displayrownum(" + j + ") "+ data[j]+">&quot
html += "<td> <button type='button' onclick='javascript:displayrownum(" + j + ")'> "+ data[j];
html += "</button></td>&quot
html += "</tr>&quot
Appery("grid1")&#46;append(html);
}
Appery("grid1")&#46;trigger('create'); &#47;&#47; for refreshing the controls so the JQuery Mobile styles will show up
}

function displayrownum(x)
{
console&#46;log("Row index is: " + x);
}
/code

this works in the browser, and in Android/iOS, but I cannot get it to work in Windows Phone.

[Andy Parker]

Sorry to be a pain, but I have a major fault in my published Windows Phone app, and I really need to get this major update out.

Any help would be appreciated, many thanks.

Andy.

[obullei]

Hello!

We are working on you problem.
Thank you for your patience.

[Evgene Karachevtsev]

Hello Andy,

Please look for the errors in Weinre for Windows Phone applications: http://devcenter.appery.io/documentat...
You code is not valid, it may have been broken in getsatisfaction, so please send a screenshot with him, or in jsfiddle.net.
For example, the onclick handler is better not to be added to the html, it is better to add it later using JS.

[Andy Parker]

thanks Evgene,

I'll look at adding this later in JS, here's a screenshot of the current code, it works in the browser test just fine.

[Andy Parker]

Evgene,

I've re-written the code, and added the "onclick" separately to the HTML.
My empty grid (which I dynamically add rows to) is called "grid1" and located on page "startScreen".

This runs in both the browser and Windows Phone!
Many thanks for pointing me in the right direction.

Here's the code below for anyone that may find themselves in this situation:

code
var rows = document&#46;getElementById('startScreen_grid1')&#46;getElementsByTagName('tbody')[0]&#46;getElementsByTagName('tr');
for (i = 0; i < rows&#46;length; i++) {
rows&#46;onclick = function() {
console&#46;log("Row Selected:"+this&#46;rowIndex);
displayrownum(this&#46;rowIndex);
};
}

/code