1. Home
  2. Forum
  3. ASP.NET MVC
  4. Rotator not showing with local data binding

Rotator not showing with local data binding

Hi, im trying to use Rotator to show some images, but cant make it work with local data binding following instructions in your site. But if I load images "manually" it works OK.

Code in my controller:

            List<ListaDeImagenes> listai = new List<ListaDeImagenes>();

            listai.Add(new ListaDeImagenes { Text = "uno", Url = "~/Imagenes/laimagen.jpg" });
            listai.Add(new ListaDeImagenes { Text = "dos", Url = "~/Imagenes/1203373717_f.jpg" });

           ViewBag.ListaImagenes = listai;
            Return View();

And in my View:

          @Html.EJ().Rotator("sliderContent").Datasource((IEnumerable<ListaDeImagenes>)ViewBag.ListaImagenes)
                                                                      .RotatorFields(t => t.Text("Text").Url("Url"))
                                                                      .SlideWidth("600px").SlideHeight("350px")
                                                                      .ShowPlayButton(true)

The code in the result html for the section of rotator is just this:

<ul Length="317" data-role="ejrotator" id="sliderContent"></ul>

I debugged it and I know the Viewbag has data.

But if instead I do it like this, it works:

@Html.EJ().Rotator("content").Items(x =>

    {

    x.Add().ContentTemplate(@<div><img class="image" src="@Url.Content("~/Imagenes/1203373717_f.jpg")" /></div>);

    x.Add().ContentTemplate(@<div><img class="image" src="@Url.Content("~/Imagenes/laimagen.jpg")" /></div>);

    })

Am I missing something?
Thank you!
 

3 Replies
BS Buvana Sathasivam Syncfusion Team November 29, 2017 09:36 AM UTC

Hi Pablo,   
  
Thanks for using Syncfusion Products.   
   
We were unable to reproduce the reported issue at our end.  We have render Rotator control using local data binding with images.  The Rotator images was loaded correctly.     
   
For your convenience, we have prepared a simple sample. Please find the below sample.      
   
If issue persist, please share your screenshot on the type of issue your facing or controller/view page or reproduce your issue on updated sample, so that we can check and provide appropriate solutions.    
   
Regards,   
Buvana S.   
 


PM Pablo Maloberti November 29, 2017 09:39 PM UTC

Hi Buvana, I found the problem is with UnobtrusiveJavaScriptEnabled set to true. It works when I set it to false. The problem is that I need it to be true because Im using unobtrusive AJAX, and it doesent work if it is false.
I had already worked it out with other controls by adding reference to ej.unobtrusive.min.js, as instructions here

My  Layout page is:

head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title - My ASP.NET Application</title>

    @Styles.Render("~/Content/css")
    @Styles.Render("~/Content/ej/flat-azure/ej.theme.css")
    @Styles.Render("~/Content/ej/ej.widgets.core.css")

    @Scripts.Render("~/bundles/modernizr")   
    @Scripts.Render("~/Scripts/jquery-3.1.1.min.js")
   
    @Scripts.Render("~/bundles/jquery")
 
    @Scripts.Render("~/bundles/bootstrap")
    @Scripts.Render("~/Scripts/jsrender.min.js")

    @Scripts.Render("~/Scripts/ej/ej.web.all.min.js") 
  
    @Scripts.Render("~/Scripts/ej/ej.unobtrusive.min.js")

    <script src="~/Scripts/ej/i18n/ej.culture.es-ES.min.js"></script>
    <script src="~/Scripts/ej/l10n/ej.localetexts.es-ES.min.js"></script>
         
</head>
<body>
.........

@RenderSection("scripts", required: false)
    @Html.EJ().ScriptManager()
   
</body>

Is there any way to make rotator work with UnobtrusiveJavaScriptEnabled = true

Thank you.




BS Buvana Sathasivam Syncfusion Team December 1, 2017 03:09 PM UTC

Hi Pablo,
Thanks for using Syncfusion Products. 
 
A support incident to track the status of this defect has been created under your account. Please log on to our support website to check for further updates   
 
 
Regards,  
Buvana S.  

 


Loader.
Up arrow icon