How to create a table inside JSON View

Hi All,
I am trying to create a UI5 app inside which i want to fetch the data using SAP gateway service which i want to embed into JSON view to be displayed inside a table. I am totally new to JSON & UI5 so please let me know where i am incorrect:
Index.html code:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv='Content-Type' content='text/html;charset=UTF-8'/>
<script src="resources/sap-ui-core.js"
id="sap-ui-bootstrap"
data-sap-ui-libs="sap.ui.commons,sap.ui.table"
data-sap-ui-theme="sap_bluecrystal">
</script>
<script>
sap.ui.localResources("ui5trial");
var view = sap.ui.view({id:"idSalesOrder1", viewName:"ui5trial.SalesOrder", type:sap.ui.core.mvc.ViewType.JSON});
view.placeAt("content");
</script>
</head>
<body class="sapUiBody" role="application">
<div id="content"></div>
</body>
</html>
JSON view file code:
"Type":"sap.ui.core.mvc.JSONView",
"controllerName":"ui5trial.SalesOrder"
var oTable = new sap.ui.table.Table({
title: "Sales Order Table Details",
id: this.createId("MyTable1"),
selectionMode:sap.ui.table.Table.SelectionMode.Single });
oTable.addColumn( new label: new sap.ui.commons.Label({text: "Sales Order No."}),
   template: new sap.ui.commons.TextField().bindProperty("value","OrderId"));
oTable.addColumn( new label: new sap.ui.commons.Label({text: "Document Type"}),
   template: new sap.ui.commons.TextField().bindProperty("value","DocumentType"));
oTable.addColumn( new label: new sap.ui.commons.Label({text: "Document Date"}),
   template: new sap.ui.commons.TextField().bindProperty("value","DocumentDate"));
oTable.addColumn( new label: new sap.ui.commons.Label({text: "Customer Id"}),
   template: new sap.ui.commons.TextField().bindProperty("value","CustomerId"));
