on 10-23-2013 1:01 PM
Hi,
i Customize the listview (Refer the Following Code), But when i click on List view, Detail Page is Opening with blank Data. Can any One Help on this Issue.
My Cutomized List View Code.
if (destScreenKey === 'DisputeList123') {
try {
var message = getCurrentMessageValueCollection();
var itemList = message.getData("DisputeList");
var items = itemList.getValue();
var numOfItems = items.length;
var i = 0;
alert(numOfItems);
// iterate through the results and build our list
var htmlOutput = "<div id='supportViewList'><ul id='Support_content' data-role='listview' data-inset='true'>";
htmlOutput += '<style> body{font-family:Arial, Helvetica, sans-serif; color:#FFFFFF; background-color:#51A0D5; font-size:13px;} </style>';
var firstOrder = '';
while (i < numOfItems) {
var currItem = items[i];
var _DisputeTitle = currItem.getData("DisputeList_TITLE_attribKey").getValue();
var _DisputeId = currItem.getData("DisputeList_CASEID_attribKey").getValue();
var _InvoiceNo = currItem.getData("DisputeList_INVOICENO_attribKey").getValue();
var _VendorInvNo = "";
try
{
_VendorInvNo = currItem.getData("DisputeList_VENDORINVNO_attribKey").getValue();
}
catch (err) {
_VendorInvNo ="";
}
var _DisputeStatus = "";
try
{
_DisputeStatus = currItem.getData("DisputeList_DISPUTESTATUS_attribKey").getValue();
}
catch (err) {
_DisputeStatus ="";
}
var _DisputeYear = currItem.getData("DisputeList_GJAHR_attribKey").getValue();
htmlOutput += "<li><a id ='" + currItem.getKey() + "' class='listClick'>";
htmlOutput += '<div style="width:40%; float:left; font-size:15px; margin-top:2px; text-align:right;">Dispute Title:</div>';
htmlOutput += '<div style="width:60%; float:left; text-indent:10px; font-weight:bold; font-size:18px;">'
+ _DisputeTitle + '</div>';
htmlOutput += '<div style="clear:both; height:5px;"></div>';
htmlOutput += '<div style="width:40%; float:left; text-align:right;">Dispute ID:</div>';
htmlOutput += '<div style="width:60%; float:left; text-indent:10px; font-weight:bold; font-size:15px;">'
+ _DisputeId + '</div>';
htmlOutput += '<div style="clear:both; height:5px;"></div>';
htmlOutput += '<div style="width:40%; float:left; text-align:right;">Invoice No.:</div>';
htmlOutput += '<div style="width:60%; float:left; text-indent:10px; font-weight:bold; font-size:15px;">'
+ _InvoiceNo + '</div>';
htmlOutput += '<div style="clear:both; height:5px;"></div>';
htmlOutput += '<div style="width:40%; float:left; text-align:right;">Vendor Invoice ID:</div>';
htmlOutput += '<div style="width:60%; float:left; text-indent:10px; font-weight:bold; font-size:15px;">'
+ _VendorInvNo + '</div>';
htmlOutput += '<div style="clear:both; height:5px;"></div>';
htmlOutput += '<div style="width:40%; float:left; text-align:right;">Dispute Status:</div>';
htmlOutput += '<div style="width:60%; float:left; text-indent:10px; font-weight:bold; font-size:15px;">'
+ _DisputeStatus + '</div>';
htmlOutput += '<div style="clear:both; height:5px;"></div>';
htmlOutput += '<div style="background-color:#2c4e69; float:right; padding:5px; position:relative; margin-top:-26px; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px">Year: <span style="font-weight:bold;">'+ _DisputeYear +' </span></div>';
// htmlOutput += '</div>';
i++;
}
htmlOutput += '</ul></div>';
// alert("4");
// append the html to the appropriate form depending on the key
var listview = $('div[id="supportViewList"]');
if (listview.length > 0) {
var ul = $(listview[0]).find('ul[data-role="listview"]');
if (ul.length > 0) {
htmlOutput = htmlOutput.replace("<div id='supportViewList'><ul id='Support_content' data-role='listview' data-inset='true'>","");
ul.html(htmlOutput);
ul.listview('refresh');
}
} else {
$('#DisputeListForm').children().eq(0).hide();
$('#DisputeListForm').children().eq(2).hide();
$('#DisputeListForm').children().eq(3).hide();
$('#DisputeListForm').children().eq(1).after(htmlOutput);
}
// add the listener based on the class added in the code above
$(".listClick").click(function() {
navigateForward("DisputeListDetail", this.id);
if (isBlackBerry()) {
return;
}
});
}
catch (e) {
alert("got an exception: " + e);
}
}
Found it working with the below code:
New code :
//add the listener based on the class added in the code above
$(".listClick").click(function(){
currListDivID = $(this).parent().parent();
$(this).parent().parent().addClass("ui-btn-active");
//special case for bb
navigateForward("Detail_Screen", this.id );
if (isBlackBerry()) {
return;
}
});
Old code:
// add the listener based on the class added in the code above
$(".listClick").click(function() {
navigateForward("Detail_Screen", this.id);
if (isBlackBerry()) {
return;
}
});
With new versions of SDKs, the old code is not working.
Add class="listClick" inside <li> tag.
Midhun VP
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
Hi
I hope you have done all these customization in beforeNavigationForward method.
Use the beforeshowscreen or aftershowscreen. Because some times if you are replacing html in beforenavigationforward, it will not find the particular tag where .html() method used to push new html structure.
Have a try.
Regards
Yokesvaran Kumarasamy
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
Regards
Yokesvaran Kumarasamy
Hi Krishna Vinjam,
In the below method "this.id" returns wrong value, I checked with my project.
$(".listClick").click(function() {
navigateForward("DisputeListDetail", this.id);
if (isBlackBerry()) {
return;
}
});
For example,
In my project this.id returns 10001. but it should be like "Employee&<>10001", "Employee" is taken from the hybridapp_jqm.html
<div class="listview" screen="Employee_list" id="Employee" wrap_data="false">
You can check the id value from the default list javascript which resides in html.
Additionally i have added alert("target-"+target.id).
function itemSelected( target ) {
alert("target-"+target.id);
navigateForward("EmployeeDetail", target.id );
}
target.id should match with this.id in custom.js file.
So in custom.js navigation forward method should look like below
navigateForward("EmployeeDetail", "Employee&<>"+this.id );
I hope this will fix your issue.
Regards
Yokesvaran Kumarasamy
Also where is the closing tags for <li><a ?
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
Are performing performing these steps:
1. Drag and drop MBO to the designer result in two screen; list screen and detail screen
2. Write custom code for the listview. It overwrites the existing list. Hence the list key exists and in the detail screen the list item keys will be available.
Add "return true" in the end of the if loop.
Keep and alert inside the $(".listClick").click(function() {} and check whether it goes inside.
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
Hi, i am attaching the Screen Shots here, After Drag&Drop the MBO, i got 2 Screens --> Listview & Detail. in Custom.js i done the changes in Listview Screen (Customized Listview), in this click i call the Detail Page, this is Right process/ Not?
OR i need to Create One More Screen For Customization of Listview and from that Screen i need to call the Details Screen?
Please check & Update me if u found any mistake. Are tell me the Right Process...
. this code should have worked. Anyway finally do this. Drag and drop the HTMLView from the control to the list screen and give default value (in properties) as <div id="HTMLList"></div> and give any key.
In the custom code replace
$('#DisputeListForm').children().eq(0).hide();
$('#DisputeListForm').children().eq(2).hide();
$('#DisputeListForm').children().eq(3).hide();
$('#DisputeListForm').children().eq(1).after(htmlOutput);
with
var topOfFormElem1 = document.getElementById("HTMLList");
topOfFormElem1.innerHTML = htmlOutput;
User | Count |
---|---|
87 | |
10 | |
10 | |
9 | |
7 | |
7 | |
6 | |
5 | |
4 | |
4 |
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.