Hi, 

I manage to have it working, I have use this code from github: 

<div ng-controller="Umbraco.PropertyEditors.MemberPickerController" class="umb-editor umb-memberpicker">
    <ul class="unstyled list-icons"
        ng-model="renderModel">
        <li ng-repeat="node in renderModel">

            <i class="icon icon-navigation handle"></i>

            <a href="#" prevent-default ng-click="remove($index)" style="text-decoration:none;">
                <i class="icon icon-delete red hover-show"></i>
                <i class="{{node.icon}} hover-hide"></i>
                {{node.name}}
            </a>
        </li>
    </ul>

    <ul class="unstyled list-icons" ng-show="model.config.multiPicker === true || renderModel.length === 0">
        <li>
            <i class="icon icon-add blue"></i>
            <a href="#" ng-click="openMemberPicker()" prevent-default>
                <localize key="general_add">Add</localize>
            </a>
        </li>
    </ul>
</div>

And I have initialised the config like this: 

 $scope.model.config = {};
 $scope.model.config.alias = "recipientId";
 $scope.model.config.minNumber = 1;

Now I am trying to get the member id value. Do you guys have an idea how to do that ?

Thanks,

MrFlo

Can you share the controller code, you'll probably need to do this in a callback function of the open media picker dialog

Thanks for your quick reply :-)

Here is my controller: 
It's the send function where I need the member Id.  How can I use the callback from the Umbraco.PropertyEditors.MemberPickerController ?

function MessageCreateDialogController($scope, $routeParams, $route, $q, $timeout, $window, appState, memberResource, entityResource, navigationService, notificationsService, dialogService, angularHelper, serverValidationManager, contentEditingHelper, fileManager, formHelper, umbRequestHelper, umbModelMapper, $http, notificationsService) {

    //setup scope vars
    $scope.model = {}; 
    $scope.loaded = false;

    $scope.model.config = {};
    $scope.model.config.alias = "recipientId";
    $scope.model.config.minNumber = 1;

    function performGet(){
        var dialogOptions = $scope.$parent.dialogOptions;       
        var deferred = $q.defer();

        $scope.loaded = true;
        if (dialogOptions.message !== undefined)
            $scope.model = dialogOptions.message;
        return deferred.promise;
    }

    $scope.send = function (id, body, recipientId) {
        //alert('test:'+$scope.model.alias+' '+$scope.model);
        dialogService.closeAll();
        //Save & send
        var dataUrl = "Backoffice/MemberManager/MemberApi/PostMessage";
        var deferred = $q.defer();
        var data = {};
        data.Body = body;
        data.ParentId = id;
        data.RecipientId = recipientId;


        $http.post(dataUrl, data).success(function (data) {
            $scope.loaded = true;
            $scope.model = data;
            $route.reload();
            notificationsService.success("Success", "You message has been sent to the member");

            return deferred.resolve(data);
        })
        .error(function (data, status, headers, config) {
            notificationsService.error("error", "Youre message has NOT been sent to the member: " + data.ExceptionMessage);
        });
    }

    performGet();



}
angular.module("umbraco").controller("Messages.Dialogs.Message.CreateController", MessageCreateDialogController);

Haven't done it in the way enkelmedia describes it...

Why not simply use the memberpicker that's available on the dialogservice, http://umbraco.github.io/Belle/#/api/umbraco.services.dialogService

Then it should be similar to what I did here http://www.nibble.be/?p=453

there you can define the callback method and that should return an object representing the member

I have tried to do it with no luck. My callback is not triggered.

Is it ok to do like this in my view? 

            <div ng-controller="CustomMemberController">
                <ng-form>
                    <div ng-controller="Umbraco.PropertyEditors.MemberPickerController" ng-model="model.recipientId" class="umb-editor umb-memberpicker" ng-hide="model.AuthorName" style="margin: 38px 0px 0px 15px">
                        <ul class="unstyled list-icons"
                            ng-model="renderModel">
                            <li ng-repeat="node in renderModel">

                                <i class="icon icon-navigation handle"></i>

                                <a href="#" prevent-default ng-click="remove($index)" style="text-decoration:none;">
                                    <i class="icon icon-delete red hover-show"></i>
                                    <i class="{{node.icon}} hover-hide"></i>
                                    {{node.name}}
                                </a>
                            </li>
                        </ul>

                        <ul class="unstyled list-icons" ng-show="model.config.multiPicker === true || renderModel.length === 0">
                            <li>
                                <i class="icon icon-add blue"></i>
                                <a href="#" ng-click="openMemberPicker()" prevent-default>
                                    <localize key="general_add">Add</localize>
                                </a>
                            </li>
                        </ul>
                    </div>
                </ng-form>
            </div>

Here is my controllers: 

function MessageCreateDialogController($scope, $routeParams, $route, $q, $timeout, $window, appState, memberResource, entityResource, navigationService, notificationsService, dialogService, angularHelper, serverValidationManager, contentEditingHelper, fileManager, formHelper, umbRequestHelper, umbModelMapper, $http, notificationsService) {

    //setup scope vars
    $scope.model = {}; 
    $scope.loaded = false;

     function performGet(){
        var dialogOptions = $scope.$parent.dialogOptions;       
        var deferred = $q.defer();

        $scope.loaded = true;
        if (dialogOptions.message !== undefined)
            $scope.model = dialogOptions.message;
        return deferred.promise;
    }


    $scope.send = function (id, body, recipientId) {
        dialogService.closeAll();
        //Save & send
        var dataUrl = "Backoffice/MemberManager/MemberApi/PostMessage";
        var deferred = $q.defer();
        var data = {};
        data.Body = body;
        data.ParentId = id;
        data.RecipientId = recipientId;


        $http.post(dataUrl, data).success(function (data) {
            $scope.loaded = true;
            $scope.model = data;
            $route.reload();
            notificationsService.success("Success", "You message has been sent to the member");

            return deferred.resolve(data);
        })
        .error(function (data, status, headers, config) {
            notificationsService.error("error", "Youre message has NOT been sent to the member: " + data.ExceptionMessage);
        });
    }

    performGet();
}

function CustomMemberController($scope) {

    $scope.model = {
        alias: 'recipientId',
        config: {}
    }

    $scope.openMemberPicker = function () {
        dialogService.memberPicker({
            multiPicker: false,
            callback: populateMember
        });
    }

    function populateMember(item) {
        alert('yes'+item.id);
        $scope.recipientId = item.id;
    }
}

angular.module("umbraco").controller("Messages.Dialogs.Message.CreateController", MessageCreateDialogController);

I had the same problem. I looked into the Umbraco controller code (js/umbraco.controllers.js) and it turns out that the callback is never called. You can set it (and they even set a default callback) but it's not used.

The default callback adds the selected items to the model. That's not good to rely on in a replaceable callback. So my guess is that it was changed to add the items without referring to the callback (which is what happens when the dialog is submitted - almost identical to the default callback), but then they deleted the line calling the callback.

I ended up changing the Umbraco code on my install to include the callback if it's defined (but removing the default callback that is no longer needed.)

I'm doing this because I'm trying to reuse a bunch of properties set up in a document type. I'm pretty much defining my editor by defining a docType. Using properties I don't have to worry about getting it to look right as the css tends to be ok.

is working on a reply...