Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Migrated to Confluence 5.3

...

Create a Saved Search DataSource

Code Block
langxml
titleCreate data source
langxml
<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.

javascript
Code Block
lang
titleCreate ListGrid
langjavascript
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).

javascript
Code Block
lang
titleCreate filter
langjavascript
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.

lang
Code Block
javascripttitleCreate form
langjavascript
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);
...
		        });
		    }
		}
	]
})
javascript
Code Block
lang
titleSample updateSavedSearchCallback on main UI
langjavascript
function (record) {
    this._nameForm.getField("name").setValue(record.id);
...
    var criteria = isc.JSON.decode(record.criteria);
    this._listGrid.fetchData(criteria);
}

...