UI5 Table refresh

[Former Member]

Hi All,

One of my requirement is to save the data from the text field and show the saved data into the table at the bottom.Also update the data when the user edits.

When the user edits the new data is updated in the grid but when I select the row it gives the old cell value.

Please see the code attached and give me a better solution.

var oTableCalc = new sap.ui.table.Table("maintable",{

  id : 'CalcTable',

  visibleRowCount: 5,

  firstVisibleRow: 0,

  selectionMode: sap.ui.table.SelectionMode.Single,

  fixedColumnCount: 1,

  editable:false

  });

	$.ajax({
								type: "POST",
								url:'/XMII/Illuminator',
								async: false,
								cache:false,
								data: {"QueryTemplate":"HZL/Call_StorProc", "Content-Type": "text/xml","Param.1":oDatePicker1.getValue(),"Param.2":oDropdownBox3.getValue(), "Param.3":oDatePicker1.getValue(),"Param.4":oTF1.getValue(), "Param.5":oTF3.getValue(), "Param.6":oTF5.getValue(), "Param.7":oTF7.getValue(), "Param.8":oTF9.getValue(), "Param.9":oTF2.getValue(), "Param.10":oTF4.getValue(), "Param.11":oTF6.getValue(), "Param.12":oTF8.getValue(), "Param.13":oTF10.getValue(), "Param.14":User, "Param.15":User,"Param.16":oTF11.getValue(), "Param.17":"1"},
								dataType:"xml",
								success:function(data)
								{
										window.xmlData = data;
									if($(data).find('output').text() != "") {

                                                      // alert($(data).find('output').text());

                                                                              }

else

{

var oCore = sap.ui.getCore();

var reftable = oCore.byId("maintable");

var oModelCalc = new sap.ui.model.json.JSONModel("/XMII/Illuminator?QueryTemplate=HZL/Get_Roaster_Data&Param.1="+oDatePicker1.getValue()+"&Content-Type=text/json");

                                                                            oTableCalc.setModel(oModelCalc);

                                                                            oTableCalc.bindRows("/Rowsets/Rowset/0/Row");

}

}

});

Regards

G.Partheeban

[Former Member]

Hi Experts,

Is there anyone can reply for this?

Regards

G.Partheeban

[Private_Member_14935]

Hi Partheeban,

The code that you had shared in your previous question on dropdownbox works fine in this scenario also, i.e., when I edit the table content and select the row, the textfield in the upper section changes based on the edited value in the table cell.

I think this issue is also similar to the one you are having with setValue() not working on dropdownbox.

Best Regards,

Ria

[Former Member]

Hi Ria,

Actually I am using following code to refresh the table:

//oTable declaration

var oTableCalc = new sap.ui.table.Table("maintable",{

  id : 'CalcTable',

  firstVisibleRow: 0,

  selectionMode: sap.ui.table.SelectionMode.Single,

  fixedColumnCount: 1,

  editable:false

  });

and in the ajax call I am doing

var oCore = sap.ui.getCore();

var reftable = oCore.byId("maintable");

which is just refreshing the table but when I select the row it displays the old value.

So I used "location.reload();" which is a wrong method since it refresh the whole page.

Due to this when I change the date and insert the value, my page get refreshed and I am getting the new content.

Please suggest me what I need to do for refreshing only the table and also when I select the row I need the new content to be displayed in the text field.

Regards

G.Partheeban

[Private_Member_14935]

Hi Partheeban,

For refreshing a UI5 table, you would have to do the following:

1. update the model (i.e., oModel.setData({modelData: newRows});)

2. set model to the table again (i.e., oTable.setModel(oModel))

3. bind rows to the table (i.e., oTable.bindRows("/modelData"))

Try applying this to your code. (you could have a separate js function that you call when the table needs to be refreshed)

Hope this helps!

Best Regards,

Ria