-
Notifications
You must be signed in to change notification settings - Fork 130
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
updating property of type date with text #360
Comments
Hmm - yes I think you are right, this needs to be changed. In fact right now, once a property has been set observably to be a date, it can no longer be observably updated. All the examples using Date, at jsviews.com are in fact using the jQuery UI datepicker (http://www.jsviews.com/#samples/tag-controls/datepicker), which actually sets the input to type string, so I didn't realise this scenario of an observable Date property was not being supported. I think we need to change that line of code to
so that you can freely observably update a property, setting it to a Date type or a string type or some other type, independently of its current type. Can you validate that this change works for you? |
well, actually i've made a workaround by forcing the value to be a date, witch seems to be working. i've changed the datepicker here: onAfterLink: function (tagCtx, linkCtx) {
.....
$('input', tag.linkedElem).datepicker({
onSelect: function (dateText, inst) {
tag.value = dateText;
var dateObj = $.datepicker.parseDate(tag._datefrmt, dateText);
tag.update(dateObj);
}
});
tag._datefrmt = $('input', tag.linkedElem).datepicker("option", "dateFormat");
var formatted = $.datepicker.formatDate(tag._datefrmt, new Date(tagCtx.args[0]));
tag.setValue(formatted);
} please note that using formatDate and parseDate allow for localization of the conversion from string to date and viceversa. i'll give a try to your fix anyway, since a string value is better than no value.. :) |
Sorry, my fix was incorrect. I replaced it above by a corrected version. |
Feature improvements: - Major update for custom tags - including support for two-way binding to multiple args and props See samples: http://www.jsviews.com/#samples/tag-controls/jqui/draggable-droppable@jsv-draggable and tests: http://www.jsviews.com/test/unit-tests-jsviews.html?testId=f46a512b and also jQuery UI tag control samples such as http://www.jsviews.com/#samples/tag-controls/jqui/resizable and http://www.jsviews.com/#samples/tag-controls/jqui/draggable-droppable. Also many code examples in https://www.jsviews.com/download/sample-tag-controls/jsviews-jqueryui-widgets.js A tag definition can include: tag.bindTo - which specifies two-way bound parameters (one or more args and/or props) tag.linkedElement - which specifies selectors for linkedElems for any of the two-way bound parameters tag.linkedCtxParam - which specifies/names tag contextual parameters for any of the two-way bound parameters mainElement - which specifies selector for an element used for setting id, width or height (otherwise, linkedElem is used) A tag onBind event can set: tag.linkedElem tag.linkedElems tag.mainElem - which is the element used for setting id, width or height (otherwise, linkedElem is used) tag.displayElem - which is the element used for setting class (otherwise, mainElem/linkedElem is used) The following tag methods are available: tag.bndArgs() - which returns array of 'external' bound parameters (after convert, if convert=... is specified) tag.update(...) - which observably updates any ('external') bound parameters (using convertBack, if specified) tag.setValue(...) - which sets tag itself to new ('internal') values of bound parameters tag.getValue(...) - which returns array of current ('internal') values of bound parameters New 'tag contextual parameters' feature - see samples and explanation: http://www.jsviews.com/#samples/tag-controls/jqui/resizable and http://www.jsviews.com/#samples/tag-controls/jqui/draggable-droppable@tag-ctxl-params - Other custom tag improvements: New 'tag boundProps' feature: Tag definition can include: tag.boundProps - which specifies any additional props that are bound, without needing ^myprop=... notation. See sample: http://www.jsviews.com/#samples/tag-controls/range New 'tag contentCtx' feature: Tag definition can include: tag.contentCtx - which specifies the data context within the tag block content. Set contentCtx = true for inheriting parentView context, or to a function, for specifying other context New 'tag argDefault' feature: Tag definition can include: tag.argDefault: false - which prevents the first arg defaulting to current data New 'tag onUpdate: false' feature: Tag definition can include: tag.onUpdate: false - which is equivalent to an onUpdate handler which does nothing but returns false, so tag does not rerender when bound args or props update - Major update for jQuery UI widget-based tag controls library: Extensive new jQueryUI widget controls support and accompanying samples/documentation: http://www.jsviews.com/#download/jqueryui-tagcontrols http://www.jsviews.com/#samples/tag-controls/jqui - New lateRender=true feature: set lateRender=true on any tag, to make the tag render only after completing the data-linking pass. Useful for using expressions such as #childTags('myTag') in data-link expressions. See tests: http://www.jsviews.com/test/unit-tests-jsviews.html?testId=6be4ff95 and sample: http://www.jsviews.com/#samples/tag-controls/jqui/selectable@late-render - {^{on ...}} with no content allows setting width, height, id and class Perf improvements for sorting, moving, refreshing: - Much improved perf for {^{for myArray}}...{{/for}} when making observable changes to underlying array. When using $.observable(myArray).refresh(...) or $.observable(myArray).move(...), the resulting changes to the rendered items no longer result in deleting and re-rendering the moved items. Instead the rendered HTML elements are simply moved to their new positions under the parent element. Bug fixes: - BorisMoore/jsviews#361: Breaking change (radiobuttons) - both radiogroup and directly data-linked radio buttons now behave identically. Neither of them coerce value to string - Bug with setting tag.depends=... (Breaking change: Note that setting fn.depends="myArray" updates for array changes as well as prop change. See: http://www.jsviews.com/test/unit-tests-jsviews.html?testId=303f5bfd - BorisMoore/jsviews#354: Minor 'onError' bug - BorisMoore/jsviews#360: Datepicker bug fix for correct behavior when data-linking to a value of type Date - Several minor bug fixes Unit tests: - Several additional unit tests Other minor breaking changes: - The undocumented lazyLink feature has been removed - The undocumented init: false feature for custom tags has been removed.
Feature improvements: - Major update for custom tags - including support for two-way binding to multiple args and props See samples: http://www.jsviews.com/#samples/tag-controls/jqui/draggable-droppable@jsv-draggable and tests: http://www.jsviews.com/test/unit-tests-jsviews.html?testId=f46a512b and also jQuery UI tag control samples such as http://www.jsviews.com/#samples/tag-controls/jqui/resizable and http://www.jsviews.com/#samples/tag-controls/jqui/draggable-droppable. Also many code examples in https://www.jsviews.com/download/sample-tag-controls/jsviews-jqueryui-widgets.js A tag definition can include: tag.bindTo - which specifies two-way bound parameters (one or more args and/or props) tag.linkedElement - which specifies selectors for linkedElems for any of the two-way bound parameters tag.linkedCtxParam - which specifies/names tag contextual parameters for any of the two-way bound parameters mainElement - which specifies selector for an element used for setting id, width or height (otherwise, linkedElem is used) A tag onBind event can set: tag.linkedElem tag.linkedElems tag.mainElem - which is the element used for setting id, width or height (otherwise, linkedElem is used) tag.displayElem - which is the element used for setting class (otherwise, mainElem/linkedElem is used) The following tag methods are available: tag.bndArgs() - which returns array of 'external' bound parameters (after convert, if convert=... is specified) tag.update(...) - which observably updates any ('external') bound parameters (using convertBack, if specified) tag.setValue(...) - which sets tag itself to new ('internal') values of bound parameters tag.getValue(...) - which returns array of current ('internal') values of bound parameters New 'tag contextual parameters' feature - see samples and explanation: http://www.jsviews.com/#samples/tag-controls/jqui/resizable and http://www.jsviews.com/#samples/tag-controls/jqui/draggable-droppable@tag-ctxl-params - Other custom tag improvements: New 'tag boundProps' feature: Tag definition can include: tag.boundProps - which specifies any additional props that are bound, without needing ^myprop=... notation. See sample: http://www.jsviews.com/#samples/tag-controls/range New 'tag contentCtx' feature: Tag definition can include: tag.contentCtx - which specifies the data context within the tag block content. Set contentCtx = true for inheriting parentView context, or to a function, for specifying other context New 'tag argDefault' feature: Tag definition can include: tag.argDefault: false - which prevents the first arg defaulting to current data New 'tag onUpdate: false' feature: Tag definition can include: tag.onUpdate: false - which is equivalent to an onUpdate handler which does nothing but returns false, so tag does not rerender when bound args or props update - Major update for jQuery UI widget-based tag controls library: Extensive new jQueryUI widget controls support and accompanying samples/documentation: http://www.jsviews.com/#download/jqueryui-tagcontrols http://www.jsviews.com/#samples/tag-controls/jqui - New lateRender=true feature: set lateRender=true on any tag, to make the tag render only after completing the data-linking pass. Useful for using expressions such as #childTags('myTag') in data-link expressions. See tests: http://www.jsviews.com/test/unit-tests-jsviews.html?testId=6be4ff95 and sample: http://www.jsviews.com/#samples/tag-controls/jqui/selectable@late-render - {^{on ...}} with no content allows setting width, height, id and class Perf improvements for sorting, moving, refreshing: - Much improved perf for {^{for myArray}}...{{/for}} when making observable changes to underlying array. When using $.observable(myArray).refresh(...) or $.observable(myArray).move(...), the resulting changes to the rendered items no longer result in deleting and re-rendering the moved items. Instead the rendered HTML elements are simply moved to their new positions under the parent element. Bug fixes: - BorisMoore/jsviews#361: Breaking change (radiobuttons) - both radiogroup and directly data-linked radio buttons now behave identically. Neither of them coerce value to string - Bug with setting tag.depends=... (Breaking change: Note that setting fn.depends="myArray" updates for array changes as well as prop change. See: http://www.jsviews.com/test/unit-tests-jsviews.html?testId=303f5bfd - BorisMoore/jsviews#354: Minor 'onError' bug - BorisMoore/jsviews#360: Datepicker bug fix for correct behavior when data-linking to a value of type Date - Several minor bug fixes Unit tests: - Several additional unit tests Other minor breaking changes: - The undocumented lazyLink feature has been removed - The undocumented init: false feature for custom tags has been removed.
Feature improvements: - Major update for custom tags - including support for two-way binding to multiple args and props See samples: http://www.jsviews.com/#samples/tag-controls/jqui/draggable-droppable@jsv-draggable and tests: http://www.jsviews.com/test/unit-tests-jsviews.html?testId=f46a512b and also jQuery UI tag control samples such as http://www.jsviews.com/#samples/tag-controls/jqui/resizable and http://www.jsviews.com/#samples/tag-controls/jqui/draggable-droppable. Also many code examples in https://www.jsviews.com/download/sample-tag-controls/jsviews-jqueryui-widgets.js A tag definition can include: tag.bindTo - which specifies two-way bound parameters (one or more args and/or props) tag.linkedElement - which specifies selectors for linkedElems for any of the two-way bound parameters tag.linkedCtxParam - which specifies/names tag contextual parameters for any of the two-way bound parameters mainElement - which specifies selector for an element used for setting id, width or height (otherwise, linkedElem is used) A tag onBind event can set: tag.linkedElem tag.linkedElems tag.mainElem - which is the element used for setting id, width or height (otherwise, linkedElem is used) tag.displayElem - which is the element used for setting class (otherwise, mainElem/linkedElem is used) The following tag methods are available: tag.bndArgs() - which returns array of 'external' bound parameters (after convert, if convert=... is specified) tag.update(...) - which observably updates any ('external') bound parameters (using convertBack, if specified) tag.setValue(...) - which sets tag itself to new ('internal') values of bound parameters tag.getValue(...) - which returns array of current ('internal') values of bound parameters New 'tag contextual parameters' feature - see samples and explanation: http://www.jsviews.com/#samples/tag-controls/jqui/resizable and http://www.jsviews.com/#samples/tag-controls/jqui/draggable-droppable@tag-ctxl-params - Other custom tag improvements: New 'tag boundProps' feature: Tag definition can include: tag.boundProps - which specifies any additional props that are bound, without needing ^myprop=... notation. See sample: http://www.jsviews.com/#samples/tag-controls/range New 'tag contentCtx' feature: Tag definition can include: tag.contentCtx - which specifies the data context within the tag block content. Set contentCtx = true for inheriting parentView context, or to a function, for specifying other context New 'tag argDefault' feature: Tag definition can include: tag.argDefault: false - which prevents the first arg defaulting to current data New 'tag onUpdate: false' feature: Tag definition can include: tag.onUpdate: false - which is equivalent to an onUpdate handler which does nothing but returns false, so tag does not rerender when bound args or props update - Major update for jQuery UI widget-based tag controls library: Extensive new jQueryUI widget controls support and accompanying samples/documentation: http://www.jsviews.com/#download/jqueryui-tagcontrols http://www.jsviews.com/#samples/tag-controls/jqui - New lateRender=true feature: set lateRender=true on any tag, to make the tag render only after completing the data-linking pass. Useful for using expressions such as #childTags('myTag') in data-link expressions. See tests: http://www.jsviews.com/test/unit-tests-jsviews.html?testId=6be4ff95 and sample: http://www.jsviews.com/#samples/tag-controls/jqui/selectable@late-render - {^{on ...}} with no content allows setting width, height, id and class Perf improvements for sorting, moving, refreshing: - Much improved perf for {^{for myArray}}...{{/for}} when making observable changes to underlying array. When using $.observable(myArray).refresh(...) or $.observable(myArray).move(...), the resulting changes to the rendered items no longer result in deleting and re-rendering the moved items. Instead the rendered HTML elements are simply moved to their new positions under the parent element. Bug fixes: - #361: Breaking change (radiobuttons) - both radiogroup and directly data-linked radio buttons now behave identically. Neither of them coerce value to string - Bug with setting tag.depends=... (Breaking change: Note that setting fn.depends="myArray" updates for array changes as well as prop change. See: http://www.jsviews.com/test/unit-tests-jsviews.html?testId=303f5bfd - #354: Minor 'onError' bug - #360: Datepicker bug fix for correct behavior when data-linking to a value of type Date - Several minor bug fixes Unit tests: - Several additional unit tests Other minor breaking changes: - The undocumented lazyLink feature has been removed - The undocumented init: false feature for custom tags has been removed.
Fixed with commit 84 |
Hi guys, could I reopen this discussion? The problem with Boris' fix is that now datepicker.setValue() is agnostic to whether the value is of type string or date object, but datepicker.onSelect() is not. I am in the situation where the the data value is a date text in local ISO 8601 format, which needs to be converted and back again (additionally with some special conversion rules for exclusive ranges), plus I'd like to have a generic datepicker tag control, which is agnostic to what types are actually involved. Hence I was trying to delegate the type handling to converters (so again, this works great when setting the date value but not after selecting it). So I propose to check whether a back converter is present and presume it can convert from a date object:
This gist shows the whole tag control. |
This test.zip includes updated jsviews.js, jsviews-jqueryui-widgets.js and validate.js, and an example .html page for With the update But you can choose different formats for data and for display by setting them as properties (using jQuery UI datepicker formats):
Alternatively:
You can create your own flavor of datepicker which defaults to whatever you want, For example a datepicker which uses Date, and has default display format
To change the default for the usual {{datepicker}} tag, use:
You can also use your own converters for custom formats. For example, you could use moment.js to format/parse to other serialization patterns (as in the datepicker with converters sample). If you want, you can include such converters by default in a custom tag (or override the regular {{datepicker}} tag) by writing:
For spinners (see #374) you can create a time spinner by creating a custom tag overriding the onBind handler:
with the following onBind:
Alternatively, rather than creating a new
|
Feature improvements: - Important update for jQuery UI widget-based tag controls library, including: Improvements to {{datepicker}} tag control. See new documentation: - http://www.jsviews.com/#samples/tag-controls/jqui/datepicker/formats Improvements to {{spinner}} tag control. See new documentation: - http://www.jsviews.com/#samples/tag-controls/jqui/spinner/formats New {{timespinner}} control. See new documentation: - http://www.jsviews.com/#samples/tag-controls/jqui/timespinner Bug fixes: - BorisMoore/jsviews#360 Datepicker data binding and formatting - BorisMoore/jsviews#369 DataTable plugin scenario (cloned elements) - BorisMoore/jsviews#373 Radio buttons binding to integers - BorisMoore/jsviews#374 {{timespinner}} scenarios - BorisMoore/jsviews#375 Bad version of remarkable.js in China - BorisMoore/jsrender#317 Defensive coding against corrupted jQuery cached template on element - Several minor bug fixes Minor breaking change: - Added "use strict" to all .js files. Can be breaking if files are concatenated. Unit tests: - Several additional unit tests
Feature improvements: - Important update for jQuery UI widget-based tag controls library, including: Improvements to {{datepicker}} tag control. See new documentation: - http://www.jsviews.com/#samples/tag-controls/jqui/datepicker/formats Improvements to {{spinner}} tag control. See new documentation: - http://www.jsviews.com/#samples/tag-controls/jqui/spinner/formats New {{timespinner}} control. See new documentation: - http://www.jsviews.com/#samples/tag-controls/jqui/timespinner Bug fixes: - BorisMoore/jsviews#360 Datepicker data binding and formatting - BorisMoore/jsviews#369 DataTable plugin scenario (cloned elements) - BorisMoore/jsviews#373 Radio buttons binding to integers - BorisMoore/jsviews#374 {{timespinner}} scenarios - BorisMoore/jsviews#375 Bad version of remarkable.js in China - BorisMoore/jsrender#317 Defensive coding against corrupted jQuery cached template on element - Several minor bug fixes Minor breaking change: - Added "use strict" to all .js files. Can be breaking if files are concatenated. Unit tests: - Several additional unit tests
Feature improvements: - Important update for jQuery UI widget-based tag controls library, including: Improvements to {{datepicker}} tag control. See new documentation: - http://www.jsviews.com/#samples/tag-controls/jqui/datepicker/formats Improvements to {{spinner}} tag control. See new documentation: - http://www.jsviews.com/#samples/tag-controls/jqui/spinner/formats New {{timespinner}} control. See new documentation: - http://www.jsviews.com/#samples/tag-controls/jqui/timespinner Bug fixes: - #360 Datepicker data binding and formatting - #369 DataTable plugin scenario (cloned elements) - #373 Radio buttons binding to integers - #374 {{timespinner}} scenarios - BorisMoore/jsrender#317 Defensive coding against corrupted jQuery cached template on element - Several minor bug fixes Minor breaking change: - Added "use strict" to all .js files. Can be breaking if files are concatenated. Unit tests: - Several additional unit tests
Commit 85, just published, includes changes and improvements to {{datepicker}} and {{spinner}}, and a new {{timespinner}}, along with documentation. See in particular:
@trueqbit - let me know if your scenarios are covered by these changes. Thanks! |
Feature improvements: - Important update for jQuery UI widget-based tag controls library, including: Improvements to {{datepicker}} tag control. See new documentation: - http://www.jsviews.com/#samples/tag-controls/jqui/datepicker/formats Improvements to {{spinner}} tag control. See new documentation: - http://www.jsviews.com/#samples/tag-controls/jqui/spinner/formats New {{timespinner}} control. See new documentation: - http://www.jsviews.com/#samples/tag-controls/jqui/timespinner Bug fixes: - BorisMoore/jsviews#360 Datepicker data binding and formatting - BorisMoore/jsviews#369 DataTable plugin scenario (cloned elements) - BorisMoore/jsviews#373 Radio buttons binding to integers - BorisMoore/jsviews#374 {{timespinner}} scenarios - BorisMoore/jsviews#375 Bad version of remarkable.js in China - BorisMoore/jsrender#317 Defensive coding against corrupted jQuery cached template on element - Several minor bug fixes Minor breaking change: - Added "use strict" to all .js files. Can be breaking if files are concatenated. Unit tests: - Several additional unit tests
Feature improvements: - Important update for jQuery UI widget-based tag controls library, including: Improvements to {{datepicker}} tag control. See new documentation: - http://www.jsviews.com/#samples/tag-controls/jqui/datepicker/formats Improvements to {{spinner}} tag control. See new documentation: - http://www.jsviews.com/#samples/tag-controls/jqui/spinner/formats New {{timespinner}} control. See new documentation: - http://www.jsviews.com/#samples/tag-controls/jqui/timespinner Bug fixes: - BorisMoore/jsviews#360 Datepicker data binding and formatting - BorisMoore/jsviews#369 DataTable plugin scenario (cloned elements) - BorisMoore/jsviews#373 Radio buttons binding to integers - BorisMoore/jsviews#374 {{timespinner}} scenarios - BorisMoore/jsviews#375 Bad version of remarkable.js in China - BorisMoore/jsrender#317 Defensive coding against corrupted jQuery cached template on element - Several minor bug fixes Minor breaking change: - Added "use strict" to all .js files. Can be breaking if files are concatenated. Unit tests: - Several additional unit tests
Better late than never I want to let you know that the new datepicker control is working as expected (not to say great!) [using v0.9.90 Beta] |
when i try to update a property of type Date with a value of type string, nothing appens. this is due to this if:
if (!(property instanceof Date) || property > value || property < value) {
jsviews/jsviews.js
Line 3117 in bf667cb
if property is of type date, dirst check is false, then if value is string, property > value is false and property < value is also false, so the "set" operation is not performed at all. i understand that setting a date with a string (that by the way represents a date) is not correct, but i think something should be notified at least..
here a test-case: https://jsfiddle.net/zv3ebjqz/3/
The text was updated successfully, but these errors were encountered: