Merge pull request #3689 from sirkirby/master

Adding X-editable type definition and tests

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 <https://github.com/sirkirby/>
+// Definitions: https://github.com/sirkirby/DefinitelyTyped
+
+/// <reference path="x-editable.d.ts"/>
+/// <reference path="../jquery/jquery.d.ts"/>
+
+// 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);
+            });
+        }
+    }
+});

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 <https://github.com/sirkirby/>
+// Definitions: https://github.com/sirkirby/DefinitelyTyped
+
+
+/// <reference path="../jquery/jquery.d.ts"/>
+
+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;
+}