Smart Filter

The Smart Filter provides a user interface to filter records returned by a Smart Data Source.

Sample markup

        <!-- Dynamic Smart Filter -->
		<smart-filter
            orientation="horizontal"
            smart-object-name="customerFilter"
            filter-fields-initial="Country"
            filter-fields-optional="City,CustNum">
        </smart-filter>
 
		<!-- Static Smart Filter -->
		<smart-static-filter 
			smart-template="/Customer/filter"
            smart-object-name="staticCustomerFilter"
        </smart-static-filter>

Description (Dynamic Smart Filter)

AttributeDescription
orientationEither vertical or horizontal as values and is used to specify the filter's layout orientation, defaults to vertical.
smart-object-nameThe unique identifier used to obtain references of the Smart Filter component
filter-fields-initialComma delimited list indicating which fields should be initially displayed by the filter
filter-fields-optionalComma delimited list indicating which fields should optionally be displayed by the filter

 

Description (Static Smart Filter)

AttributeDescription
smart-templateThe URL from which the Smart Static Filter should fetch it's template.
smart-object-nameThe unique identifier used to obtain references of the Smart Filter component

 

Sample Smart Static Filter template

<div>
    <input class="form-control" placeholder="Customer Number" id="custNumFilter" forField="CustNum" />
    <select class="form-control" size=1 forFilterField="custNumFilter">
        <option value="EQ">Equals</option>
        <option value="GT">Greater than</option>
        <option value="LT">Less than</option>
    </select>
    <smart-lookup 
        forField="SalesRep"
        smart-lookup-header="Lookup SalesRep" 
        smart-lookup-key-field="SalesRep" 
        smart-lookup-key-value-field="" 
        smart-lookup-fields="RepName" 
        smart-business-entity-name="Consultingwerk.SmartComponentsDemo.OERA.Sports2000.SalesRepBusinessEntity" 
        smart-entity-table="eSalesrep" 
        smart-grid-layout="Consultingwerk.SmartComponentsDemo.OERA.Sports2000.SalesRepBusinessEntity/salesrep" 
        id="SalesRep" 
        ng-required 
        style="width: 150px;" 
        smart-lookup-dialog-options="width=700px; height=500px;">
    </smart-lookup> 
    <smart-combo-editor
        forField="SalesRep"
        smart-business-entity-name="Consultingwerk.SmartComponentsDemo.OERA.Sports2000.SalesRepBusinessEntity"
        smart-entity-table="eSalesrep"
        display-column-name="RepName" 
        key-column-name="SalesRep">
    </smart-combo-editor>
    
    <div class="btn-group">
        <button filterButton class="btn btn-default">Filter</button>
        <button cancelButton class="btn btn-default">Clear</button>
    </div>
</div>

 

Smart Static Filter Template Directives

AttributeDescription
forFieldCan be used on Smart Lookups, Smart Combo Editors and any HTML input element. If set, the Smart Static Filter will use the value of this attribute as the name of the record field to associate with this input's value.
forFilterFieldCan be used on Smart Lookups, Smart Combo Editors and any HTML input element. If set, the Smart Static Filter will use the value of this input to set the operator for filters on the field specified as it's value.
filterButtonUse this attribute to mark the HTML element as the filter button. This makes the Smart Static Filter fire the filter event when that HTML element is clicked.
cancelButtonUse this attribute to mark the HML element as the cancel button. This makes the Smart Static Filter clear all filter values when that HTML element is clicked.