I am getting the following error when I use a PlanningCalendar Control in my SAPUI5 application. It is not an element that I am destroying or recreating, but instead just used to display data. As a result I think I do not need to concern myself with this error. Is there any way I can get rid of it though? And why exactly is it popping up with the planning calendar? I am using SAPUI5 1.38.9.
During a clone operation, a template was found that neither was marked
with 'templateShareable:true' nor 'templateShareable:false'. The
framework won't destroy the template. This could cause errors (e.g.
duplicate IDs) or memory leaks (The template is used in aggregation
'appointments' of object '__row0').For more information, see
documentation under 'Aggregation Binding'. -
<PlanningCalendar
startDate="{path: '/startDate'}"
viewKey="D"
rows="{path: '/rows'}">
<views>
<PlanningCalendarView
key="A"
intervalType="Day"
description="days view"
intervalsS="1"
intervalsM="3"
intervalsL="7"
showSubIntervals="false">
</PlanningCalendarView>
<PlanningCalendarView
key="D"
intervalType="Hour"
description="hours view"
intervalsS="4"
intervalsM="6"
intervalsL="8"
showSubIntervals="true">
</PlanningCalendarView>
</views>
<rows>
<PlanningCalendarRow
text="{role}"
nonWorkingDays="{freeDays}"
nonWorkingHours= "{freeHours}"
appointments="{appointments}"
intervalHeaders="{headers}">
<appointments>
<unified:CalendarAppointment
tooltip="{title} {info}"
startDate="{start}"
endDate="{end}"
icon="{pic}"
title="{title}"
text="{info}"
type="{type}">
</unified:CalendarAppointment>
</appointments>
<intervalHeaders>
<unified:CalendarAppointment
startDate="{start}"
endDate="{end}"
icon="{pic}"
title="{title}"
type="{type}">
</unified:CalendarAppointment>
</intervalHeaders>
</PlanningCalendarRow>
</rows>
</PlanningCalendar>
Add templateSharable: false to your aggregation bindings of PlanningCalendarRow.
...
appointments="{path: 'appointments', templateShareable: false}"
intervalHeaders="{path: 'headers', templateShareable: false}"
...
This will allow us to let UI5 handle destroying templates when the binding is removed.
You can find the documentation about this here.
Related
I have tried to resolve the problem for quite sometime but have not been successful.
Inside a table, I have a sap.m.MultiComBox. The drop down in the multicombobox closes after selecting the first value. If not inside the table, the multicombobox works fine as expected (popover does not close). One additional behavior I observed is that if I don't have the selectedKeys bound, then it works fine.
Any reasons or suggestions?
<Table
growing="true"
items="{employee>/EmployeeCollection}">
<columns>
<Column width="10%" />
<Column width="55%" />
<Column width="35%"/>
</columns>
<ColumnListItem>
<Image id="image" src="{employee>dataURI}" class="sapOB_Assign_Usercircle" />
<Text text="{employee>Name}" class="tableText" />
<VBox>
<MultiComboBox id="mcb1"
selectedKeys="{employee>roles}"
items="{
path: 'roles>/BusinessRoles',
templateShareable: false
}">
<core:Item key="{roles>id}" text="{roles>name}" />
</MultiComboBox>
<HBox />
</VBox>
</ColumnListItem>
</Table>
You must be using UI5 version 1.66 or below with growing="true" on the Table. In that case, the dropdown closes immediately after the selection due to a focus loss caused by rerendering of the list item (Its DOM element being rewritten completely). The rerendering itself is caused by two-way bound selectedKeys which explains why it "works" if the property is not bound.
Normally, two-way binding should not be used together with growing. According to the API reference:
Note: Growing must not be used together with two-way binding.
But it's still unclear whether the above constraint is still valid today (See issue #3013).
In order to keep two-way binding with growing="true", add the attribute key* to the list binding info:
<Table
growing="true"
items="{
path: 'employee>/EmployeeCollection',
key: 'employeeId'
}"
>
Here is a working example: https://jsbin.com/ciyosir/edit?js,output. As you can see, the dropdown is kept open even after selection because the list item is not rerendered thanks to the extended change detection.
Additionally, I'd suggest to upgrade to the latest stable UI5 version in order to benefit from many controls having migrated to the new semantic rendering.
* The key awaits a property name from the model of which the value is unique. For more information, see topic Extended Change Detection.
I'm experimenting with annotations and smart controls, so I created an app from a Fiori Template and started playing with it. At some point inserted in the Object view a smart table (sap.ui.comp.smarttable) directly bound to an entity, no filters, no sorting, just fetch me all the data, something that of course worked. Things started getting interesting when I changed the table ID in the view. As soon as I did it, data stopped appearing and of course started appearing again as soon as I changed the table ID back in the old one. There are NO dependencies for this table, it's just there sitting in the view. Used the search function and scanned the entire project for the ID string, the only occurrence returned is the view definition. Any help?
Table definition snapshot below ("actionsTable" is the only string working and this is the only place found)
<smartTable:SmartTable id="actionsTable"
smartFilterId="smartFilterBar" tableType="ResponsiveTable" entitySet="AgreementActionsSet"
useExportToExcel="true" beforeExport="onBeforeExport" useVariantManagement="false"
useTablePersonalisation="true" header="Line Items" showRowCount="true"
persistencyKey="SmartTableAnalytical_Explored" enableAutoBinding="false"
demandPopin="true" class="sapUiResponsiveContentPadding">
<Table>
<ColumnListItem
type="Navigation"
press="onPress">
</ColumnListItem>
</Table>
</smartTable:SmartTable>
Invalid character (not Latin) inside the name (pasted from elsewhere). Question answered, apologies to everybody spent time on it.
I previously implemented aggregation with VBox. This get all the 'questions' and creates a Text box for each....
<VBox items="{path: 'view>questions', templateShareable: true}">
<items>
<VBox class="sapUiTinyMargin" templateShareable="true">
<Text text="Question {view>OrderSequence}"/>
</VBox>
</items>
</VBox>
I need to do the same, but for formElements. Can this be done?
<f:formElements>
<f:FormElement label="{i18n>radioLabel}">
<f:fields>
<Input value="{viewmodel>radioLabel}" id="__redioLabel"/>
</f:fields>
</f:FormElement>
</f:formElements>
It doesn't seem to work with 'items'
In UI5 elements have several characteristics:
Properties: generally scalar attributes, like "title" or "width".
Events: which are fired when something happens, like "press" or "close".
Aggregations: collections of child entities, like the "items" of a list.
Associations: related controls, like the "label" of a input field.
You can find how these relate to the concept of data binding in the official documentation here.
In your case, the "formElements" is an aggregation of the FormContainer element. Based on the documentation:
Aggregation binding can be used to automatically create child controls according to model data. This can be done either by cloning a template control, or by using a factory function. Aggregations can only be bound to lists defined in the model, that is, to arrays in a JSON model or a collection in the OData model.
This implies that ANY aggregation can be used, no matter how it is named. Now, to go back to you example, the reason why "items" does not work, is because the FormContainer parent element has no aggregation with that name. Instead, you must use the "formElements" aggregation.
<f:FormContainer formElements="{viewmodel>/my/path/to/list}">
<f:formElements>
<f:FormElement label="{i18n>radioLabel}">
<f:fields>
<Input value="{viewmodel>radioLabel}"/>
</f:fields>
</f:FormElement>
</f:formElements>
</f:FormContainer>
Also, note that usually, you do not need to give an ID to the template or any of its children (the Input in your example has an ID), that is because that element specifically will not be part of the resulting control tree. It is just used to be cloned to create the "real" elements based on the model list.
Lastly, you have a "templateShareable" property on the VBox in your first example. VBox has no such property, so it does nothing (you actually use it correctly inside the binding specification for the "items" of the parent VBox).
Solution was...
An aggregation on the form...
<f:Form id="formCustomRadio" editable="true" visible="true" formContainers="{viewmodel>answers}">
Thanks a lot
You can use the VBox and then put the f:formElements inside the items.
Or else use Standard List.
FormElements or containers don't have aggregation items.
I am trying consume an OData service(http://services.odata.org/Northwind/Northwind.svc) in SAPUI5 but it does not return any data
My controller code is as below
Dialog.fragment.xml
<core:FragmentDefinition
xmlns="sap.m"
xmlns:core="sap.ui.core">
<SelectDialog
title="Products"
class="sapUiPopupWithPadding"
items="{/CategoryName}"
search="_handleValueHelpSearch"
confirm="_handleValueHelpClose"
cancel="_handleValueHelpClose">
<StandardListItem
title="{CategoryName}"
/>
</SelectDialog>
</core:FragmentDefinition>
You seem to have an incorrect URI in your model declaration. The image shows the model path assigned as
var sServiceUrl = "8080/http/services.odata.org/V2/Odata/Odata.svc";
This is the reason for the 404 error, you will have to change this to
var sServiceUrl = "http://services.odata.org/Northwind/Northwind.svc";
Also, you have an invalid binding for your SelectDialog. The Odata metadata does no have a EntitySet named "CategoryName". You will have to change this to "Categories".
<SelectDialog
title="Products"
class="sapUiPopupWithPadding"
items="{/Categories}"
search="_handleValueHelpSearch"
confirm="_handleValueHelpClose"
cancel="_handleValueHelpClose">
<StandardListItem
title="{CategoryName}"
/>
</SelectDialog>
Edit: As it seems that you are using SAP WebIDE, it would be a good idea to add services.odata.org as a Destination in HCP
You binded the items aggregation of the SelectDialog to the "/CategoryName" collection, but this collection does not exist in the OData service. I guess you meant to bind it to the Categories collection instead.
I'd like to add additionalText property while using sap.m.MultiComboBox. My view looks as follows:
<MultiComboBox items="{/list}" width="17rem" >
<core:ListItem key="{Name}" text="{Name}" additionalText="{Price}" />
</MultiComboBox>
But this doesn't seem to work as ListItem is not an aggregation for MultiComboBox.
As of UI5 1.60
The control sap.m.MultiComboBox now supports the property showSecondaryValues which should be used together with additionalText in <core:ListItem>.
<MultiComboBox xmlns="sap.m" showSecondaryValues="true" items="{/ProductCollection}">
<core:ListItem key="{ProductId}" text="{Name}" additionalText="{ProductId}" />
</MultiComboBox>
Sample: MultiComboBox - Two columns layout
UI5 1.58 and below
The problem is that, initially, the control Multi Combo Box was not designed to display more than one attribute in the list. According to the Fiori Design Guideline:
Do not use the multi-combo box if you need to display more than one attribute.
I wouldn't suggest to invest much time to do any hack around this limitation making the app more error-prone and less maintainable. Instead, use an alternative control such as Select Dialog with the option multiSelect: true.
The guideline also mentions Value Help Dialog as an option. But it's currently closed sourced and thus not available in OpenUI5 yet.
Would concatenating the text property work for you? As you don't seem to be able to define a really additional text, a workaround should be something like this:
<MultiComboBox items="{/list}" width="17rem" >
<core:Item key="{Name}" text="{Name}: {Price}" />
</MultiComboBox>
<ComboBox
showSecondaryValues= "true"
items="{
path: '/ProductCollection',
sorter: { path: 'Name' }
}">
<core:ListItem key="{ProductId}" text="{Name}" additionalText = {CurrencyCode}"/>
refer this