Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Arunabha Das 38 posts 151 karma points
    Jun 18, 2014 @ 16:19
    Arunabha Das
    0

    Not getting macro params in macro partial view from custom macro parameter datatype

    I'm using umbraco 7 and had created custom macro property editor with angular js. But when I select a particular item using the editor, its calling the api but "&macroParams[0].value" is coming empty.

    http://localhost/umbraco/backoffice/UmbracoApi/Macro/GetMacroResultAsHtmlForEditor?macroAlias=TestCustomMultiList&pageId=1126&macroParams[0].key=ArunabhMultiContentPicker&macroParams[0].value=

    How to pass selected item to &macroParams[0].value ?

     

     

  • Jan Skovgaard 11280 posts 23678 karma points MVP 10x admin c-trib
    Jun 20, 2014 @ 17:52
    Jan Skovgaard
    0

    Hi Arunabha

    Not sure I have the solution to your issue but do you mind sharing your code, which may make it easier for others to provide some useful feedback perhaps? :)

    Cheers, Jan

  • Arunabha Das 38 posts 151 karma points
    Jun 25, 2014 @ 16:18
    Arunabha Das
    100

    Package.manifest

    { propertyEditors: [ { alias: "ArunabhMultiContentPicker", name: "Custom Multi Content Picker", isParameterEditor: true, editor: { view: "~/AppPlugins/MultiContentPicker/MultiContentPicker.html" },
    } ],
    javascript: [ "~/App
    Plugins/MultiContentPicker/MultiContentPicker.controller.js"

    ]
    

    }

    Controller

    angular.module("umbraco").controller("Umbraco.ArunabhMultiContentPickerController", function ($scope, entityResource, macroResource, eventsService, $log, searchService, macroService, umbRequestHelper, $http, $routeParams, tinyMceService, editorState, dialogService) {

        var dialogOptions = $scope.$parent.dialogOptions;
        $scope.dialogTreeEventHandler = $({});
        $scope.section = 'content';
        $scope.treeAlias = 'content';
        $scope.multiPicker = true;
        $scope.hideHeader = false;
        $scope.startNodeId = -1;
        $scope.selectedMacro = 'TestCustomMultiList';
    
        //create the custom query string param for this tree
        $scope.customTreeParams = -1;
        $scope.customTreeParams += $scope.customTreeParams ? "&" + $scope.customTreeParams : "";
    
        //search defaults
        $scope.searcher = searchService.searchContent;
        $scope.entityType = "Document";
        $scope.results = [];
        $scope.dialogData = [];
        $scope.macroParams = [];
    
        $('.umb-panel-footer').hide();
        if ($('.umb-panel-footer').hasClass('custom-multi-content-list')) {
            $('.custom-multi-content-list').show();
        }
    
        /** Method used for selecting a node */
        function select(text, id, entity) {
    
            //if we get the root, we just return a constructed entity, no need for server data
            if (id < 0) {
                if ($scope.multiPicker) {
    
                    $scope.select(id);
                }
            } else {
                $scope.showSearch = false;
                $scope.results = [];
                $scope.term = "";
                $scope.oldTerm = undefined;
    
                if ($scope.multiPicker) {
    
                    if ($scope.dialogData.indexOf(id) == -1) {
                        $scope.dialogData.push(id);
    
                    }
                }
            }
        }
    
        function remove(text, id) {
            var index = $scope.dialogData.indexOf(id);
    
            if (index > -1) {
                $scope.dialogData.splice(index, 1);
            }
        }
    
    
        $scope.multiSubmit = function (result) {
    
    
        };
    
        $scope.close = function () {
            eventsService.emit("app.closeDialogs");
    
        };
    
        /** method to select a search result */
        $scope.selectResult = function (result) {
            //since result = an entity, we'll pass it in so we don't have to go back to the server
            select(result.name, result.id, result);
        };
    
        var dialogDatas = {
            //flag for use in rte so we only show macros flagged for the editor
            richTextEditor: true
        };
    
    
        $scope.performSearch = function () {
            if ($scope.term) {
                if ($scope.oldTerm !== $scope.term) {
                    $scope.results = [];
    
                    $scope.searcher({ term: $scope.term }).then(function (data) {
                        $scope.results = data;
                    });
    
                    $scope.showSearch = true;
                    $scope.oldTerm = $scope.term;
                }
            }
            else {
                $scope.oldTerm = "";
                $scope.showSearch = false;
                $scope.results = [];
            }
        };
    
        //wires up selection
        $scope.dialogTreeEventHandler.bind("treeNodeSelect", function (ev, args) {
            args.event.preventDefault();
            args.event.stopPropagation();
    
            eventsService.emit("dialogs.treePickerController.select", args);
    
            if (args.node.filtered) {
                return;
            }
    
            //This is a tree node, so we don't have an entity to pass in, it will need to be looked up
            //from the server in this method.
            select(args.node.name, args.node.id);
    
            //ui...
            if ($scope.multiPicker) {
                var c = $(args.event.target.parentElement);
                if (!args.node.selected) {
                    args.node.selected = true;
                    var temp = "<i class='icon umb-tree-icon sprTree icon-check blue temporary'></i>";
                    var icon = c.find("i.umb-tree-icon");
                    if (icon.length > 0) {
                        icon.hide().after(temp);
                    }
                    else {
                        c.prepend(temp);
                    }
                }
                else {
                    remove(args.node.name, args.node.id);
                    args.node.selected = false;
                    c.find(".temporary").remove();
                    c.find("i.umb-tree-icon").show();
                }
            }
        });
    });
    
  • Arunabha Das 38 posts 151 karma points
    Jun 25, 2014 @ 16:19
    Arunabha Das
    0

    view

    <div class="umb-panel" ng-controller="Umbraco.ArunabhMultiContentPickerController">
    <div class="umb-panel-header" ng-hide="startNodeId > -1">
        <div class="umb-el-wrap umb-panel-buttons">
            <div class="form-search">
                <i class="icon-search"></i>
                <input type="text"
                    ng-model="term"
                    class="umb-search-field search-query"
                    placeholder="Search..."
                    on-keyup="performSearch()">
            </div>
        </div>
    </div>
    <div class="umb-panel-body with-footer" ng-class="{'no-header':startNodeId > -1}">
        <div class="tab-content umb-control-group">
    
            <!-- Search results -->
            <div ng-show="showSearch">
                <ul class="umb-tree">
                    <li class="root">
                        <ul class="umb-search-group">
                            <li ng-repeat="result in results">
                                <div style="padding-left: 20px">
                                    <a ng-class="{first:$first}" ng-click="selectResult(result)">
                                        <i class="icon umb-tree-icon sprTree {{result.icon}}"></i>
                                        {{result.name}}
                                        <small class="search-subtitle" ng-show="result.subTitle">{{result.subTitle}}</small>
                                    </a>
                                </div>
                            </li>
                        </ul>
                    </li>
                </ul>
            </div>
    
            <div ng-hide="showSearch">
                <umb-tree
                    section="{{section}}"
                    treealias="{{treeAlias}}"
                    hideheader="{{hideHeader}}"
                    hideoptions="true"
                    isdialog="true"
                    customtreeparams="{{customTreeParams}}"
                    eventhandler="dialogTreeEventHandler">
                </umb-tree>
            </div>
        </div>
    </div>
    
    <div class="umb-panel-footer custom-multi-content-list">
        <div class="umb-el-wrap umb-panel-buttons">
            <div class="btn-toolbar umb-btn-toolbar pull-right">
    
                <a href ng-click="close()" class="btn btn-link">
                    <localize key="general_cancel">Cancel</localize>
                </a>
    
                <button
                    class="btn btn-primary"
                    ng-show="multiPicker"
                    ng-click="multiSubmit(dialogData)">
                    <localize key="buttons_select">Select</localize>
                    ({{dialogData.length}})
                </button>
    
            </div>
        </div>
    </div>
    

Please Sign in or register to post replies

Write your reply to:

Draft