Hybrid App Customized ListView Migration Issue From SUP 2.2 To SMP 2.3

[Former Member]

Hi,

i develop one hybrid application on SUP 2.2 Version. in this application i customize the default listview control look & feel from Custom.js file.

that application is working fine when we deploy in SUP 2.2 Version. Now i migrate that application in to SMP 2.3.

Data & Functionality everything working fine. But when i scroll the custom list view it is not Scrolling smoothly(same code is working in SMP 2.2 Properly). i need to touch the screen more than  5 to 6 time they only it will go to the last record, same problem if i want to go to first record also.

Note : in fact i re-develop the Entire Application in 2.3 Also still same problem is coming. if i use the simple listview(defult, No customization) then it is working fine.

For reference here is my Code :

hwc.customBeforeNavigateForward = function(screenKey, destScreenKey) {

if (destScreenKey === 'Dispute_List' && screenKey === 'Search_Criteria') {

  try {

  //showAlertDialog("Dispute_List.","mVDM");

/* showAlertDialog(_IsWindowsMobile);

  if (_IsWindowsMobile == true)

  {

  showAlertDialog("Find : " + _IsWindowsMobile);

  navigateForward("WM_DisputeList");

  return false;

  }

  */

  _VendorEmailId_forSendEmail = "";

     _OwnerEmailId_forSendEmail = "";

     _DisputeNumber_forSendEmail ="";

  var message = getCurrentMessageValueCollection();

  var itemList = message.getData("DisputeList");

  var items = itemList.getValue();

  _DisputeItems = items;

  var numOfItems = items.length;

  var i = 0;

  if (numOfItems === 0)

  {

  showAlertDialog("No disputes found for this criteria.","mVDM");

  return false;

  }

  // iterate through the results and build our list

  var htmlOutput =  "<div id='supportViewList'><ul id='Support_content' data-role='listview' data-inset='true' style='box-shadow:none; border-radius:0px' >";

  //hwc.log("itemList" + itemList);

  //showAlertDialog("itemList:" +  itemList);

  while (i < numOfItems) {

  var currItem = items[i];

  // hwc.log("currItem" + currItem);

  // showAlertDialog("currItem:" +  currItem);

  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 _CreatedDate = currItem.getData("DisputeList_CRDAT_attribKey").getValue().substring(0, 10);

  var _VendorInvNo = "";

  try

  {

  _VendorInvNo = currItem.getData("DisputeList_VENDORINVNO_attribKey").getValue();

  }

  catch (err) {

  _VendorInvNo ="";

  }

  var _DisputeStatusValue = "";

  try

  {

  _DisputeStatusValue = currItem.getData("DisputeList_DISPUTESTATUS_attribKey").getValue();

  }

  catch (err) {

  _DisputeStatusValue ="";

  }

  var _DisputeYear = currItem.getData("DisputeList_GJAHR_attribKey").getValue();

  //htmlOutput += '<li><a id ="' + currItem.getKey() + '" class="listClick">';

  htmlOutput += '<li style="margin-bottom:10px;"><a id ="' + i + '" class="listClick">';

  htmlOutput += '<div style="width:100%; color:#FFFFFF; font-size:15px; text-align:left; font-weight:bold; text-shadow:1px 1px #233f58;">' + _DisputeTitle + '</div>';

  htmlOutput += '<div style="clear:both; height:8px;"></div>';

  htmlOutput += '<div style="width:100%; color:#FFFFFF; font-size:13px; text-align:left; font-weight:normal; text-shadow:1px 1px #233f58; padding-bottom:3px;">Dispute ID: ' + _DisputeId + '</div>';

  htmlOutput += '<div style="width:100%; color:#FFFFFF; font-size:13px; text-align:left; font-weight:normal; text-shadow:1px 1px #233f58; padding-bottom:3px;"> Invoice No: ' + _InvoiceNo + '</div>';

  htmlOutput += '<div style="width:100%; color:#FFFFFF; font-size:13px; text-align:left; font-weight:normal; text-shadow:1px 1px #233f58; padding-bottom:3px;"> Vendor Invoice No: ' + _VendorInvNo + '</div>';

  htmlOutput += '<div style="clear:both; height:10px;"></div>';

  htmlOutput += '<div style=" display:block; margin:0 -20px -12px -20px; padding:7px 0 5px 0; background-color:#044062; color:#FFFFFF; font-size:12px; text-align:left; font-weight:bold; text-shadow:1px 1px #233f58; ">';

  htmlOutput += '<div style="float:left; margin-left:10px;"><img src="images/calendar_icon.png" alt="" style="position:relative; top:2px; margin-right:2px;"/> Date: ' + _CreatedDate + '</div>';

  if (_DisputeStatusValue === "INPROCESS")

  {

  htmlOutput += '<div style="float:right; margin-right:10px;"><img src="images/in_process_icon.png" alt="" style="position:relative; top:2px; margin-right:2px;"/> ' + _DisputeStatusValue + '</div>';

  }

  else if (_DisputeStatusValue === "WITHVENDOR"){

  htmlOutput += '<div style="float:right; margin-right:10px;"><img src="images/pending_icon.png" alt="" style="position:relative; top:2px; margin-right:2px;"/> ' + _DisputeStatusValue + '</div>';

  }

  else {

  htmlOutput += '<div style="float:right; margin-right:10px;"><img src="images/completed_icon.png" alt="" style="position:relative; top:2px; margin-right:2px;"/> ' + _DisputeStatusValue + '</div>';

  }

  htmlOutput += '<div style="clear:both"></div>';

  htmlOutput += '</div>';

  htmlOutput += "</a></li>";

  i++;

  }

  htmlOutput += '</ul></div>';

  // append the html to the appropriate form depending on the key

  var listview = $('div[id="supportViewList"]');

  if (listview.length > 0) {

  //showAlertDialog("Test Refersh");

  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' style='box-shadow:none; border-radius:0px' >","");

  ul.html(htmlOutput);

  ul.listview('refresh');

  }

  } else {

  $('#Dispute_ListForm').children().eq(0).hide();

  $('#Dispute_ListForm').children().eq(2).hide();

  $('#Dispute_ListForm').children().eq(3).hide();

  $('#Dispute_ListForm').children().eq(1).after(htmlOutput);

  }

  // add the listener based on the class added in the code above

  $(".listClick").click(function() {

  _SelectedId = this.id;

  navigateForward("DisputeList_Detail", this.id);

  //navigateForward("Dispute_Details_HTML_View", this.id);

  if (isBlackBerry()) {

  return;

  }

  });

}

  catch (e) {

  // showAlertDialog("got an exception: " + e);

  }

  return true;

[Former Member · Accepted solution]

Hi,

After my R&D, in SMP 2.3 Version Customized List view could not work properly. Scrolling could not work properly if that List view is Customized Using custom.js file.

Same thing is confirmed by SAP Technical team also.

[former_member192923 · Accepted solution]

Hi Krishna,

That means any customization is happen in "custom.js" file scroll is not working properly am i right?

Am also facing this issue in every screen in my application.

Ranjith Lingala

[Former Member · Accepted solution]

Hi Ranjith,

Yes, That is True.... in SMP 2.3 this problem is there....

if Application is Working Properly in SMP 2.2, After Migrate into SMP 2.3 this Problem will come...

Thanks

Krishna

[Jitendra_Kansal]

Hi

Can you please clarify on this

Rgrds,

Jitendra

[Former Member]

Are there any service packs on top of SMP 2.3 (e.g. SP04)?

The versions of jQuery and jQuery Mobile differ between SMP 2.2 and 2.3.

If you do not migrate your 2.2 application, e.g. take the 2.2 zip file and deploy it directly to your 2.3 server, do you still see the same problem?  In this scenario, you are still running the 2.2 built application.

Thanks,

Andrew.