Controller file code:
jQuery.sap.require("util.Func");
sap.ui.controller("ui5trial.SalesOrder", {
* Called when a controller is instantiated and its View controls (if available) are already created.
* Can be used to modify the View before it is displayed, to bind event handlers and do other one-time initialization.
* @memberOf ui5trial.SalesOrder
onInit: function() {
var oModel = new sap.ui.model.json.JSONModel(serviceUrl);
var oData = oModel.getJSON();
oTable.setModel(oModel);
oTable.bindRows(oData);
Func.js file code:
jQuery.sap.declare("util.Func");
function getUrl(sUrl){
if (sUrl == ""){
return sUrl;
if (window.location.hostname == "localhost"
|| window.location.hostname == "https://sapes1.sapdevcenter.com"){
return 'proxy' + sUrl;
//Service Root URL
// "https://sapes1.sapdevcenter.com:443/sap/opu/odata/sap/ZGWSAMPLE_SRV/?sap-client=520";
//Extract the relative URL to use this application for deployment on any Web Server
var serviceUrl = getUrl("/sap/opu/odata/sap/SALESORDERXX/?sap-client=520");

Hi,
If SAPUI5 / Javascript is completely new to you, I *strongly* suggest you train yourself in Javascript first. Without prior knowledge of Javascript it really makes no sense learning SAPUI5, since it involves quite a bit of Javascript programming.
(The reason I'm mentioning this: You started out with a JSONView, but the code you provided is Javascript. Either create a JSONView and construct your table in a JSONView manner, or create a JSView with Javascript code to build your table. On a sidenote, I have never seen anyone using JSONViews anyway, so if you have the choice, use XMLViews (recommended) or Javascript Views)
If you're already familiar with Javascript, I strongly advise to try some simple exercises first before deep-diving into OData connectivity. Just try and understand the basics of SAPUI5 (The MVC concept, databinding, etc)
But if you really want to, have a look at this excellent blog : Consume NetWeaver Gateway services via SAPUI5 - Part 1

Similar Messages

How to create a table inside a table in the dictionary

I need to create a table in the dictionary that one of the components has to be a table.
Someone known how to do it.
Thanks.

Hi
U cannot create a table inside another table.
The data storage is not supported in that manner.
If you need multiple fileds based on a single line entry then , first figure out the relationships between these tables.
Then create a second table with a part of the primary key as the first and a unquie primary key to be defined for adding all the rest of the entries in the second table.
Also maintain the foreign key relationships between these tables.
This is the way to have multiple entries for a single line of a table entry.
Regards,
Radhika.

How to create a table with events in smartforms?

How to create a table with events view in smartforms?
It doesn't like general table with header, main area and footer.
for example:
in smartforms: LE_SHP_DELNOTE
table name is TABLEITEM(Delivery items table)

Vel wrote:
I am creating XML file using DBMS_XMLGEN package. This XML file will contain data from two different database tables. So I am creating temporary table in the PL/SQL procedure to have the data from these different tables in a single temporary table.
Please find the below Dynamic SQL statements that i'm using for create the temp table and inserting the data into it.
Before insert the V_NAME filed, i will be appending a VARCHAR field to the original data.
EXECUTE IMMEDIATE 'CREATE TABLE TEMP_TABLE (UNIQUE_KEY NUMBER , FILE_NAME VARCHAR2(1000), LAST_DATE DATE)';
EXECUTE IMMEDIATE 'INSERT INTO TEMP_TABLE values (SEQUENCE.nextval,:1,:2)' USING V_NAME,vLastDate;What exactly i need is to eliminate the INSERT portion of it,Since i have to insert more 90,000 rows into it. Is there way to have the temp table created with data in it along with the sequence value as well.
I'm using Oracle 10.2.0.4 version.
Edited by: 903948 on Dec 22, 2011 10:58 PMWhat you need to do to eliminate the INSERT statement is to -- as already suggested by others - eliminate the temporary table. You don't need it. It is just necessary overhead. Please explain why you (apparently) believe that the suggestion of a view will not meet your requirements.

HOW TO CREATE A CUSTOMER NO (sales view)THAT STOERS IN KNVV TABLE

HI ,
how to create a customer no(sales view) that stores in tabel knvv, i able to create in kna1 table but not storing in knvv table, please provide with tcode

Hi,
I believe while creating customer you must be maintaining sales area if you are not maintaing then only customer's genaral data will be created and only KNA1 table will be populating.
Rgds
San

How to create transaction for a maintenance view, Thank you.

How to create transaction for a maintenance view,
Thank you.
deniz...

Hi Deniz,
Go to se93.
Then create the new T.code.
Under that select parameter Transaction.
Then give the sm30 in the t.code in default values tab.
check the checkbox skip initial screen.
in classification tab.
click checkbox inherit gui attributes..
Now below..
In the default values..
select
viewname and give ur table name.
UPDATE= Xsave
view - table name ( Should be upper case
update X ( should be upper case).
http://www.sap-basis-abap.com/sapbs011.htm
Hope this helps you.
Regards,
Viveks

How to Create Inline Table to Display Detail Data in a Master Table in 11g?

Hi,
I have a requirement to create inline table inside master table to show data.
I found this 10g article for this http://download.oracle.com/docs/cd/B31017_01/web.1013/b28967/web_masterdetail006.htm#BABCDCGE
I couldn't find such option in 11g. Am i missing something? Please let me know where i can find more details.
Required Output:
[+] DepartmentId DepartmentName
[-] DepartmentId DepartmentName
EmployeeId FirstName LastName
EmployeeId FirstName LastName
EmployeeId FirstName LastName
[+] DepartmentId DepartmentName
Also, I tried creating the Page as below (Departments -Employees Relation). i.e I have tried using the ADF treeModel in the bindings and then created a table/inline table manually to populate. The data is available in the iterators (i found using sops in back bean), but the inline table is not showing any data. I tried enabling PPR on detail based on master. But no luck.
<af:table rows="#{bindings.Departments1.rangeSize}"
emptyText="#{bindings.findAllStaff1.viewable ? \'No rows yet.\' :
\'Access Denied.\'}"
var="row" value="#{bindings.Departments1.treeModel}">
<af:column headerText="#{bindings.Departments1.labels.DepartmentId}"
sortable="false" sortProperty="DepartmentId">
<af:outputText value="#{row.DepartmentId}"/>
</af:column>
<af:column headerText="#{bindings.Departments1.labels.DepartmentName}"
sortable="false" sortProperty="DepartmentName">
<af:outputText value="#{row.DepartmentName}"/>
</af:column>
<f:facet name="detailStamp">
<af:table rows="#{bindings.Departments1.rangeSize}"
emptyText="No rows yet." var="detailRow"
value="#{row.children}">
<af:column headerText="#{row.children[0].labels.EmployeeId}"
sortable="false" sortProperty="EmployeeId">
<af:outputText value="#{detailRow.EmployeeId}"/>
</af:column>
<af:column headerText="#{row.children[0].labels.FirstName}"
sortable="false" sortProperty="FirstName">
<af:outputText value="#{detailRow.FirstName}"/>
</af:column>
<af:column headerText="#{row.children[0].labels.LastName}"
sortable="false" sortProperty="LastName">
<af:outputText value="#{detailRow.LastName}"/>
</af:column>
</af:table>
</f:facet>
</af:table>
Thanks in Advance,
Harikiran

Hi,
After reading the above links end-to-end twice, I'm finally able to establish the relationship in UI. I've used iterator for my specific purpose, although it can be done using a table/forEach.
1) Create VOs for Dept and Emp, i.e. DeptVO and EmpVO.
2) Then a View Link on deptID, i.e DeptEmpVL
3) Drag and drop the Dept as AdfTreeTable, b'coz it will create the treeBinding and also add the emp accessor by selecting it in the binding window. (refer to above doc links from BaiG)
4) In my Page UI, i've created a new table and an iterator in the detailStamp.
Dept Table ->
o Value = #{bindings.Departments1.treeModel}
o Var = dept
o varStaus = deptVarStatus
Add these:
Column1-> OutputText -> #{dept.DepartmentId}
Column2-> OutputText -> #{dept.DepartmentName}
Insert into TableFacets -> detailStamp -> iterator
Iterator ->
o Value = #{dept.children}
o Var = emp
o varStatus = empVarStatus
Add these:
OutputText -> #{emp.EmployeeId}
OutputText -> #{emp.EmployeeName}
OutputText -> #{emp.Salary}
This iterator/forEach comes in handy for having n Number of regions inside a layout.
Thanks,
Harikiran

How to create transaction code for maintenance view

hai friends,
i hope every thing goes good.
i have doubt, how to create transaction code for maintenance view. I created view for tranperant table and now i want to create transaction code for the view.
i tried and i donot know the screen number and program name and where can i give the view name.
if any one know please post in details.
thanks in advance.

Hi Elam,
You need to create a "Parameter Transaction".
What this means is that you will have a transaction (let's call it "ZMAINT") which calls "SM30" and passes in your table name.
Go to transaction SE93 and enter your new transaction code. Enter in the Tcode description and choose "Transaction with Parameters" (it shouldbe the last radio button).
Enter in the default transaction "SM30" and tick the "Skip Initial Screen" check box. Hit Enter.
Now scroll to the bottom of the screen and you will see a Table Control where you will need to enter in the values to the SM30 selection screen.
Because you hit ENTER, the program will have loaded in the Selection Screen parameters into it's memory. Hit the drop down for "Name of Screen Field" and select "VIEWNAME" and then enter in your Z Table in the "Value" column.
Now go to the next line and hit the drop down and select "UPDATE" in the "Name of Screen Field". Enter in a "X" in the value column.
Now save the transaction and there you have it.
Hope this helps.
Cheers,
Pat.
PS. Kindly assign Reward Points to the posts you find helpful.

How to create a table in the file using java code.?

HI,
I should export the data from the view objects to a word document. I have done that but I should
display the data in the form of a table.
Kindly come up with the necessary information on how to create a table in the file using java.
Thanks,
Phani

Hi, Thank you for responding to my query.
The below are the details of my code.
DCBindingContainer dcBindings =
(DCBindingContainer)BindingContext.getCurrent().getCurrentBindingsEntry();
DCIteratorBinding StudentDetailsContent =
(DCIteratorBinding)dcBindings.get("StudentView1Iterator");
OutputStreamWriter w = new OutputStreamWriter(outputStream, "UTF-8");
Row currentRow =
StudentDetailsContent.getRowSetIterator().first();
Object a[]= currentRow.getAttributeValues();
int i;
for(i=0 ;i<=a.length;i++){
w.write(a.toString());
w.write(" ");
w.flush();
I am usning this coding to achieve the task of exporting data to file.
I need to display this information in the table that is where I need help from you people.
Thanks,

How to create a table with rows within a row?

Hi,
I am trying to create a table that looks like this: https://acrobat.com/#d=XyI3rlSWMWYXQixzpRSrXA but I can't figure it out.
Please can someone tell how I should go about this?
thanks for the help.

Hi,
We you see nested tables, you have to create a table inside a table. For this first you have to merge the rows and insert a table with the number of rows requested. You can find the sample created for you below and let me know in case of any issues
https://sendnow.acrobat.com/m/g.ashx?i=rO1m-dIDzRs2FibTHDSiww&x=yrC*o4IZIVfpKgqOTbX8OQ
Thanks

How to create a table with datatype blob and insert a pdf file (ravi)

how to create a table with datatype blob and insert a pdf file,
give me the explain asap
1.create the table?
2.insert the pdffiles into tables?
3.how to view the files?
Thanks & Regards
ravikumar.k
Edited by: 895044 on Dec 5, 2011 2:55 AM

895044 wrote:
how to create a table with datatype blob and insert a pdf file,
give me the explain asapPerhaps you should read...
{message:id=9360002}
especially point 2.
We're not just sitting here waiting to answer your question as quickly as possible for you.

How to create interface where you can view metadata of several databases

How to create interface where we can view metadata of several databases:
Oracle Apex should display metadata of this particular DB (later on we can include multiple DB’s)
          a. Report should first display DB name
          b. When clicked on DB name, should display 3 schemas
          c. When clicked on 1 schema, should display tables – when clicked on each table,
          should display various column names and its corresponding metadata.
          (similarly for other schema’s also)
          d. In short, it should be like a drill down report.
Help required for craeting like above.
Appreciate your help.

I did something similar a while back. I had an application reading from multiple schema's for reporting purposes..IN that case atleast we just would build the selects using a function reurning SQL select, so that we could have an application item with the selected schema they wanted to use to build into the select returned...
For forms, that would be an interesting idea, don't know how you can dynamically change the table owner name, since it is a drop down control in development..
Thank you,
Tony Miller
Webster, TX
I cried because I did not have an office with a door until I met a man who had no cubicle.
-Dilbert
If this question is answered, please mark the thread as closed and assign points where earned..

How to create labeled table of Content with expand and collapse

Hi All,
Can somebody help me how to create labeled table of Content with expand and collapse as example given below:
User1
Template1
Template2
User2
+
User3
Template1
Template2
Like when we see expand (+) and collapse (-) button when we click on 'about this page' link.
Thanks
Bhupendra

Hi,
Tou can use Table inside table to show the details this way but I'm not sure about Expand/Collapse.
Expand/Collapse are part of HGRID.
I think we can develop this functionality with little manipulation.
Regards,
Reetesh Sharma
Edited by: Reetesh Sharma on Jun 28, 2010 4:56 AM

How to create alv table dynamically by performing action on the button.

Hi all,
my requirement is to create alv table dynamically.
that is i will create two buttons
1) show alv table
2) close alv table
if user selects show alv table then the alv table should be displayed.
and if user selects clsoe alv table then the alv table should be closed.
to create alv table dynamically i have followed this procedure.
under view properties i have added salv_wd_table component. then under the action of showalvbutton i went to code wizard and i have selected instantiate used component component use salv_wd_table. the following code will be generated
with this code i am unable to display alv table dynamically correct me where i went wrong kindly send me the necessary steps how to create alv table dynamically
data lo_cmp_usage type ref to if_wd_component_usage.
lo_cmp_usage = wd_this->wd_cpuse_salv_wd_table( ).
if lo_cmp_usage->has_active_component( ) is initial.
lo_cmp_usage->create_component( ).
endif.
to close table i have used the following code. with this code i am able to achieve the functionality to delete the alv table
data lo_cmp_usage type ref to if_wd_component_usage.
lo_cmp_usage = wd_this->wd_cpuse_salv_wd_table( ).
if lo_cmp_usage->has_active_component( ) is initial.
else.
lo_cmp_usage->Delete_component( ).
endif.
Thanks & Regards,
Naveen
Edited by: naveen.webhelp on Feb 10, 2011 5:52 AM

Hi
ALV table will be shown in the viewcontainerUI element.
it is shown there empty if you dont fill the node bound to the data node of the interface controller of the comp usage
SALV_WD_TABLE.
and if you are not getting the table filled in the first place.
then check have you mapped the DATA node to some node in the comp controller
wht basically is your requirment is that you want to show ALV gird on click of one button and delete it on click of other button.
there are many ways to do so.
best way is control the visiblity of the viewcontainer UI element which containes the TABLE view of SALV_WD_table comp.
create an attribute of type WDUI_VISIBILITY name say VIS.
now go to the layout and bound hte visible property of the viewcontainer to this attribute VIS.
then in the showalv grid button's eventhandler write
wd_context->set_attribute(
name = 'VIS'
value = '02'
and in the wddoinit and delete alv grid button's event handler write
wd_context->set_attribute(
name = 'VIS'
value = '01'
thanks
sarbjeet singh

How to create the Table of Content (TOC) in WEB

Dear Sir
Please help me
How to create the Table of content (TOC) in Web Intelligence Report,
Thanks
Gnanasekarn.K
Edited by: Gnanasekaran Kandasamy on Nov 20, 2008 11:12 AM

Hi Gnanasekarn,
You can create TOC in webi using Open Document, You can create link on the TOC and you can connect that link to open new report .
With the help of open document you can open the specific portion of report.
So you can achive your requirement using URL reporting or Open Document.
Regards,
Chaitanya Deshpande

How to create monthly table creation?

Hi Mates,
Unable to create table by month in analytic database but load the data to the previous table continuous as attached screenshot, Schema user has the creation privilege. We are using Webcenter interaction 10gR4.
How to create monthly table creation please?
Thanks,
Katherine

Hi Trevor,
Thanks for your help. We were able to create table and load data till Apr as attached.
However the analytic user privilege has been modified on Apr due to server operation.
Since then, there was a message saying there is no permission to create tables in the analytic log,
analytic user privilege has been granted after checked this message, As I suspected, the issue occurred after modifying analytic user privilege.
Currently, analytic users are granted with all privilege.
Any idea please?
Thanks,
Kathy

How to create a table inside JSON View

Similar Messages

Maybe you are looking for