...
Create a Saved Search DataSource
Code Block |
---|
lang | xml |
---|
title | Create data source |
---|
lang | xml |
---|
|
<DataSource ID="savedSearch" serverType="sql" tableName="savedSearch" titleField="name">
<fields>
<field name="id" type="sequence" hidden="true" primaryKey="true" />
<field name="type" type="text" length="255" hidden="true" required="true" />
<field name="name" type="text" title="Name" length="255" required="true" />
<field name="criteria" type="text" hidden="true" length="4000" required="true" />
</fields>
</DataSource>
|
...
The ListGrid can use any DataSource.We will use the "supplyItem" DataSource.
Code Block |
---|
lang | javascript |
---|
title | Create ListGrid |
---|
lang | javascript |
---|
|
isc.ListGrid.create({
dataSource: supplyItem,
autoDraw: false,
height: 450,
})
|
The saved search filter uses the "savedSearch" DataSource filtering data by type. It uses the "supplyItem" DataSource ID as the type value (ComboBoxItem form field).
Code Block |
---|
lang | javascript |
---|
title | Create filter |
---|
lang | javascript |
---|
|
isc.DynamicForm.create({
width: 200,
autoDraw: false,
fields: [
{
name: "name",
editorType: "ComboBoxItem",
displayField: "name",
valueField: "id",
title: "Filter",
emptyDisplayValue: "All Records",
optionDataSource: savedSearch,
fetchMissingValues: false,
cachePickListResults: false,
// filter data by item datasource
optionCriteria: {
fieldName:"type",
operator:"equals",
value: supplyItem.ID
},
changed: function (form, item, value) {
var record = item.getSelectedRecord();
...
if (record != null) {
var newCriteria = isc.JSON.decode(record.criteria);
_this._listGrid.fetchData(newCriteria);
} else {
_this._listGrid.fetchData();
}
}
}
]
})
|
...
To create/update the saved search a modal window is used. It contains a form (DynamicForm) for editing data ("savedSearch" DataSource). To dynamically create filtering rules use a FilterBuilder with the "supplyItem" DataSource.
Code Block |
lang |
---|
javascript | title | Create form |
---|
lang | javascript |
---|
|
this._form = isc.DynamicForm.create({
width: 700,
margin: 5,
useAllDataSourceFields: true,
dataSource: this.dataSource,
fields: [
{
editorType: "HeaderItem",
defaultValue: "New search"
},
{
editorType: "TextItem",
name: "name"
},
{
editorType: "CanvasItem",
name: "criteriaFilter",
title: "Criteria",
createCanvas : function () {
return _this._filter = isc.FilterBuilder.create({
dataSource: _this.itemDataSource
});
}
},
{
editorType: "ButtonItem",
name: "submit",
title: "Search",
click: function () {
var encoder = isc.JSONEncoder.create({
dateFormat: "dateConstructor"
});
var criteriaValue = isc.JSON.encode(this._filter.getCriteria(), encoder);
this._form.setValue("criteria", criteriaValue);
this._form.setValue("type", this.itemDataSource.ID);
var _this = this;
this._form.submit(function (dsResponse, data, dsRequest) {
var record = dsResponse.data[0];
updateSavedSearchCallback(record);
...
});
}
}
]
})
|
Code Block |
---|
lang | javascript |
---|
title | Sample updateSavedSearchCallback on main UI |
---|
lang | javascript |
---|
|
function (record) {
this._nameForm.getField("name").setValue(record.id);
...
var criteria = isc.JSON.decode(record.criteria);
this._listGrid.fetchData(criteria);
}
|
...