cancel
Showing results for 
Search instead for 
Did you mean: 

Passing model between views

naotoxxx
Participant
0 Kudos

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 ?

Accepted Solutions (0)

Answers (2)

Answers (2)

former_member560141
Participant
0 Kudos

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 🙂

naotoxxx
Participant
0 Kudos

Thanks aiopa , do you have a real example? , i have not used that event. I solved making a new odata request and passing the index to the odata and cleaning depending the index be cause it's the same query tan the table results i this case i don't care much for the reason that the table it's small but i'm really interest in the way you mentioned

and i triyed like this

component

this.setModel(new JSONModel(),"TempDataModel");

View 1

<Input value="ejemplo" id="inputVal" />

Controller, view 1

var input =this.byId("inputest").getValue();

this.getView().getModel("TempDataModel").setProperty("/",{"FirstName":input});

view 2

< Text text="{TempDataModel>/FirstName}" />

but in my case is not avaible by the reason of not all my table has all the value and if i put some colummns and text visible=false did not work

former_member560141
Participant
0 Kudos

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 );
}

saurabh_vakil
Active Contributor
0 Kudos

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.

naotoxxx
Participant
0 Kudos

Thanks saurabh.vakil i'll take a look