Skip to content

Commit 62f4754

Browse files
committed
Fix of #569 - correctly working itemLimit prop
1 parent c31ce7f commit 62f4754

File tree

4 files changed

+32
-21
lines changed

4 files changed

+32
-21
lines changed

docs/documentation/docs/controls/ComboBoxListItemPicker.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -121,5 +121,6 @@ The `ComboBoxListItemPicker` control can be configured with the following proper
121121
| filter | string | no | Condition to filter list Item, same as $filter ODATA parameter|
122122
| multiSelect | boolean | no | Allows multiple selection|
123123
| onInitialized | () => void | no | Calls when component is ready|
124+
| itemLimit | number | no | Maximum number of items to be displayed in the combobox. Default: 100 |
124125

125126
![](https://telemetry.sharepointpnp.com/sp-dev-fx-controls-react/wiki/controls/ComboBoxListItemPicker)

src/common/dal/ListItemRepository.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ export class ListItemRepository {
1717
let returnItems: any[];
1818
try {
1919
const webAbsoluteUrl = !webUrl ? this.SiteUrl : webUrl;
20-
const apiUrl = `${webAbsoluteUrl}/_api/web/lists('${listId}')/items?$select=${keyInternalColumnName || 'Id'},${internalColumnName}&$filter=${filterText}`;
20+
const apiUrl = `${webAbsoluteUrl}/_api/web/lists('${listId}')/items?$select=${keyInternalColumnName || 'Id'},${internalColumnName}&$filter=${filterText}&$top=${top}`;
2121
const data = await this.SPClient.get(apiUrl, SPHttpClient.configurations.v1);
2222
if (data.ok) {
2323
const results = await data.json();

src/controls/listItemPicker/ComboBoxListItemPicker.tsx

Lines changed: 29 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -35,36 +35,46 @@ export class ComboBoxListItemPicker extends React.Component<IComboBoxListItemPic
3535
}
3636

3737
protected async loadOptions(): Promise<void> {
38-
let query = "";
39-
query += this.props.filter || "Id gt 0";
40-
let keyColumnName = this.props.keyColumnInternalName || "Id";
38+
const {
39+
filter,
40+
keyColumnInternalName,
41+
listId,
42+
columnInternalName,
43+
webUrl,
44+
itemLimit,
45+
defaultSelectedItems,
46+
onInitialized
47+
} = this.props;
48+
let query = filter || "";
49+
//query += filter;
50+
let keyColumnName = keyColumnInternalName || "Id";
4151
let listItems = await this._listItemRepo.getListItemsByFilterClause(query,
42-
this.props.listId,
43-
this.props.columnInternalName,
44-
this.props.keyColumnInternalName,
45-
this.props.webUrl,
46-
/*this.props.itemLimit ||*/ 100);
52+
listId,
53+
columnInternalName,
54+
keyColumnInternalName,
55+
webUrl,
56+
itemLimit || 100);
4757

4858
let options = listItems.map(option => {
4959
return {
5060
key: option[keyColumnName],
51-
text: option[this.props.columnInternalName || "Id"]
61+
text: option[columnInternalName || "Id"]
5262
};
5363
});
54-
if (this.props.defaultSelectedItems) {
64+
if (defaultSelectedItems) {
5565
//if passed only ids
56-
if (!isNaN(this.props.defaultSelectedItems[0])) {
57-
this.selectedItems = options.filter(opt => this.props.defaultSelectedItems.indexOf(opt.key) >= 0);
66+
if (!isNaN(defaultSelectedItems[0])) {
67+
this.selectedItems = options.filter(opt => defaultSelectedItems.indexOf(opt.key) >= 0);
5868
}
5969
else {
60-
this.selectedItems = options.filter(opt => this.props.defaultSelectedItems.map(selected => selected[keyColumnName]).indexOf(opt.key) >= 0);
70+
this.selectedItems = options.filter(opt => defaultSelectedItems.map(selected => selected[keyColumnName]).indexOf(opt.key) >= 0);
6171
}
6272
}
6373
this.setState({
6474
availableOptions: options
6575
});
66-
if(this.props.onInitialized){
67-
this.props.onInitialized();
76+
if(onInitialized){
77+
onInitialized();
6878
}
6979
}
7080

@@ -105,7 +115,7 @@ export class ComboBoxListItemPicker extends React.Component<IComboBoxListItemPic
105115
/**
106116
* On Selected Item
107117
*/
108-
private onChanged = (option?: IComboBoxOption, index?: number, value?: string, submitPendingValueEvent?: any): void => {
118+
private onChanged = (option?: IComboBoxOption, index?: number, value?: string, submitPendingValueEvent?: any): void => {
109119
if(this.props.multiSelect){
110120
if (option && option.selected) {
111121
this.selectedItems.push({
@@ -119,12 +129,12 @@ export class ComboBoxListItemPicker extends React.Component<IComboBoxListItemPic
119129
}else{
120130
this.selectedItems.push({
121131
[this.props.keyColumnInternalName || "Id"]: option.key,
122-
[this.props.columnInternalName]: option.text
132+
[this.props.columnInternalName]: option.text
123133
});
124-
134+
125135
this.selectedItems = this.selectedItems.filter(o => o[this.props.keyColumnInternalName || "Id"] === option.key);
126136
}
127-
137+
128138
this.props.onSelectedItem(this.selectedItems);
129139
}
130140
}

src/controls/listItemPicker/IComboBoxListItemPickerProps.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ export interface IComboBoxListItemPickerProps {
1919
webUrl: string;
2020
spHttpClient: SPHttpClient;
2121
listId: string;
22-
// itemLimit: number;
22+
itemLimit?: number;
2323
filter?: string;
2424
className?: string;
2525
defaultSelectedItems?: any[];

0 commit comments

Comments
 (0)