Fabric React: GroupedList: Possible to avoid multiple row selection? - office-ui-fabric

I have been trying to use GroupedList within Fabric-React. I need to avoid multiple row selection if that can be helped. i.e. if I select a row, previously selected row should get de-selected.
Here's the groupedlist: https://developer.microsoft.com/en-us/fabric#/controls/web/groupedlist

You have to use selectionMode={SelectionMode.single}
<SelectionZone selection={this._selection} selectionMode={SelectionMode.single}>
<GroupedList
items={this._items}
onRenderCell={this._onRenderCell}
selection={this._selection}
selectionMode={SelectionMode.single}
groups={this._groups}
compact={isCompactMode}
/>
</SelectionZone>
Where the selectionMode on <GroupedList /> says only one selection per group and the selctionMode on <SelectionZone /> says only one selection for all groups.

Related

v-select/Vue: How to enter value not in the list?

I'm trying to find a way to add a new value using v-select previously not in the list. So that the new value entered will become the selected option.
This is my current code:
<v-select
ref="systemSelect"
v-model="reservation.system"
name="system"
label="Select System"
:disabled="isBusy"
:options="systems"
#input="getSystems"
/>
In UI the component looks like this. Here I use Vuex only to get :options. Currently if I enter a new value and click outside that value disappears since its not found in the list
Expected: Would like to enter a new value and use this value as current in the form and save it. Is there a way to achieve this?
Any help would be appreciated.
Thanks!
If you're using vue select, you can use the attribute taggable and multiple to push your own options:
<v-select taggable multiple />
See this link:
https://vue-select.org/guide/values.html#tagging

How to increment variable to count headlines, titles?

I have a JasperReports template, where I need to count the headlines of different "detail bands".
Now, since the headlines can vary (some datasets can be empty and then the whole band is not rendered), I wanted to use a variable for that.
The build-in variables does not suite, since they don't have a "detail_band_count" or something.
Moreover there is not always a headline in one detail band, there can be 1 or 10 following detail bands, where band 2 - 10 shares the same headline declared in band 1.
However, I managed to create a variable in this manner; but it only counts the pages.
Is there a possibility to call the Variable Expression on Variable access? So it would always increment, as soon as I write $V{headline_COUNT}?
It's hard for me to see how you can use variables, you would probably need to restructure report, find a grouping strategy, since you need to set incrementType to one of the available values and you are correct you can't select "header line" or similar.
However, there is a workaround that you can use to count how many time a specific element is showed using the parameter map $P{REPORT_PARAMETERS_MAP}
Define your counting parameter with a default value (avoid it starting as null)
<parameter name="countReportElement" class="java.lang.Integer" isForPrompting="false">
<defaultValueExpression><![CDATA[0]]></defaultValueExpression>
</parameter>
Now on any text field or other element in the band you like to count, you can use a fake printWhenExpression, to increment this parameter
<reportElement x="0" y="262" width="320" height="25" uuid="8fa62997-ffa2-4777-923b-999d372ce09e">
<printWhenExpression><![CDATA[($P{REPORT_PARAMETERS_MAP}.put("countReportElement",((Integer)$P{REPORT_PARAMETERS_MAP}.get("countReportElement"))+1))!=null?true:false]]></printWhenExpression>
</reportElement>
Note the ternary operation will always evaluate true (since Map.put(K key, V value) will return previous object) and put into the parameter map the value incremented by one every time element is evaluated.
To display the value of your count you access the parameter map directly.
<textField>
<reportElement x="57" y="13" width="100" height="20" uuid="7ca30577-0ca9-47c2-91ae-c7002fbbfbf7"/>
<textFieldExpression><![CDATA[$P{REPORT_PARAMETERS_MAP}.get("countReportElement")]]></textFieldExpression>
</textField>
be sure to set evaluationTime as need in report.

Reporting Services Error?

When running a report in preview I get the following error The definition of the report is invalid , the tablix 'Tablix11' contains an invalid TablixMember. The sort Expressions element is not allowed if Group is omitted.
I have never come across this error before and cant understand what is causing it.
The error can be replicated by creating a simple Tablix and looking at the underlying XML.
When you create a Tablix with a group, the underlying RDL XML will include something like this:
<TablixRowHierarchy>
<TablixMembers>
<TablixMember />
<TablixMember>
<Group Name="Group1">
<GroupExpressions>
<GroupExpression>=Fields!val.Value</GroupExpression>
</GroupExpressions>
</Group>
<SortExpressions>
<SortExpression>
<Value>=Fields!val.Value</Value>
</SortExpression>
</SortExpressions>
<TablixMembers>
<TablixMember>
<Group Name="Details3" />
</TablixMember>
</TablixMembers>
</TablixMember>
</TablixMembers>
</TablixRowHierarchy>
If you remove the entire Group element, this will give the same error you're seeing:
If you also remove the SortExpressions element this will allow the report to render without error.
However - it's impossible for me to say how your RDL file got in this state in the first place. Given that hacking XML to get things running is seldom a good idea, my recommendation would be to start the tablix from scratch instead of hacking things to a working state - you might just be introducing more problems.
But at least hopefully now you can see why the error might be occurring.
I found that the Tablix header had a textbox property containing interactive sort. This text box is in the header, and not part of the detail. When I deleted the field from the detail of the tablix, the interactive sort remained on the textbox in the header.
Changing it on the header by right clicking on the header textbox of the tablix, then selecting textbox properties, then selecting "interactive sorting", and then correcting the "sort by" value to the correct field name did the trick.

