SAPUI5 - using select with odata - sapui5

I am trying to fill select items from odata service. I used the odata service in a list just to test it and it works, no problems. But when i set the data to Select i get "invalid XML" error.
Here is my xml view :
<mvc:View controllerName="packdialogue.controller.s1" xmlns:html="http://www.w3.org/1999/xhtml" xmlns:mvc="sap.ui.core.mvc" displayBlock="true"
xmlns="sap.m"
xmlns:l="sap.ui.layout">
<App id="s1">
<pages>
<Page title="{i18n>title}" id="s1page" >
<content>
<FlexBox
alignContent="Center"
justifyContent="Center"
width="auto"
>
<Panel
class="s1Panel"
backgroundDesign="Solid" >
<l:VerticalLayout>
<Text
textAlign="Center"
id="S1LgnumLabel"
visible="true"
text="{i18n>S1LgnumLabel}"
width="18em">
</Text>
<Input
class="s1Input"
id="S1LgnumInput"
enabled="true"
width="18em">
</Input>
<Button
id="S1EnterButton"
text="{i18n>S1Button1Text}"
width="21.5em"
press="onEnterPressed"
>
</Button>
<Text
textAlign="Center"
id="S1WSLabel"
visible="false"
text="{i18n>S1WSLabel}"
width="18em">
</Text>
<Button
id="S1NextButton"
press="onS1ButtonPressed"
text="{i18n>S1Button2Text}"
width="21.5em"
enabled="false"
visible="false"
>
</Button>
<Select
items="{test>/WorkcenterSet}">
<items>
<core:Item key="{test>wrkst}" text="{test>wrkst}" />
</items>
</Select>
<List
id="S1List"
visible="false"
items="{test>/WorkcenterSet}"
>
<StandardListItem
title="{test>wrkst}"
iconDensityAware="false"
iconInset="false" />
</List>
</l:VerticalLayout>
</Panel>
</FlexBox>
</content>
</Page>
</pages>
</App>
When i delete the Select from my View I get no errors so the problem is in the select, but I can't figure out what is wrong with my code.

You forgot to add core namespace into the view header:
xmlns:core="sap.ui.core"
So, when it comes to it does not know what to do.

I believe you should define core namespace in the XML for <core:Item key="{test>wrkst}" text="{test>wrkst}" />
<mvc:View controllerName="packdialogue.controller.s1"
xmlns:html="http://www.w3.org/1999/xhtml" xmlns:mvc="sap.ui.core.mvc"
displayBlock="true"
xmlns="sap.m"
xmlns:core="sap.ui.core"
xmlns:l="sap.ui.layout">

Related

sap.f.SemanticPage: adding more than 1 content control fails

I am trying to get three panels to show on my object page but for some reason it shows only the last panel like it is shown on the screenshot:
The Object.view.xml looks like the following:
<mvc:View controllerName="ns.mngportfolios.controller.Object" xmlns="sap.m" xmlns:mvc="sap.ui.core.mvc" xmlns:semantic="sap.f.semantic" xmlns:form="sap.ui.layout.form">
<semantic:SemanticPage id="page" headerPinnable="false" toggleHeaderOnTitleClick="false" busy="{objectView>/busy}" busyIndicatorDelay="{objectView>/delay}">
<semantic:titleHeading>
<Title text="{PORTFOLIO_NUMBER}" level="H2" responsive="true" />
</semantic:titleHeading>
<semantic:headerContent>
<ObjectNumber number="{
path: 'EBITDA',
formatter: '.formatter.numberUnit'
}" />
<ObjectAttribute text="{COMPANY_NAME}" />
</semantic:headerContent>
<Panel class="sapUiResponsiveMargin" width="auto" headerText="{i18n>portfolioTitle}" expandable="{device>/system/phone}" expanded="true">
<content>
<form:SimpleForm id="objectForm">
<form:content>
<Label text="{i18n>portfolioSharesLabel}" />
<Text text="{PORTFOLIO_SHARES}" />
<Label text="{i18n>portfolioNameLabel}" />
<Text text="{PORTFOLIO_NAME}" />
<Label text="{i18n>portfolioDepreciationLabel}" />
<Text text="{= ${DEPRECIATION} + ' ' + 'EUR'}" />
</form:content>
</form:SimpleForm>
</content>
</Panel>
<Panel class="sapUiResponsiveMargin" width="auto" headerText="{i18n>yearTitle}" expandable="{device>/system/phone}" expanded="false">
<content>
<List id="companyList">
<items>
<StandardListItem icon="sap-icon://building" title="Building1" />
<StandardListItem icon="sap-icon://email" title="abcd#mail.com" />
<StandardListItem icon="sap-icon://world" title="google.com" />
<StandardListItem icon="sap-icon://phone" title="+00123456789" />
<StandardListItem icon="sap-icon://map" title="23 Wall st, 10005 NY" />
</items>
</List>
</content>
</Panel>
<Panel class="sapUiResponsiveMargin" width="auto" headerText="{i18n>mapTitle}">
<Image src="{
parts: [
'23 Wall St',
'10005',
'New York',
'United States'
],
formatter: '.formatter.formatMapUrl'
}" />
</Panel>
<semantic:sendEmailAction>
<semantic:SendEmailAction id="shareEmail" press=".onShareEmailPress" />
</semantic:sendEmailAction>
</semantic:SemanticPage>
</mvc:View>
Can someone help me to identify the missing piece here?
"content" aggregation of sap.f.semantic.SemanticPage has a Cardinality of 0..1. This means we can add a maximum of one child control. To accomplish the task of displaying 3 panels, try embedding all three panels inside a container. A few examples of containers which could be used can be found in samples page under the category containers and layouts.
To provide an example :-
<mvc:View controllerName="ns.mngportfolios.controller.Object" xmlns="sap.m" xmlns:mvc="sap.ui.core.mvc" xmlns:semantic="sap.f.semantic" xmlns:form="sap.ui.layout.form">
<semantic:SemanticPage id="page" headerPinnable="false" toggleHeaderOnTitleClick="false" busy="{objectView>/busy}" busyIndicatorDelay="{objectView>/delay}">
<semantic:titleHeading>
<Title text="{PORTFOLIO_NUMBER}" level="H2" responsive="true" />
</semantic:titleHeading>
<semantic:headerContent>
<ObjectNumber number="{
path: 'EBITDA',
formatter: '.formatter.numberUnit'
}" />
<ObjectAttribute text="{COMPANY_NAME}" />
</semantic:headerContent>
<VBox>
<items>
<Panel class="sapUiResponsiveMargin" width="auto" headerText="{i18n>portfolioTitle}" expandable="{device>/system/phone}" expanded="true">
<content>
<form:SimpleForm id="objectForm">
<form:content>
<Label text="{i18n>portfolioSharesLabel}" />
<Text text="{PORTFOLIO_SHARES}" />
<Label text="{i18n>portfolioNameLabel}" />
<Text text="{PORTFOLIO_NAME}" />
<Label text="{i18n>portfolioDepreciationLabel}" />
<Text text="{= ${DEPRECIATION} + ' ' + 'EUR'}" />
</form:content>
</form:SimpleForm>
</content>
</Panel>
<Panel class="sapUiResponsiveMargin" width="auto" headerText="{i18n>yearTitle}" expandable="{device>/system/phone}" expanded="false">
<content>
<List id="companyList">
<items>
<StandardListItem icon="sap-icon://building" title="Building1" />
<StandardListItem icon="sap-icon://email" title="abcd#mail.com" />
<StandardListItem icon="sap-icon://world" title="google.com" />
<StandardListItem icon="sap-icon://phone" title="+00123456789" />
<StandardListItem icon="sap-icon://map" title="23 Wall st, 10005 NY" />
</items>
</List>
</content>
</Panel>
<Panel class="sapUiResponsiveMargin" width="auto" headerText="{i18n>mapTitle}">
<Image src="{
parts: [
'23 Wall St',
'10005',
'New York',
'United States'
],
formatter: '.formatter.formatMapUrl'
}" />
</Panel>
</items>
</VBox>
<semantic:sendEmailAction>
<semantic:SendEmailAction id="shareEmail" press=".onShareEmailPress" />
</semantic:sendEmailAction>
</semantic:SemanticPage>
</mvc:View>
Please choose the container control that best suits your layout demands.This is just an example.

Scroll bar does not appear even after putting the suitable code on the page in SAPUI5

