Skip to Content
0

Is it possible to edit text in sap.m.table in xml view?

Oct 23, 2017 at 09:33 AM

90

avatar image
Former Member

is it possible to edit the text in table for the fileld like

<Text text="{company}"/>

10 |10000 characters needed characters left characters exceeded
* Please Login or Register to Answer, Follow or Comment.

3 Answers

Best Answer
Irfan Gokak Oct 23, 2017 at 10:53 AM
0

Hi Priya,

You can use <Input> control. Set its property editable="true" to allow editing and false to display normal text.

<Input type="Text" editable="true"></Input>
Show 4 Share
10 |10000 characters needed characters left characters exceeded
Former Member

Hi Irfan,

Thank you for your answer , but i need that after editing input field to be change to text, not look as input field,is there any poosibilty for that?

0

Not clear. You mean after you finish editing in Input Field it should change to Text Field? Is that what you want?

0
Former Member

yes,after editing it will be look like normal text in table.

0

Hi Priya,

Either you can Disable or set Editable to false. As given below. If you want to Text field then use two fields in a table cell and play hide/visible with both by binding same property to them. You can do this in Change event of input field. As given below.

<Input type="Text" editable="true" change="myFunction"></Input>

myFunction : function(oEvent){
    oEvent.getSource().setEditable(false);
    oEvent.getSource().setEnabled(false);
}

0
Irfan Gokak Oct 23, 2017 at 12:22 PM
0

Hi Priya,

Either you can Disable or set Editable to false. As given below. If you want to Text field then use two fields in a table cell and play hide/visible with both by binding same property to them. You can do this in Change event of input field. As given below.

<Input type="Text" editable="true" change="myFunction"></Input>

myFunction : function(oEvent){
    oEvent.getSource().setEditable(false);
    oEvent.getSource().setEnabled(false);
}
Show 5 Share
10 |10000 characters needed characters left characters exceeded

You can do it using binding very easily.

0
Former Member

Hi Irfan ,

what exactly i need is,before clicking on that row it should like on below image

after clicking that row ,it should be like below image

on above image it changes from text field to input field and after saved it again looks as text field.This scenario,Is it possible to do with sap.m.table??

Thanks in advance

0

Hi Priya,

Yes it's possible but it takes lots of effort. I would suggest you go with simple design like open a dialog and allow user to make changes into it and after change just refresh the table. Thats it!!!

Regards,

Irfan G.

0
Former Member

yes, i done by using simple dialog when clicking on particular text on table.

But i need that scenario as in screenshots,please will you guide me....

Thanks in advance

0

Hi Priya,

Inside table cell put something like first sell with HorizontalLayout.

<ColumnListItem vAlign="Middle">
	<cells>
	        <l:HorizontalLayout>
			<Text text="{GTMdl>Class}" visible="{GTMdl>DisFldVis}"/>
	           	<Input type="Text" visible="{GTMdl>CrtFldVis}"></Input>
		</l:HorizontalLayout>
		<Text text="{GTMdl>Class}" />
	        <Text text="{GTMdl>Age}" />
		<Text text="{GTMdl>Version}" />
	</cells>
</ColumnListItem>

And your model data goes like this

var oNVData = [{
			//Other Fields
			CrtFldVis : false, //flag for visibility of Create Fields
			DisFldVis : true   //flag for visibility of Display Fields
		},{
			//Other Fields
			CrtFldVis : false,
			DisFldVis : true
		},{
			//Other Fields
			CrtFldVis : false,
			DisFldVis : true
		}];
var oJson = new sap.ui.model.json.JSONModel({"GTData":oNVData});
this.getView().setModel(oJson, "GTMdl");

Controller code on click of your text :

VisCrtFld : function(oEvent) {
		//this.getModel("GTMdl")
//		debugger;
		var sPath = oEvent.getSource().getBindingContext("GTMdl").getPath();
		this.getView().getModel("GTMdl").setProperty(sPath+"/CrtFldVis", true);
		this.getView().getModel("GTMdl").setProperty(sPath+"/DisFldVis", false);
	}

Tested and Working.

If you have any doubts please ping me on my linkedIn

Irfan Gokak

1
avatar image
Former Member Oct 24, 2017 at 07:20 AM
0

Hi Priya,

You should use Input control for text editing. It has a property to make it non editable as well. - property name: editable and possible values are true or false.

You can learn more about input control at below given link.

https://sapui5.hana.ondemand.com/#/entity/sap.m.Input

Share
10 |10000 characters needed characters left characters exceeded