dialogservicelinkpicker pass in exisitng data through dialogdata - Developing Umbraco 7 packages

Go to solution

Press Ctrl / CMD + C to copy this to your clipboard.

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
0

dialogService.linkPicker passing in exisitng data through dialogData?

Developing Umbraco 7 packages

Umbraco 7
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();
    };
```
Copy Link
Warren Buckley 2106 posts 4836 karma points MVP ∞ admin hq c-trib

Aug 25, 2015 @ 13:22
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
Copy Link

John Churchley 272 posts 1258 karma points c-trib

Aug 25, 2015 @ 13:52

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

Copy Link

Warren Buckley 2106 posts 4836 karma points MVP ∞ admin hq c-trib

Aug 25, 2015 @ 13:58

1

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

Copy Link

John Churchley 272 posts 1258 karma points c-trib

Aug 25, 2015 @ 14:03

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!

Copy Link

Warren Buckley 2106 posts 4836 karma points MVP ∞ admin hq c-trib

Aug 25, 2015 @ 14:15

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.

Copy Link
Warren Buckley 2106 posts 4836 karma points MVP ∞ admin hq c-trib

Aug 25, 2015 @ 14:01

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.

Copy Link
Warren Buckley 2106 posts 4836 karma points MVP ∞ admin hq c-trib

Aug 25, 2015 @ 14:13
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;
        }            
    });

};
```
Copy Link
is working on a reply...

Please Sign in or register to post replies

Flag this post as spam?

dialogService.linkPicker passing in exisitng data through dialogData?