diff --git a/x-editable/x-editable-tests.ts b/x-editable/x-editable-tests.ts new file mode 100644 index 000000000..bf4d34189 --- /dev/null +++ b/x-editable/x-editable-tests.ts @@ -0,0 +1,128 @@ +// Type definitions for X-Editable v1.5.1 +// Project: http://vitalets.github.io/x-editable/index.html +// Definitions by: Chris Kirby +// Definitions: https://github.com/sirkirby/DefinitelyTyped + +/// +/// + +// server post and response +$('#username').editable({ + success: function(response : any, newValue : any) { + if(response.status == 'error') return response.msg; //msg will be shown in editable form + } +}); + +// no post to the server +$('#username').editable({ + type: 'text', + title: 'Enter username', + success: function(response : any, newValue : any) { + // update view model + } +}); + +// text +$("#username").editable({ + url: "/post", + title: "Enter username" +}); + +// text area +$('#comments').editable({ + url: '/post', + title: 'Enter comments', + rows: 10 +}); + +// select +$("#status").editable({ + value: 2, + source: [ + {value: 1, text: 'Active'}, + {value: 2, text: 'Blocked'}, + {value: 3, text: 'Deleted'} + ] +}); + +// date +$('#dob').editable({ + format: 'yyyy-mm-dd', + viewformat: 'dd/mm/yyyy', + datepicker: { + weekStart: 1 + } +}); + +// datetime +$('#last_seen').editable({ + format: 'yyyy-mm-dd hh:ii', + viewformat: 'dd/mm/yyyy hh:ii', + datetimepicker: { + weekStart: 1 + } +}); + +// dateui +$('#dob').editable({ + format: 'yyyy-mm-dd', + viewformat: 'dd/mm/yyyy', + datepicker: { + firstDay: 1 + } +}); + +// combodate +$('#dob').editable({ + format: 'YYYY-MM-DD', + viewformat: 'DD.MM.YYYY', + template: 'D / MMMM / YYYY', + combodate: { + minYear: 2000, + maxYear: 2015, + minuteStep: 1 + } +}); + +// checklist +$('#options').editable({ + value: [2, 3], + source: [ + {value: 1, text: 'option1'}, + {value: 2, text: 'option2'}, + {value: 3, text: 'option3'} + ] +}); + +// select2 remote source (advanced) +$('#country').editable({ + select2: { + placeholder: 'Select Country', + allowClear: true, + minimumInputLength: 3, + id: function (item : any) { + return item.CountryId; + }, + ajax: { + url: '/getCountries', + dataType: 'json', + data: function (term : any, page : any) { + return { query: term }; + }, + results: function (data : any, page : any) { + return { results: data }; + } + }, + formatResult: function (item : any) { + return item.CountryName; + }, + formatSelection: function (item : any) { + return item.CountryName; + }, + initSelection: function (element : any, callback : any) { + return $.get('/getCountryById', { query: element.val() }, function (data : any) { + callback(data); + }); + } + } +}); diff --git a/x-editable/x-editable.d.ts b/x-editable/x-editable.d.ts new file mode 100644 index 000000000..7af603020 --- /dev/null +++ b/x-editable/x-editable.d.ts @@ -0,0 +1,79 @@ +// Type definitions for X-Editable v1.5.1 +// Project: http://vitalets.github.io/x-editable/index.html +// Definitions by: Chris Kirby +// Definitions: https://github.com/sirkirby/DefinitelyTyped + + +/// + +interface XEditableOptions +{ + ajaxOptions?: any; + anim?: string; + autotext?: string; + defaultValue?: any; + disabled?: boolean; + display?: any; + emptyclass?: string; + emptytext?: string; + error?: any; + highlight?: any; + mode?: string; + name?: string; + onblur?: string; + params?: any; + pk?: any; + placement?: string; + savenochange?: boolean; + selector?: string; + send?: string; + showbuttons?: any; + success?: any; + toggle?: string; + type?: string; + unsavedclass?: string; + url?: any; + validate?: any; + value?: any; + + +} + +interface XEditableSubmitOptions { + url?: any; + data?: any; + ajaxOptions?: any; + error(obj: any) : void; + success(obj: any, config: any) : void; +} + +interface XEditable { + options: XEditableOptions; + activate() : void; + destroy() : void; + disable() : void; + enable() : void; + getValue(isSingle: boolean) : any; + hide() : void; + option(key: any, value: any) : void; + setValue(value: any, convertStr: boolean) : void; + show(closeAll: boolean) : void; + submit(options: XEditableSubmitOptions) : void; + toggle(closeAll: boolean) : void; + toggleDisabled() : void; + validate() : void; +} + +interface JQuery { + /** + * Initializes editable with the specified options + * @param options an object with options specific to the editable instance + */ + editable(options?: any): XEditable; + /** + * Initializes editable calling the specific method with is parameters + * @param method the method to call + * @param params the parameters expected by the method + */ + editable(method: string, params?: any): XEditable; +}