TypeScript ListViewModels
In addition to TypeScript ViewModels for interacting with instances of your data classes in TypeScript, Coalesce will also generated a List ViewModel for loading searched, sorted, paginated data from the server.
These ListViewModels, like the ViewModels, are dependent on Knockout and are designed to be used directly from Knockout bindings in your HTML.
Base Members
The following members are defined on BaseListViewModel<>
and are available to the ListViewModels for all of your model types:
modelKeyName: string
modelKeyName: string
Name of the primary key of the model that this list represents.
includes: string
includes: string
String that is used to control loading and serialization on the server. See Includes String for more information.
items: KnockoutObservableArray<TItem>
items: KnockoutObservableArray<TItem>
The collection of items that have been loaded from the server.
addNewItem: (): TItem
addNewItem: (): TItem
Adds a new item to the items collection.
deleteItem: (item: TItem): JQueryPromise<any>
deleteItem: (item: TItem): JQueryPromise<any>
Deletes an item and removes it from the items collection.
queryString: string
queryString: string
An arbitrary URL query string to append to the API call when loading the list of items.
search: KnockoutObservable<string>
search: KnockoutObservable<string>
Search criteria for the list. This can be easily bound to with a text box for easy search behavior. See [Search] for a detailed look at how searching works in Coalesce.
isLoading: KnockoutObservable<boolean>
isLoading: KnockoutObservable<boolean>
True if the list is loading.
isLoaded: KnockoutObservable<boolean>
isLoaded: KnockoutObservable<boolean>
True once the list has been loaded.
load: (callback?: any): JQueryPromise<any>
load: (callback?: any): JQueryPromise<any>
Load the list using current parameters for paging, searching, etc Result is placed into the items property.
message: KnockoutObservable<string>
message: KnockoutObservable<string>
If a load failed, this is a message about why it failed.
getCount: (callback?: any): JQueryPromise<any>
getCount: (callback?: any): JQueryPromise<any>
Gets the count of items without getting all the items. Result is placed into the count property.
count: KnockoutObservable<number>
count: KnockoutObservable<number>
The result of getCount(), or the total on this page.
totalCount: KnockoutObservable<number>
totalCount: KnockoutObservable<number>
Total count of items, even ones that are not on the page.
nextPage: (): void
nextPage: (): void
Change to the next page.
nextPageEnabled: KnockoutComputed<boolean>
nextPageEnabled: KnockoutComputed<boolean>
True if there is another page after the current page.
previousPage: (): void
previousPage: (): void
Change to the previous page.
previousPageEnabled: KnockoutComputed<boolean>
previousPageEnabled: KnockoutComputed<boolean>
True if there is another page before the current page.
page: KnockoutObservable<number>
page: KnockoutObservable<number>
Page number. This can be set to get a new page.
pageCount: KnockoutObservable<number>
pageCount: KnockoutObservable<number>
Total page count
pageSize: KnockoutObservable<number>
pageSize: KnockoutObservable<number>
Number of items on a page.
orderBy: KnockoutObservable<string>
orderBy: KnockoutObservable<string>
Name of a field by which this list will be loaded in ascending order.
If set to "none"
, default sorting behavior, including behavior defined with use of [DefaultOrderBy] in C# POCOs, is suppressed.
orderByDescending: KnockoutObservable<string>
orderByDescending: KnockoutObservable<string>
Name of a field by which this list will be loaded in descending order.
orderByToggle: (field: string): void
orderByToggle: (field: string): void
Toggles sorting between ascending, descending, and no order on the specified field.
Model-Specific Members
Configuration
static coalesceConfig: Coalesce.ListViewModelConfiguration<PersonList, ViewModels.Person>
static coalesceConfig: Coalesce.ListViewModelConfiguration<PersonList, ViewModels.Person>
A static configuration object for configuring all instances of the ListViewModel's type is created. See ViewModel Configuration.
coalesceConfig: Coalesce.ListViewModelConfiguration<PersonList, ViewModels.Person>
coalesceConfig: Coalesce.ListViewModelConfiguration<PersonList, ViewModels.Person>
An per-instance configuration object for configuring each specific ListViewModel instance is created. See ViewModel Configuration.
Filter Object
public filter: {
personId?: string
firstName?: string
lastName?: string
gender?: string
companyId?: string
} = null;
public filter: {
personId?: string
firstName?: string
lastName?: string
gender?: string
companyId?: string
} = null;
For each exposed scalar property on the underlying EF POCO, filter
will have a corresponding property. If the filter
object is set, requests made to the server to retrieve data will be passed all the values in this object via the URL's query string. These parameters will filter the resulting data to only rows where the parameter values match the row's values. For example, if filter.companyId
is set to a value, only people from that company will be returned.
These parameters all allow for freeform string values, allowing the server to implement any kind of filtering logic desired. The Standard Data Source will perform the following depending on the property type:
- Dates with a time component will be matched exactly.
- Dates with no time component will match any dates that fell on that day.
- Strings will match exactly unless an asterisk is found, in which case they will be matched with
string.StartsWith
. - Enums will match by string or numeric value. Multiple comma-delimited values will create a filter that will match on any of the provided values.
- Numeric values will match exactly. Multiple comma-delimited values will create a filter that will match on any of the provided values.
Example usage:
var list = new ListViewModels.PersonList();
list.filter = { lastName: "Erickson" };
list.load();
Static Method Members
public readonly namesStartingWith = new Person.NamesStartingWith(this);
public static NamesStartingWith = class NamesStartingWith extends Coalesce.ClientMethod<PersonList, string[]> { ... };
public readonly namesStartingWith = new Person.NamesStartingWith(this);
public static NamesStartingWith = class NamesStartingWith extends Coalesce.ClientMethod<PersonList, string[]> { ... };
For each exposed Static Method on your POCO, the members outlined in Methods - Generated TypeScript will be created.
DataSources
public dataSources = ListViewModels.PersonDataSources;
public dataSource: DataSource<Person> = new this.dataSources.Default();
public dataSources = ListViewModels.PersonDataSources;
public dataSource: DataSource<Person> = new this.dataSources.Default();
For each of the Data Sources on the class, a corresponding class will be added to a namespace named ListViewModels.<ClassName>DataSources
. This namespace can always be accessed on both ViewModel
and ListViewModel
instances via the dataSources
property, and class instances can be assigned to the dataSource
property.