yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fixes datepicker to sync the model value with it's view model correctly

Browse Source
This commit is contained in:
Shannon
2018-08-22 15:47:12 +10:00
parent 320fd82c24
commit 128c14d06f
8 changed files with 63 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/Umbraco.Web.UI.Client/lib/umbraco/Extensions.js
View File

@@ -329,10 +329,15 @@
/** Converts a string/integer/bool to true/false */
Object.toBoolean = function (obj) {
if (obj === undefined || obj === null) {
return false;
}
if ((typeof obj) === "boolean") {
return obj;
}
if (obj === "1" || obj === 1 || obj === "true") {
if (obj === "1" || obj === 1 || obj.toString().toLowerCase() === "true") {
return true;
}
return false;

4
src/Umbraco.Web.UI.Client/src/common/services/umbdataformatter.service.js
View File

@@ -316,10 +316,10 @@
// by looking at the key
switch (foundAlias[0]) {
case "umbracoMemberLockedOut":
saveModel.isLockedOut = prop.value ? (prop.value.toString() === "1" ? true : false) : false;
saveModel.isLockedOut = Object.toBoolean(prop.value);
break;
case "umbracoMemberApproved":
saveModel.isApproved = prop.value ? (prop.value.toString() === "1" ? true : false) : true;
saveModel.isApproved = Object.toBoolean(prop.value);
break;
case "umbracoMemberComments":
saveModel.comments = prop.value;

5
src/Umbraco.Web.UI.Client/src/views/prevalueeditors/boolean.controller.js
View File

@@ -4,8 +4,7 @@
function updateToggleValue() {
$scope.toggleValue = false;
if ($scope.model && $scope.model.value &&
($scope.model.value === true || $scope.model.value.toString() === "1" || $scope.model.value.toString().toLowerCase() === "true")) {
if ($scope.model && Object.toBoolean($scope.model.value)) {
$scope.toggleValue = true;
}
}
@@ -17,7 +16,7 @@
updateToggleValue();
$scope.toggle = function(){
if($scope.model.value === 1 || $scope.model.value === "1"){
if (Object.toBoolean($scope.model.value)) {
$scope.model.value = "0";
updateToggleValue();

4
src/Umbraco.Web.UI.Client/src/views/propertyeditors/boolean/boolean.controller.js
View File

@@ -5,11 +5,11 @@ function booleanEditorController($scope, $rootScope, assetsService) {
value: false
};
if ($scope.model.config && $scope.model.config.default && $scope.model.config.default.toString() === "1" && $scope.model && !$scope.model.value) {
if ($scope.model.config && $scope.model.config.default && Object.toBoolean($scope.model.config.default) && $scope.model && !$scope.model.value) {
$scope.renderModel.value = true;
}
if ($scope.model && $scope.model.value && ($scope.model.value.toString() === "1" || $scope.model.value.toString().toLowerCase() === "true")) {
if ($scope.model && $scope.model.value && Object.toBoolean($scope.model.value)) {
$scope.renderModel.value = true;
}
}

91
src/Umbraco.Web.UI.Client/src/views/propertyeditors/datepicker/datepicker.controller.js
View File

@@ -22,8 +22,6 @@ function dateTimePickerController($scope, notificationsService, assetsService, a
$scope.model.config.format = $scope.model.config.pickTime ? "YYYY-MM-DD HH:mm:ss" : "YYYY-MM-DD";
}
$scope.hasDatetimePickerValue = $scope.model.value ? true : false;
$scope.datetimePickerValue = null;
@@ -36,9 +34,8 @@ function dateTimePickerController($scope, notificationsService, assetsService, a
dtp.datetimepicker("hide");
}
};
$(document).bind("click", $scope.hidePicker);
//handles the date changing via the api
//handles the date changing via the date picker
function applyDate(e) {
angularHelper.safeApply($scope, function() {
// when a date is changed, update the model
@@ -68,7 +65,7 @@ function dateTimePickerController($scope, notificationsService, assetsService, a
var elementData = $element.find("div:first").data().DateTimePicker;
if ($scope.model.config.pickTime) {
//check if we are supposed to offset the time
if ($scope.model.value && $scope.model.config.offsetTime === "1" && Umbraco.Sys.ServerVariables.application.serverTimeOffset !== undefined) {
if ($scope.model.value && Object.toBoolean($scope.model.config.offsetTime) && Umbraco.Sys.ServerVariables.application.serverTimeOffset !== undefined) {
$scope.model.value = dateHelper.convertToServerStringTime(elementData.getDate(), Umbraco.Sys.ServerVariables.application.serverTimeOffset);
$scope.serverTime = dateHelper.convertToServerStringTime(elementData.getDate(), Umbraco.Sys.ServerVariables.application.serverTimeOffset, "YYYY-MM-DD HH:mm:ss Z");
}
@@ -85,7 +82,28 @@ function dateTimePickerController($scope, notificationsService, assetsService, a
}
}
var picker = null;
/** Sets the value of the date picker control adn associated viewModel objects based on the model value */
function setDatePickerVal(element) {
if ($scope.model.value) {
var dateVal;
//check if we are supposed to offset the time
if ($scope.model.value && Object.toBoolean($scope.model.config.offsetTime) && $scope.serverTimeNeedsOffsetting) {
//get the local time offset from the server
dateVal = dateHelper.convertToLocalMomentTime($scope.model.value, Umbraco.Sys.ServerVariables.application.serverTimeOffset);
$scope.serverTime = dateHelper.convertToServerStringTime(dateVal, Umbraco.Sys.ServerVariables.application.serverTimeOffset, "YYYY-MM-DD HH:mm:ss Z");
}
else {
//create a normal moment , no offset required
var dateVal = $scope.model.value ? moment($scope.model.value, "YYYY-MM-DD HH:mm:ss") : moment();
}
element.datetimepicker("setValue", dateVal);
$scope.datetimePickerValue = dateVal.format($scope.model.config.format);
}
else {
$scope.clearDate();
}
}
$scope.clearDate = function() {
$scope.hasDatetimePickerValue = false;
@@ -129,7 +147,7 @@ function dateTimePickerController($scope, notificationsService, assetsService, a
var element = $element.find("div:first");
// Open the datepicker and add a changeDate eventlistener
// Create the datepicker and add a changeDate eventlistener
element
.datetimepicker(angular.extend({ useCurrent: true }, $scope.model.config))
.on("dp.change", applyDate)
@@ -138,58 +156,39 @@ function dateTimePickerController($scope, notificationsService, assetsService, a
$scope.datePickerForm.datepicker.$setValidity("pickerError", false);
});
if ($scope.hasDatetimePickerValue) {
var dateVal;
//check if we are supposed to offset the time
if ($scope.model.value && $scope.model.config.offsetTime === "1" && $scope.serverTimeNeedsOffsetting) {
//get the local time offset from the server
dateVal = dateHelper.convertToLocalMomentTime($scope.model.value, Umbraco.Sys.ServerVariables.application.serverTimeOffset);
$scope.serverTime = dateHelper.convertToServerStringTime(dateVal, Umbraco.Sys.ServerVariables.application.serverTimeOffset, "YYYY-MM-DD HH:mm:ss Z");
}
else {
//create a normal moment , no offset required
var dateVal = $scope.model.value ? moment($scope.model.value, "YYYY-MM-DD HH:mm:ss") : moment();
}
element.datetimepicker("setValue", dateVal);
$scope.datetimePickerValue = dateVal.format($scope.model.config.format);
}
$(document).bind("click", $scope.hidePicker);
setDatePickerVal(element);
element.find("input").bind("blur", function() {
//we need to force an apply here
$scope.$apply();
});
});
$scope.$watch("model.value", function(newVal, oldVal) {
if (newVal !== oldVal) {
$scope.hasDatetimePickerValue = newVal ? true : false;
setDatePickerVal(element);
}
});
var unsubscribe = $scope.$on("formSubmitting", function (ev, args) {
setModelValue();
});
//Ensure to remove the event handler when this instance is destroyted
$scope.$on('$destroy', function () {
element.find("input").unbind("blur");
element.datetimepicker("destroy");
element.datetimepicker("destroy");
unsubscribe();
$(document).unbind("click", $scope.hidePicker);
});
var unsubscribe = $scope.$on("formSubmitting", function (ev, args) {
setModelValue();
});
//unbind doc click event!
$scope.$on('$destroy', function () {
unsubscribe();
});
});
});
});
var unsubscribe = $scope.$on("formSubmitting", function (ev, args) {
setModelValue();
});
//unbind doc click event!
$scope.$on('$destroy', function () {
$(document).unbind("click", $scope.hidePicker);
unsubscribe();
});
}
angular.module("umbraco").controller("Umbraco.PropertyEditors.DatepickerController", dateTimePickerController);

1
src/Umbraco.Web.UI.Client/src/views/propertyeditors/datepicker/datepicker.html
View File

@@ -1,4 +1,5 @@
<div class="umb-property-editor umb-datepicker" ng-controller="Umbraco.PropertyEditors.DatepickerController">
<ng-form name="datePickerForm">
<div class="input-append date datepicker" style="position: relative;" id="datepicker{{model.alias}}">

4
src/Umbraco.Web.UI.Client/src/views/propertyeditors/entitypicker/entitypicker.controller.js
View File

@@ -32,11 +32,11 @@ function entityPicker($scope, entityResource) {
}
else {
//if it's multiple, change the value to an array
if ($scope.model.config.multiple === "1") {
if (Object.toBoolean($scope.model.config.multiple)) {
if (_.isString($scope.model.value)) {
$scope.model.value = $scope.model.value.split(',');
}
}
}
}
angular.module('umbraco').controller("Umbraco.PropertyEditors.EntityPickerController", entityPicker);
angular.module('umbraco').controller("Umbraco.PropertyEditors.EntityPickerController", entityPicker);

6
src/Umbraco.Web.UI.Client/src/views/propertyeditors/slider/slider.controller.js
View File

@@ -12,7 +12,7 @@
$scope.model.config.enableRange = false;
}
else {
$scope.model.config.enableRange = $scope.model.config.enableRange === true || ($scope.model.config.enableRange === "1" ? true : false);
$scope.model.config.enableRange = Object.toBoolean($scope.model.config.enableRange);
}
if (!$scope.model.config.initVal1) {
@@ -54,7 +54,7 @@
$scope.model.config.reversed = false;
}
else {
$scope.model.config.reversed = $scope.model.config.reversed === true || ($scope.model.config.reversed === "1" ? true : false);
$scope.model.config.reversed = Object.toBoolean($scope.model.config.reversed);
}
if (!$scope.model.config.tooltip) {
@@ -65,7 +65,7 @@
$scope.model.config.tooltipSplit = false;
}
else {
$scope.model.config.tooltipSplit = $scope.model.config.tooltipSplit === true || ($scope.model.config.tooltipSplit === "1" ? true : false);
$scope.model.config.tooltipSplit = Object.toBoolean($scope.model.config.tooltipSplit);
}
if ($scope.model.config.tooltipFormat) {