Copied to clipboard

Flag this post as spam?

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


  • John Churchley 272 posts 1258 karma points c-trib
    Aug 25, 2015 @ 09:36
    John Churchley
    0

    dialogService.linkPicker passing in exisitng data through dialogData?

    Hi,

    I'm trying to build a property editor which uses the dialogService. It's working fine when you save the property but there is a requirement that links need to be edited?

    I've tried to use the dialog property as suggested here with no success :(

    http://www.proworks.com/blog/2014/02/27/how-to-pass-data-to-the-umbraco-7-dialogservice-on-open()/

     $scope.setLink = function () {
            dialogService.linkPicker({
            dialogData: {
                url: $scope.control.value.link.url
            },
                callback: function (data) {
                        $scope.control.value.link = data;
                    }            
            });
            dialogService.close();
        };
    
  • Warren Buckley 2106 posts 4836 karma points MVP 7x admin c-trib
    Aug 25, 2015 @ 13:22
    Warren Buckley
    1

    Hello John,
    Similar to this thread here

    https://our.umbraco.org/forum/developers/extending-umbraco/57033-DialogService-LinkPicker-Populate-Values

    The linkPicker specific dialog is expecting a different object passed inside dialogData

    The ProWorks blog post is using the main dialogService open call which allows you to call your own custom view for flexibility.

    Using the linkPicker from the service uses a set view & JS controller where the main data for binding against the view is different to the url property you are setting inside the dialogData object.

    This code is untested but from the sniffing of the source code I assume the snippet would need to be like so:

    $scope.setLink = function () {
    
        //Open the linkPicker dialog
        dialogService.linkPicker({
            dialogData: {
                //For this to work I think you only need the id inside currentTarget
                //But don't hardcode this grab vals & pass to this object
                currentTarget: {
                    id: '123',
                    name: 'My Link',
                    url: '/foo/bar'
                }
            },
            callback: function (data) {
    
                //Data is the same object as above in dialogData
                //Just with updated values on the object if they were changed
                $scope.control.value.link = data;
            }            
        });
    };
    

    Like I said I written this entirely in this forum post, so this is untested but this is what I believe you need to get going.

    Cheers,
    Warren

  • John Churchley 272 posts 1258 karma points c-trib
    Aug 25, 2015 @ 13:52
    John Churchley
    0

    Thanks Warren I was monitoring the other post also and attempting your solution. I still can't manage to get this to work as the links aren't internal hence no id.

     $scope.setLink = function () {
            dialogService.linkPicker({
                dialogData: {
                    currentTarget: {
                        id: null,
                        name: null,
                        url: $scope.control.value.link.url
                    }
                },
                callback: function (data) {
                        $scope.control.value.link = data;
                    }            
            });
            dialogService.closeAll();
        };
    

    John

  • Warren Buckley 2106 posts 4836 karma points MVP 7x admin c-trib
    Aug 25, 2015 @ 13:58
    Warren Buckley
    1

    Does the linkpicker dialog itself support external URLs or only internal picked nodes?

  • John Churchley 272 posts 1258 karma points c-trib
    Aug 25, 2015 @ 14:03
    John Churchley
    100

    Hi Warren! Got it working as the object which is required to pass the information is just the currentTarget

         $scope.setLink = function () {
            var link = {
                name: $scope.control.value.link.name,
                url:  $scope.control.value.link.url,
                target: $scope.control.value.link.target,
             // Check to see if it's media and remove id as it attempts resolve as content causing error
                id: $scope.control.value.link.isMedia ? null : $scope.control.value.link.id
            }
    
            dialogService.linkPicker({
                currentTarget: link,
                callback: function (data) {
                        $scope.control.value.link = data;
                    }            
            });
            dialogService.closeAll();
        };
    

    Thanks for your help and congratulations again on your lifetime MVP! You've been a big influence in building my confidence with Umbraco and your CWS start project was a great source of knowledge in my early days!

  • Warren Buckley 2106 posts 4836 karma points MVP 7x admin c-trib
    Aug 25, 2015 @ 14:15
    Warren Buckley
    0

    Ah beat me to it for figuring it out!

    Thank you, glad it has been so useful. It's very old & outdated now but glad it helped you early on to grasp the concepts.

  • Warren Buckley 2106 posts 4836 karma points MVP 7x admin c-trib
    Aug 25, 2015 @ 14:01
    Warren Buckley
    0

    In the callback function can you print out the value of the data object to the console.

    It would be interesting to see what is in this please.

  • Warren Buckley 2106 posts 4836 karma points MVP 7x admin c-trib
    Aug 25, 2015 @ 14:13
    Warren Buckley
    0

    OK further digging in the source code is an example with the TinyMCE RTE when clicking/editing a link.

    https://github.com/umbraco/Umbraco-CMS/blob/40c35e585152ec2a05d890790c6679ee46262cf5/src/Umbraco.Web.UI.Client/lib/tinymce/plugins/umbracolink/plugin.min.js#L180

    It seems name, url & target are the properties on the object of currentTarget you need to send in.

    However from the example I found it seems that its not part of dialogData either.

    $scope.setLink = function () {
        dialogService.linkPicker({
                currentTarget: {
                    name: 'My Link Title',
                    url: 'http://bbc.co.uk',
                    target: '_blank'
                }
            },
            callback: function (data) {
                console.log('Link', data);
                $scope.control.value.link = data;
            }            
        });
    
    };
    
Please Sign in or register to post replies

Write your reply to:

Draft