Skip to Content

Passing model between views

Hi community,

i have a little problem, look this is my app

In my table i show some values, not all be cause it's just like a short version and if you clic on one of those items go to another view with the full info, but i don't know how, maybe pass a model to the view but how do i pass a model just with the info of the item ? not all the model that have whole info or take the index of the item-table, pass the model to the other view and depending of the item-table-index i print that item-model on my view; sounds confusing

This is my table view:

<Table 	 id="consultarCitasTable"
		 fixedLayout="true"
		 popinLayout="Block"
		 mode="SingleSelectMaster"
		 selectionChange="onSelectionChange"
		 alternateRowColors="false"
		 items="{/}"
		 noDataText="Sin Datos">
<columns>
	<Column  >
		<Text text="{i18n>col1}" class="titleCol"/>
	</Column>
	<Column width="6em" minScreenWidth="580px" demandPopin="true">
		<Text text="{i18n>col4}" class="titleCol"/>
	</Column>
	
	<Column width="3em" >
		<Text text="{i18n>col5}" class="titleCol"/>
	</Column>
</columns>
<items>


	<ColumnListItem press="oTableItemPress" type="Navigation">
		<cells>
			<Text text="{Cli_nombre}" class="textRow"/>
			<Text text="{
				path: 'timestamp',
				formatter: '.formatter.fecha_f'
						}" class="textRow" />
			<Text text="{
				path: 'timestamp',
				formatter: '.formatter.hora_f'
			}" class="textRow"/>
		</cells>
	</ColumnListItem>
</items>
</Table>

and this is my event of the item and table:

onSelectionChange : function(oEvt) {
			var item = oEvt.getParameter("listItem");
			item.firePress();
		},
		
		oTableItemPress : function(oEvent) {
			
			var oItem = oEvent.getSource();
			var oIndex = oItem.getParent().indexOfItem(oItem);


			
			var oRouter = sap.ui.core.UIComponent.getRouterFor(this);
			oRouter.navTo("detail");
		},

So i want to print (in case if you clic in the third table-item) all this data in my second view:

  1. Asesor:"10001384"
  2. Cli_nombre:"JORGE NAZAR MANZUR NAZAR MANZUR"
  3. DbmLicext:""
  4. Esp_servicio:""
  5. Fecha:"/Date(1457308800000)/"
  6. Hora:"PT09H30M00S"
  7. Kunnr:"0001135472"
  8. Nomb_asesor:""
  9. Sucursal:"1170"
  10. Usuario:""
  11. timestamp:"20160307093000

that comes from my odata and it's printed partially in my table, i thoug to take my index with this var oItem = oEvent.getSource(); var oIndex = oItem.getParent().indexOfItem(oItem); and look some way to pass the model-item(index) to my second view only but i think there is better way or maybe do again the odata request with an index ?

example.png (52.3 kB)
Add comment
10|10000 characters needed characters exceeded

  • Get RSS Feed

2 Answers

  • Apr 19 at 04:47 AM

    You can go through Step 32: Routing with Parameters of the SAPUI5 SDK which explains pretty nicely exactly how to navigate between 2 views and pass data from the first view to the second one.

    Add comment
    10|10000 characters needed characters exceeded

  • Apr 19 at 10:00 AM

    Hello Naoto Amari

    With out going deep into your code, you can pass data to different views thru the router, or my favorit "the eventbuss". Here is a eventbus example:

    //Subscribe / Listen to a event, this is global so in any controller. 
    sap.ui.getCore().getEventBus().subscribe("someEventBussNAme", "EventName", this.functionToRun, this);
    functionToRun:function(channel, event, data){ //data is sent from the event.publish. See under
    console.log(data) }

    //Push events and some data, this is also global, so from anny controller. sap.ui.getCore().getEventBus().publish("someEventBussNAme", "EventName", SendDataFromModelHere);

    I see you are using the router to navigate. I never pass data thru the router, so i am to unserten on how this is done to explain it :)

    Add comment
    10|10000 characters needed characters exceeded

    • Hello Naoto Amari. Hope this helps. I am only pasing what you are typing in the input.

      View 1 (pasing data):

      <Input value="" id="inputVal" liveChange="inputChanged"/>

      Controller for view 1 (pasing data):

      inputChanged: function(oEvent){
      	console.log(oEvent.getParameter("value"));
      	var valueToSend = oEvent.getParameter("value");
      	//Pas value to event listeners
      	sap.ui.getCore().getEventBus().publish("sendInput", "inputChanged", valueToSend);
      }

      Controller 2 (Reciving data):

      onInit: function(){
      sap.ui.getCore().getEventBus().subscribe("sendInput", "inputChanged", this.inputChangedReviced, this);
      },
      inputChangedReviced: function(channel, event, data){
      	//Sould be the data you sent. Do what you need here. Add to tempDataModel
      	console.log(data);
              this.getView().getModel("TempDataModel").setProperty("/", data );
      }