Hardik Gondalia
Hardik Gondalia

Reputation: 3717

How to get multi media picker in Jquery in Umbraco

Here is my script which load image slider from Jquery

<script type="text/javascript">
        $(window).load(function () {

            @{
                var galleryList = Model.Content.GetPropertyValue<string>("images").Split(new string[] { "," }, StringSplitOptions.RemoveEmptyEntries).Select(int.Parse);
                var galleryCollection = Umbraco.TypedMedia(galleryList).Where(x => x != null).ToString();
            }

            var i = 0;
            var images = @galleryCollection;
            //var images = ['/Images/Image1.jpg', '/Images/Image2.jpg', '/Images/Image3.jpg', '/Images/Image4.jpg'];
            var image = $('#slideit');
            //Initial Background image setup
            image.css('background-image', 'url(/Images/image1.jpg)');
            //Change image at regular intervals
            setInterval(function () {
                image.fadeOut(0, function () {
                    image.css('background-image', 'url(' + images[i++] + ')');
                    image.fadeIn(0);
                });
                if (i == images.length)
                    i = 0;
            }, 5000);
        });
    </script>

Which returns me error : Unterminated template literal

var images = System.Linq.Enumerable+WhereEnumerableIterator`1[Umbraco.Core.Models.IPublishedContent];

I know this is wrong way to get images from umbraco in jquery. but I don't know alternative way.

Upvotes: 1

Views: 145

Answers (1)

Davor Zlotrg
Davor Zlotrg

Reputation: 6050

It should be something like this:

@using System.Web.Script.Serialization

<script type="text/javascript">
    $(window).load(function () {

        @{
            var galleryList = Model.Content
                                   .GetPropertyValue<string>("images")
                                   .Split(new string[] { "," }, StringSplitOptions.RemoveEmptyEntries)
                                   .Select(id => int.Parse(id));

            var galleryCollection = Umbraco.TypedMedia(galleryList)
                                           .Select(m => m.Url);
        }

        var i = 0;
        var images = @(Html.Raw(new JavaScriptSerializer().Serialize(galleryCollection)));

        ... //the rest of your code
    });
</script>

Upvotes: 1

Related Questions