Copied to clipboard

Flag this post as spam?

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


  • Gayathri 12 posts 92 karma points
    7 days ago
    Gayathri
    0

    Custom Data Type returning array

    Hi All,

    i am trying to create a carousel as a Data Type, for that i am trying to create a custom Data Type like this from Developers Tab

    enter image description here

    in content section it will show like this

    enter image description here

    so am calling this new Datatype in Templates like this

    enter image description here

    but i am getting in browser the entire object like this

    enter image description here

    the response is like this is comming

    enter image description here

    any idea how i can call this in templates to show the carousel with the text and image .

    currently this is returning the @Umbraco.Field("car")

    whole object any suggestions please , i needs to display as a carousel :)

  • Alex Skrypnyk 3302 posts 10194 karma points mvp
    7 days ago
    Alex Skrypnyk
    0

    Hi Gayathri

    You have to parse JSON and render html of your carousel.

    Thanks,

    Alex

  • Gayathri 12 posts 92 karma points
    7 days ago
    Gayathri
    0

    hi Alex how can i do that in template ?

    am using the script like this

    <div class="internal-wrapper">
        @Html.Partial("MainMenu")
        <div class="page-header" style="background-image:url('@Model.Content.GetCropUrl("pageHeader", "PageBanner")');">
            <h1>@Umbraco.Field("pageName")</h1>
        </div>
        @Html.Partial("breadcrumbs")
        @RenderBody()
    </div>
    <div class="internal-wrapper">
      @Umbraco.Field("car")
    </div>
    

    from this @Umbraco.Field("car") its returning like that

  • Alex Skrypnyk 3302 posts 10194 karma points mvp
    7 days ago
    Alex Skrypnyk
    0

    You have to parse json, and render it as html

    Read more how to do it: http://www.newtonsoft.com/json/help/html/QueryJsonDynamic.htm

    Example:

    @using Newtonsoft.Json.Linq
    
    @{
        var jObject = JObject.Parse(Umbraco.AssignedContentItem.GetPropertyValue<string>("car"));
    
        @jObject.GetValue("editor")
    }
    
  • Gayathri 12 posts 92 karma points
    7 days ago
    Gayathri
    0

    hi @alex

    i know Parsing but i dont know the Syntax and how to use in Umbraco i am new to this CMS :(

    @inherits Umbraco.Web.Mvc.UmbracoTemplatePage
    @using Newtonsoft.Json.Linq
    @{
        Layout = "Master1.cshtml";
    }
    
    @{
        var jObject = JObject.Parse(Umbraco.AssignedContentItem.GetPropertyValue<string>("car"));
    
        @jObject.GetValue("editor")
    }
    
    <div class="internal-wrapper">
      @Umbraco.Field("car")
    </div>
    

    i am new to umbraco is it correct the way i did ? .

    but still its showing same like this

    enter image description here

    it will be really helpful for me sorry :)

  • Alex Skrypnyk 3302 posts 10194 karma points mvp
    7 days ago
    Alex Skrypnyk
    100

    It's not good quality of this screen. I can't see all output.

    how to use in Umbraco i am new to this CMS :( - now it's not Umbraco related issue, it's just issue with parsing JSON string to object in c#, here no Umbraco

    Thanks,

    Alex

  • Alex Skrypnyk 3302 posts 10194 karma points mvp
    4 days ago
    Alex Skrypnyk
    0

    Hi Gayathri

    Did you find a solution? Can you share?

    Alex

  • Gayathri 12 posts 92 karma points
    4 days ago
    Gayathri
    0

    hi All ,

    thank you for the reply , i fixed by parsing it JObject.Parse(promoListValue); as u mentioned :)

  • Alex Skrypnyk 3302 posts 10194 karma points mvp
    4 days ago
    Alex Skrypnyk
    0

    So is the topic solved?

  • Gayathri 12 posts 92 karma points
    4 days ago
    Gayathri
    0

    hi Alex,

    yeah :)

  • Alex Skrypnyk 3302 posts 10194 karma points mvp
    4 days ago
    Alex Skrypnyk
    0

    Great, have a nice day!

  • Manish 284 posts 651 karma points
    7 days ago
    Manish
    1

    I used the arctype for carousel and follow these steps:-

    1. Create a new data type lets say "Image Carousel" of type Arctype editor.
    2. and take the following fields in Arctype editor

    Carousel Image (carouselImage) - Media Picker

    Text Over Image (textOverImage) - Richtext editor

    Carousel Image Alt Text (carouselImageAltText) - Textstring

    1. It will look like something in CMS enter image description here

    enter image description here

    1. Now at the coding part

      @foreach (var item in carouselModel) { var carouselImage = item.GetValue("carouselImage"); var carouselImageAlttext = item.GetValue("carouselImageAlttext") != null ? item.GetValue("carouselImageAlttext").ToString() : string.Empty;

  • Manish 284 posts 651 karma points
    7 days ago
    Manish
    1
     <ul class="orbit-container c-carousel__container">
                            @foreach (var item in carouselModel)
                            {
                                var carouselImage = item.GetValue("carouselImage");
                                var carouselImageAlttext = item.GetValue("carouselImageAlttext") != null ? item.GetValue("carouselImageAlttext").ToString() : string.Empty;
                                <li class="@isActive orbit-slide c-carousel__slide">
                                    @if (carouselImage != null)
                                    {
                                        <img class="orbit-image c-carousel__image" src="@Umbraco.Media(carouselImage).Url.ToString()" alt="@carouselImageAlttext">
                                    }
    
                                    <figcaption class="orbit-caption c-carousel__caption">
                                        <div class="container">
                                            @Html.Raw(item.GetValue("textOverImage"))
                                        </div>
                                    </figcaption>
                                </li>
                            }
                        </ul>
    
  • Alex Skrypnyk 3302 posts 10194 karma points mvp
    7 days ago
    Alex Skrypnyk
    0

    Hi Manish,

    Nice tutorial how to use Archetype, I would recommend using Archetype also.

    Thanks,

    Alex

Please Sign in or register to post replies

Write your reply to:

Draft