how to access custom row(s) data via Alloy?

ive tried many/multiple ways to get this to work but just cant as yet, so would appreciate anyone's assistance.
i have a view as follows :
"LBProw.xml"
<Alloy>
<TableViewRow id="LBProw" >
<ScrollableView id="sView" >
<View id="view1" >
<!-- text labels on the row -->
<Label id="LBPheading" > </Label>
<Label id="myLabel1" > </Label>
<Label id="myLabel2" > </Label>
</View>
</ScrollableView>
</TableViewRow>
</Alloy>
adding rows to the table is working 100% fine.
what i cant work out, is how can I loop through the previously created tableview rows, access the rows (custom) fields values, and then do something with those values. I need to access these rows (and their custom row fields values) from a different JS file.
eg. somelogic.JS <--- loop thru the table view rows, retrieve the rows custom field values and then use those values (note that $.myTable is directly accessible from this JS file)
as an example, i tried using the following but could not work out how to get the individual rows custom fields values (the label values for "LBPheading", "myLabel1", "myLabel2")
// loop thru the rows
for (i = 0; i < $.myTable.data[0].rows.length; i++) {`
Ti.API.info('row #' + i);
?? $.myTable.data[0].rows[i].???? <== how can i get the rows (custom) field values ?
}
I think, it has to do with the embedded ScrollableView and View in the row ? but I cant figure out how to reference the Label(s) within that structure.
Really appreciate any assistance/advice.
IMHO you are doing it the wrong way, the UI is just for presentation and you should keep track of the model associated with each row. When the user selects a row, query the collection and retrieve the associated model... that should contain the information you are looking for
Here is a good example for you to refer to. It is made in Alloy, custom rows, and dynamic updates to the tableview.
http://docs.appcelerator.com/titanium/latest/#!/guide/Alloy_Samples-section-37535160_AlloySamples-TodoList

GridView-like page but with static groups and each group section will have a different layout

I would like to create a page a little like the Grouped Items Page inside the Contoso Cookbook application (if you have seen it). Basically, it's a GridView bound to a CollectionViewSource.
<CollectionViewSource
x:Name="groupedItemsViewSource"
Source="{Binding Groups}"
IsSourceGrouped="true"
ItemsPath="TopItems"
d:Source="{Binding AllGroups, Source={d:DesignInstance Type=data:SampleDataSource, IsDesignTimeCreatable=True}}"/>
The GridView appears to bind the Groups to the highest level of the CVS data source with the Source attribute and then binds each individual section with the ItemsPath attribute.
However, my page differs in that my groups are static, they are: Times, Categories, List. The first will have a listview, the second a grid of tiles and the third will be another listview.
Also, each group section itself has a different layout. It's not just repeating groups and repeating item-layouts. I was expecting to be able to define "static" groups and a layout for each group directly in the XAML and maybe even add test data to those elements, but it seems like GridView requires data binding, even if just to a dummy data source at design time.
So how would you do this? So essentially, it needs exactly the same horizontal scroll and wrapping as the GridView, but the groups have totally different layouts and each group should ideally be definable directly in the XAML?
I'm thinking of creating a normal grid enclosed in a scroll viewer... what do you think? What would you do?
In a GridView, groups can be assigned a GroupStyle like this:
<GridView.GroupStyle>
<GroupStyle HeaderTemplate="{StaticResource MyGroupHeaderTemplate}"
Panel="{StaticResource MyGroupItemsPanelTemplate}"
HidesIfEmpty="True" />
</GridView.GroupStyle>
Now, in your case each group will need its own GroupStyle.
So instead of using a ListView within each group in a GridView, you could:
Define 2 different group styles with header templates and the panel (ItemsPanelTemplate (MSDN)) that you want to use
Define a class that has your custom logic to select which group style to use for a group.(GroupStyleSelector)
Set the GroupStyleSelector property on the GridView in XAML
Define static groups in your view model to contain the data you want: (Times, Categories, List)
This can be accomplished with a DataTemplateSelector. You would have multiple groups, but within each group the items are styled differently. See this SO post for more help articles.