i want to have an ItemList, where a Button appears, when the user swipes the element.
I have this code in my view.xml:
<content>
<List id="searchResultList" class="sapUiResponsiveMargin" width="auto" items="{ path : 'assets>/Assets' }">
<items>
<ObjectListItem title="{assets>AssetId}">
<swipeContent>
<Button text="Delete Item" type="Reject"/>
</swipeContent>
</ObjectListItem>
</items>
</List>
</content>
But i getting the error: Uncaught Error: failed to load 'sap/m/swipeContent.js'
What i am doing wrong?
Thank you!
Try this:
<List id="searchResultList" class="sapUiResponsiveMargin" width="auto" items="{ path : 'assets>/Assets' }">
<ObjectListItem title="{assets>AssetId}"/>
<swipeContent>
<Button text="Delete Item" type="Reject"/>
</swipeContent>
</List>
You have the swipeContent inside of the ObjectListItem control, therefore doesn't works.
JS Bin Demonstration
Related
I have a view:
<List
items="{data>/Stages}">
<CustomListItem>
<Panel>
<headerToolbar>
<Toolbar>
<content>
<Button
visible="{= ${data>/Stages/length} > 1}" />
</content>
</Toolbar>
</headerToolbar>
<content>
<Table
growing="true"
growingScrollToLoad="false"
items="{
path: 'data>FieldWorks',
templateShareable: true
}"
class="blueTable originTable techTable">
<columns>
<Column
visible="true"
vAlign="Middle"
width="15px" />
</columns>
<items>
<ColumnListItem>
<cells>
<core:Icon
visible="{ ???}"
src="sap-icon://customfont/moving"
size="2.1rem"
color="#14c6c9" />
</cells>
</ColumnListItem>
</items>
</Table>
</content>
</Panel>
</CustomListItem>
</List>
I have a model (example):
data: {
Stages: [{
FieldWorks: [{}, ....]
}, .....]
}
I hide my button (in my toolBar) by expression binding as you can see.
What is the best way to hide my Icon (in CustomListItem) by condition FieldWorks.length > 1
If you are using a JSON Model just add boolean property to your JSONModel to the FieldWorks entity and bind the visible property to it. Then one time you have to set it when data is loaded or created and that's it.
You can define a new property in your json Model under the FieldWorks property in order to bind the visibility of the icon.
you can use Object.defineProperty (SPEC MDN) to define your calculated new property.
I can't find the problem in my code. The number of rows is always correct, but it only shows the values of the last object in the array of the binding. I'm using the correct aggregation <items> so that's not the issue. Maybe (I hope) I'm just overlooking something.
<core:FragmentDefinition xmlns="sap.m" xmlns:core="sap.ui.core">
<Dialog title="{i18n>selectionTitle}" horizontalScrolling="false">
<beginButton>
<Button text="{i18n>closeSelectionButton}" press="handleCloseSelectedTrainings"/>
</beginButton>
<endButton>
<Button type="Accept" text="{i18n>submitSelectionButton}" press="handleSubmitSelectedTrainings"/>
</endButton>
<content>
<List noDataText="Empty" items="{selectedTrainings>/}" mode="Delete" delete="handleDeleteSelectionItem">
<items>
<CustomListItem >
<HBox>
<core:Icon size="2rem" src="{icon}" class="sapUiSmallMarginBegin sapUiSmallMarginTopBottom"/>
<VBox class="sapUiSmallMarginBegin sapUiSmallMarginTopBottom">
<Text text="{Title}" />
<Label text="{Type} {= ${Begda} ? ${Begda}.toLocaleDateString() : '' }"/>
<HBox>
<CheckBox text="{i18n>selectionMgrApproved}" selected="{Approved}" />
</HBox>
</VBox>
</HBox>
</CustomListItem>
</items>
</List>
</content>
</Dialog>
You are using named model selectedTrainings for items bindings and you forgot to put a model name into CustomListItem elements. Put a model name into bindings like this:
<Text text="{selectedTrainings>Title}" />
I have a list inside Tile container.Direct list is working Okay, but inside the tile container I'm unable to trigger itemPress event. the code is as below
<TileContainer id="container" tileDelete="handleTileDelete">
<CustomTile class="sapMTile customTile sapMPointer ">
<ScrollContainer height="100%" width="100%" vertical="true" focusable="true">
<l:VerticalLayout class=" sapUiContentPadding" width="100%">
<l:content>
<FlexBox>
<List items="{/activeRules}" headerText="" **itemPress="onActiveRulesListItemPress"** growing="true" growingThreshold="3">
<CustomListItem>
<HBox>
<VBox class="sapUiSmallMarginBegin sapUiSmallMarginTopBottom">
<Text class="flexTilebar" text="{name}"/>
<FlexBox class="flexTilebar">
<micro:StackedBarMicroChart size="Responsive" maxValue="{/maxNumberOfInvocztions}">
<micro:bars>
<micro:StackedBarMicroChartBar valueColor="Neutral" value="{numberOfInvocations}"/>
</micro:bars>
</micro:StackedBarMicroChart>
</FlexBox>
<FlexBox class="flexTilebar">
<micro:StackedBarMicroChart bars="{scheduledServiceInvocations}" maxValue="{/maxScheduleCount}" size="Responsive">
<micro:bars>
<micro:StackedBarMicroChartBar value="{scheduleCount}"/>
</micro:bars>
</micro:StackedBarMicroChart>
</FlexBox>
</VBox>
</HBox>
</CustomListItem>
</List>
</FlexBox>
</l:content>
</l:VerticalLayout>
</ScrollContainer>
</CustomTile>
</TileContainer>
Set type="Navigation" in customListItem Because CustomListItem inherits from ListItemBase
Have you tried to set the type property in CustomListItem as its default value is Inactive.
See ListBase documentation:
Fires when an item is pressed unless the item's type property is Inactive.
In a normal list we have sth like this
<List noDataText="---" id="__list0" items="{model>/Orders}">
<items>
<StandardListItem type="Navigation" title="{model>OrderName}" press="onPress" />
</items>
</List>
So we set the press-Event in the Items, but if we have a SmartTable we do not have the inner
<StandardListItem type="Navigation" title="{model>OrderName}" press="onPress" />
I just have:
<sap.ui.comp.smarttable:SmartTable xmlns:sap.ui.comp.smarttable="sap.ui.comp.smarttable"
height="100%"
width="100%"
direction="Column"
fitContainer="true"
tableType="ResponsiveTable"
header="Smart Table"
enableAutoBinding="true"
id="__table0"
entitySet="Datas"/>
//Not the same Model in this case
How can I set an onPress event for the columns?
Thank you very much for your Help.
I am a beginner in sapui5. I'm working on a sapui5 project with splitApp architecture.
I am wondering why the Master view works correctly on a desktop machine, but is empty on a mobile device.
Master.view.xml:
<mvc:View controllerName="query.sap.controller.Master" xmlns:mvc="sap.ui.core.mvc" xmlns:core="sap.ui.core" xmlns="sap.m"
xmlns:u="sap.ui.unified" xmlns:semantic="sap.m.semantic">
<SplitContainer>
<masterPages>
<semantic:MasterPage title="Query List">
<semantic:content>
<!-- For client side filtering add this to the items attribute: parameters: {operationMode: 'Client'}}" -->
<List id="table" width="auto" class="sapUiResponsiveMargin"
items="{ path: '/QueriesSet', sorter : { path : 'Cubename', group : true }
}"
growingScrollToLoad="true">
<headerToolbar>
<Toolbar>
<SearchField width="80%" search="onSearchQuery"/>
<Button icon="sap-icon://refresh" press="onRefresh"/>
</Toolbar>
</headerToolbar>
<items>
<ObjectListItem press="onListItempress" type="Active" title=" {Queryname}" intro="Query name : ">
<firstStatus>
<ObjectStatus text="{GenerationTime}"/>
</firstStatus>
<secondStatus>
<ObjectStatus state="Warning" title="Created By " text="{CreatedBy}"/>
</secondStatus>
</ObjectListItem>
</items>
</List>
</semantic:content>
</semantic:MasterPage>
</masterPages>
</SplitContainer>
On desktop:
On mobile: