I'm creating a custom property editor that opens a dialog using the editorService, in the dialog html the user can enter text in an input, click a button and an ajax request is made. The results are displayed in the dialog using ng-repeat. The user can select an item and that item is assigned to $scope.model.value. All that works fine.
The problem is, in my editor html i'm using {{ model.value }} because i want to update the visual appearance of the editor but {{ model.value }} is always null, to be exact it doesn't update once the dialog is closed. It only displays something if i assign a value to $scope.model.value in the angular ctor does it show anything.
Did you mean to say that the model doesn't update until the dialog is closed, as in, that's when the model is updated? If so, I think that's the intenteded behavior.
As far as I know, you shouldn't be forced to instasiate $scope.model.value before using it.
Could you show your controller? Or at the very least, some selected snippet from it. That way it might be easier to help you out!
model.value doesn't update at. Well, it will only update if i set a value in the controller.
the editor html. there is another html file for the dialog, i've not included it as all it does is call $scope.selectItem.
<div ng-controller="MyDemoEditorController as vm">
<!-- this is always empty unless i set it in the ctor of the controller -->
<p>{{model.value}}</p>
<a id="wmd-button-{{model.alias}}" class="btn btn-default" ng-click="openDialog(model)">Search</a>
here is the ctor - its just a demo to get it working. $scope.submit is where i'm assigning a value to $scope.model.value. I can output that value to the console, but the value is not visible in the editor html
(function () {
'use strict';
function MyDemoEditorController($scope, editorService) {
var vm = this;
$scope.submit = function () {
console.log("dialog submit");
editorService.close();
if (vm.selectedItem !== null) {
$scope.model.value = $scope.selectedItem;
// just looking
console.log(JSON.stringify($scope.model.value));
}
};
$scope.closeDialog = function () {
console.log("close dialog");
editorService.close();
};
$scope.selectItem = function (item) {
console.log("selected " + item.id);
// maybe angular directives?
$('#search-results > div').removeClass('alert-success');
$('#item_' + item.id).addClass("alert-success");
$scope.selectedItem = item;
};
$scope.search = function (model) {
var queryText = $scope.model.queryText;
console.log("searching for..." + queryText);
if (queryText === '' || queryText === undefined || queryText === null) {
// don't do anything
alert("enter some text");
return;
}
// sample data
var sampleData = [];
sampleData.push({ "id": 1, "name": "first" });
sampleData.push({ "id": 2, "name": "second" });
sampleData.push({ "id": 3, "name": "third" });
$scope.items = sampleData;
};
$scope.openDialog = function (model) {
var editorOptions = {
title: 'Search',
view: '/App_Plugins/MyDemoEditor/mydemoeditordialog.html',
size: 'small'
};
editorService.open(editorOptions);
};
}
angular.module('umbraco').controller('MyDemoEditorController', MyDemoEditorController);
Problems with a custom property editor
Hi
v8
I'm creating a custom property editor that opens a dialog using the editorService, in the dialog html the user can enter text in an input, click a button and an ajax request is made. The results are displayed in the dialog using ng-repeat. The user can select an item and that item is assigned to $scope.model.value. All that works fine.
The problem is, in my editor html i'm using {{ model.value }} because i want to update the visual appearance of the editor but {{ model.value }} is always null, to be exact it doesn't update once the dialog is closed. It only displays something if i assign a value to $scope.model.value in the angular ctor does it show anything.
Any ideas?
Thanks
Did you mean to say that the model doesn't update until the dialog is closed, as in, that's when the model is updated? If so, I think that's the intenteded behavior.
As far as I know, you shouldn't be forced to instasiate $scope.model.value before using it.
Could you show your controller? Or at the very least, some selected snippet from it. That way it might be easier to help you out!
// M
model.value doesn't update at. Well, it will only update if i set a value in the controller.
the editor html. there is another html file for the dialog, i've not included it as all it does is call $scope.selectItem.
here is the ctor - its just a demo to get it working. $scope.submit is where i'm assigning a value to $scope.model.value. I can output that value to the console, but the value is not visible in the editor html
})();
Thanks Sean
is working on a reply...