I want scroll bar on my page when I decrease the size of the page.
I have tried putting the property enableScrolling="true" in the Page tag of the xml file.Then I have currently put the new tag ScrollContainer vertical="true" in the recent code, which is still not responding.
<mvc:View xmlns:html="http://www.w3.org/1999/xhtml" xmlns:mvc="sap.ui.core.mvc" xmlns="sap.m" xmlns:core="sap.ui.core"
controllerName="com.controller.newEntry" xmlns:f="sap.f"
xmlns:customData="http://schemas.sap.com/sapui5/extension/sap.ui.core.CustomData/1" xmlns:layout="sap.ui.layout"
xmlns:form="sap.ui.layout.form">
<Page showHeader="false" enableScrolling="true">
<content>
<ScrollContainer vertical="true">
<form:SimpleForm id="sForm1" editable="true" layout="ResponsiveGridLayout" singleContainerFullSize="false" title="{i18n>addNewText}">
<core:Title text="APPZEU05"/>
<Label text="FBU-ART" required="true"/>
<Input id="inpLegalEntity" type="Text" showValueHelp="true" valueHelpOnly="false" valueHelpRequest="onLegalEntityF4"></Input>
<Label text="Beschreibung"/>
<Input id="inpCust" type="Text"></Input>
</form:SimpleForm>
</ScrollContainer>
</content>
</Page>
You do not need the scroll container, but if you want to use it I would deactivate the Page scrolling, to avoid double scrollbars
also add to scrollcontainer height="100%" width="100%"
<mvc:View xmlns:html="http://www.w3.org/1999/xhtml" xmlns:mvc="sap.ui.core.mvc" xmlns="sap.m" xmlns:core="sap.ui.core"
controllerName="com.controller.newEntry" xmlns:f="sap.f" xmlns:customData="http://schemas.sap.com/sapui5/extension/sap.ui.core.CustomData/1"
xmlns:layout="sap.ui.layout" xmlns:form="sap.ui.layout.form">
<Page showHeader="false" enableScrolling="false">
<content>
<ScrollContainer vertical="true" height="100%" width="100%"></ScrollContainer>
</content>
</Page>
</mvc:View>
regards

Can't add footer to page. Uncaught TypeError

I'm trying to add a footer to a page, and I'm running into some problems:
Uncaught TypeError: b.applyTagAndContextClassFor is not a function
This is how my view looks like.
App.view.xml
<mvc:View
controllerName="com.xyz.controller.App"
xmlns="sap.m"
xmlns:mvc="sap.ui.core.mvc"
displayBlock="true"
>
<App class="myCustomStyle">
<Page title="{i18n>pageTitle}">
<mvc:XMLView viewName="com.xyz.view.FirstPanel"/>
<footer>
<mvc:XMLView viewName="com.xyz.view.Footer"/>
</footer>
</Page>
</App>
</mvc:View>
Footer.view.xml
<mvc:View
controllerName="com.xyz.controller.Footer"
xmlns="sap.m"
xmlns:mvc="sap.ui.core.mvc"
>
<Toolbar>
<ToolbarSpacer/>
<Button type="Accept" text="Accept"/>
<Button type="Reject" text="Reject"/>
</Toolbar>
</mvc:View>
If I edit App.view.xml to look like this:
<!-- ... -->
<mvc:XMLView viewName="com.xyz.view.FirstPanel"/>
<footer>
<Toolbar>
<ToolbarSpacer/>
<Button type="Accept" text="Accept"/>
<Button type="Reject" text="Reject"/>
</Toolbar>
</footer>
<!-- ... -->
Everything works as intended?
Changing from XMLView to a Fragment like #I.B.N. suggested ended up fixing the problem.
#Marc explains, "The outermost element of the Footer view was a sap.ui.core.mvc.View. The aggregation footer only allows sap.m.IBar. Changing to a fragment fixed the error."
Corrections:
App.view.xml
<!-- ... -->
<footer>
<core:Fragment fragmentName="com.xyz.view.Footer" type="XML"/>
</footer>
<!-- ... -->
Footer.fragment.xml
<core:FragmentDefinition
xmlns="sap.m"
xmlns:core="sap.ui.core"
>
<Toolbar>
<ToolbarSpacer/>
<Button type="Accept" text="Accept"/>
<Button type="Reject" text="Reject"/>
</Toolbar>
</core:FragmentDefinition>

Tiles Not Rendering While Put Inside Grid

I am trying to render StandardTile in a Grid, but due to some reason it's not working. however, it works when I remove the Grid & Panel from my code.
Can anyone point out what exactly am I doing wrong here?
<mvc:View xmlns:mvc="sap.ui.core.mvc"
xmlns:core="sap.ui.core" xmlns:l="sap.ui.layout" xmlns="sap.m"
controllerName="hanaDashBoard.controller.Home">
<Page showHeader="false" enableScrolling="false">
<Toolbar class="sapUiTinyMarginTop" id="toolbar1" height="10%">
<ComboBox id="SidCombo" width="11.5%" showSecondaryValues="true"
items="{
path: '/results'
}" selectionChange="SidSelect">
<core:ListItem key='{Key}' text='{Sid}'
additionalText='{Template}' />
</ComboBox>
<Text id="TemplateText"></Text>
<Text id="SltText"></Text>
<ToolbarSpacer />
<Button id="UserName" icon="sap-icon://kpi-managing-my-area"
enabled="false" type="Transparent" />
</Toolbar>
<l:Grid
id="leGrid"
class="sapUiSmallMarginTop"
hSpacing="2"
visible="false"
>
<l:content>
<Panel width="auto" class="sapUiResponsiveMargin">
<content>
<TileContainer id="container"
width="100%" height="100%" visible="true" tileDelete="handleTileDelete"
tiles="{/TileCollection}">
<StandardTile icon="{icon}" type="{type}" number="{number}"
numberUnit="{numberUnit}" title="{title}" info="{info}"
infoState="{infoState}" press="handleTilepress" />
</TileContainer>
</content>
<layoutData>
<l:GridData span="L12 M12 S12" />
</layoutData>
</Panel>
</l:content>
</l:Grid>
<footer>
<Toolbar>
<ToolbarSpacer />
<Button id="editbutton" text="Edit" press="tilePressed" />
<ToolbarSpacer />
</Toolbar>
</footer>
</Page>
</mvc:View>

Header Footer and content

I already create view : header, content, and footer but footer and content not display and not getting an error. the directory in form1.view.xml is correct because no error when I load the form1 view. when I command the header code and I refresh, the content show and footer still not show. when I command the header and content, the footer show. how to fix this problem?
Form1.view.xml
<App id="navCon"
class="footer-height footer-color header-color background-home background-color
footer-size-color panel-header">
<!-- Header -->
<mvc:XMLView viewName="sap.ui.taspen.taspen.Header" />
<App>
<pages>
<Page>
<Panel id="panelModule" headerText="Header form" class="panelForm">
<content>
<Label text="Ini form 1" />
</content>
</Panel>
</Page>
</pages>
</App>
<!-- Footer -->
<mvc:XMLView viewName="sap.ui.taspen.taspen.Footer" />
</App>
Header:
<mvc:View xmlns:mvc="sap.ui.core.mvc"
xmlns="sap.m" xmlns:t="sap.ui.table" xmlns:l="sap.ui.layout" xmlns:tnt="sap.tnt"
controllerName="sap.ui.taspen.taspen.Header" xmlns:html="http://www.w3.org/1999/xhtml">
<App>
<pages>
<Page showHeader="false">
<tnt:ToolHeader>
<html:img src="icon/logo_taspen.png" class="header-logo-taspen" />
<html:p class="text-header">NEW APPLICATION CORE BUSINESS</html:p>
<ToolbarSpacer width="20px" />
<tnt:ToolHeaderUtilitySeparator />
<ToolbarSpacer>
<layoutData>
<OverflowToolbarLayoutData priority="NeverOverflow"
minWidth="20px" />
</layoutData>
</ToolbarSpacer>
<Text text="Selasa, 21/4/2017 / 11:07 AM" class="text-white" />
<Text text="Hello, Jhon Doe" class="text-white">
<layoutData>
<OverflowToolbarLayoutData priority="NeverOverflow" />
</layoutData>
</Text>
<Button icon="sap-icon://log" type="Reject" press="logoutPress"
class="button-logout button-logout-icon margin-logout">
<layoutData>
<OverflowToolbarLayoutData priority="NeverOverflow" />
</layoutData>
</Button>
</tnt:ToolHeader>
</Page>
</pages>
</App>
</mvc:View>
Footer:
<mvc:View xmlns:mvc="sap.ui.core.mvc"
xmlns="sap.m" xmlns:t="sap.ui.table" xmlns:l="sap.ui.layout" xmlns:tnt="sap.tnt"
controllerName="sap.ui.taspen.taspen.Footer" xmlns:html="http://www.w3.org/1999/xhtml">
<App>
<Page showHeader="false">
<footer>
<OverflowToolbar id="otbFooter">
<Button type="Transparent" text="Kebijakan dan Privasi"
press="kebdanprivPress" />
<Button type="Transparent" text="Bantuan" press="bantuanPress" />
<ToolbarSpacer />
<Label text="All Rights Reserved PT. Taspen Persero" />
<html:img src="icon/copyright-symbol.png" class="footer-logo-copyright" />
<Label text="2018" />
</OverflowToolbar>
</footer>
</Page>
</App>
</mvc:View>
To Display custome header instead of page header you have to use
<customHeader></customHeader>
tag.and remaining you have to place in <content></content>tag. can see you are missing content tag.