DropDownList Ajax Binding - Template

6 posts, 0 answers
  1. Rene
    Rene avatar
    65 posts
    Member since:
    Nov 2010

    Posted 12 Jan 2013 Link to this post

    Not matter what I try, I cannot get the template working when using ajax binding on a DropDownList() using Razor / MVC and EF.

    The dropdownlist is getting the data properly from the json endpoint (returning a generic list of ef objects via json) but it's the drop down template that is not being generated properly.  I get "undefined" for data values in each item's option.

    Have tried all kinds of things like:

    .Template( " Employee Name : ${ data.empname }")


    .Template( " Employee Name : ${ #=data.empname# }")


    .Template( " Employee Name : #=data.empname# ")

    and not matter what I try - i get

     "Employee Name:  undefined"

    for each item.

    Any help appreciated....
  2. Rene
    Rene avatar
    65 posts
    Member since:
    Nov 2010

    Posted 13 Jan 2013 Link to this post

    I've spent WAY too many hours to get this this to work 100% of the time.

    The documentation is poor - extremely poor where ASP.NET MVC, Entity Framework (database first) and anything related to templates.

    And half the time - I have to select an item from the drop down, only to have to select it a second time for the value to be set.

    I give up on this one.  Back to ddSlick to get a dropdown with images and html template.....
  3. UI for ASP.NET AJAX banner
  4. Georgi Krustev
    Georgi Krustev avatar
    3688 posts

    Posted 15 Jan 2013 Link to this post

    Hello Rene,

    The first and third version of the template text is correct. I prepared a simple test project, which shows how to define the Template. Please note that the used properties should exist in the model.

    Georgi Krustev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  5. Rene
    Rene avatar
    65 posts
    Member since:
    Nov 2010

    Posted 16 Jan 2013 Link to this post

    Thanks Georgi.  I'll give it a go in the morning.

    I was just at my wits end trying for about 18 hours trying to get it going.

    And believe me - I tried a ton of stuff.

    I'll get back to you tomorrow on this.



    ps. Kendo UI is a wicked library ( aka - AWESOME!).
  6. Rene
    Rene avatar
    65 posts
    Member since:
    Nov 2010

    Posted 16 Jan 2013 Link to this post

    Ah... couldn't wait.

    Not sure if the combobox applies to what I was having a problem with.  I was having problems with the DropDownList and using a template for the items in the drop down to show an image beside each dropdown items' text.  I could not get the template going at all.

    It has something to do with the EF model ( I am using DB first/edmx no T4 involved).

    Basically - create a table - create an EF model on just that table, and try to get a dropdownlist working with it...

    I'm now thinking that the json returned may be more nested than I assume... I'll have to run Fiddler on it (oh yeah - you guys own that fantastic tool also now :-)) (using localhost) to see exactly what's coming back through the pipe from the jsonresult back to the client ..

    Will get back to you ...

    Thanks again!
  7. Rene
    Rene avatar
    65 posts
    Member since:
    Nov 2010

    Posted 17 Jan 2013 Link to this post

    I have this working great now.  See below for details.

    I'll put my "p.s." at the top here:

    p.s. Kendo UI is nothing short of AWESOME.

    The view contains the following: (pretty well copied from your online documentation).

              .DataSource(source =>
                     source.Read(read =>
                          read.Action("GetSeriesTest", "Series");
              .Template("${ SERIES_NAME }<br/><img src='${SERIES_LOGO_IMAGE}' />")
              .HtmlAttributes( new { style = "width:400px;" } )

    This is the controller part:

       public JsonResult GetSeriesTest() {
         // using EF 4.x - Database First.  The model only has 1 table in it. 
         SeriesEntities dbSeries = new SeriesEntities();
         return Json( new { data = dbSeries.Series.ToList<Serie>() },JsonRequestBehavior.AllowGet );    

    JSON (from Fiddler) below:

    [{"SERIES_GUID":"69b1fa51-3e8a-4102-4e69-39beffab17fb","SERIES_ID":"SPRINT","SERIES_NAME":"Sprint Cup Series","SERIES_ACTIVE":true,"SERIES_LOGO_IMAGE":"/Images/series/nascar-sprint-series-logo.png","SERIES_WEBSITE":"http://www.nascar.com/series/cup/","EntityState":2,"EntityKey":{"EntitySetName":"Series","EntityContainerName":"SeriesEntities","EntityKeyValues":[{"Key":"SERIES_GUID","Value":"69b1fa51-3e8a-4102-4e69-39beffab17fb"}],"IsTemporary":false}},{"SERIES_GUID":"52a3cc91-4dd9-70ec-8bd4-39beffabed58","SERIES_ID":"NATIONWIDE","SERIES_NAME":"Nationwide","SERIES_ACTIVE":true,"SERIES_LOGO_IMAGE":"/Images/series/nascar-nationwide-series-logo.png","SERIES_WEBSITE":"http://www.nationwide.nascar.com/nationwide-series/","EntityState":2,"EntityKey":{"EntitySetName":"Series","EntityContainerName":"SeriesEntities","EntityKeyValues":[{"Key":"SERIES_GUID","Value":"52a3cc91-4dd9-70ec-8bd4-39beffabed58"}],"IsTemporary":false}},{"SERIES_GUID":"6f36a620-0a45-53d8-6604-39beffac2e39","SERIES_ID":"ARCA","SERIES_NAME":"ARCA","SERIES_ACTIVE":true,"SERIES_LOGO_IMAGE":"/Images/series/nascar-arca-series-logo.png","SERIES_WEBSITE":"http://www.arcaracing.com/","EntityState":2,"EntityKey":{"EntitySetName":"Series","EntityContainerName":"SeriesEntities","EntityKeyValues":[{"Key":"SERIES_GUID","Value":"6f36a620-0a45-53d8-6604-39beffac2e39"}],"IsTemporary":false}},{"SERIES_GUID":"a8a5f909-3358-0ceb-3f99-39beffac752d","SERIES_ID":"TRUCK","SERIES_NAME":"Camping World Truck Series","SERIES_ACTIVE":true,"SERIES_LOGO_IMAGE":"/Images/series/nascar-truck-series-logo.png","SERIES_WEBSITE":"http://www.nascar.com/series/truck/","EntityState":2,"EntityKey":{"EntitySetName":"Series","EntityContainerName":"SeriesEntities","EntityKeyValues":[{"Key":"SERIES_GUID","Value":"a8a5f909-3358-0ceb-3f99-39beffac752d"}],"IsTemporary":false}},{"SERIES_GUID":"eb41cc8e-5df1-61f9-7674-39bf08e084a9","SERIES_ID":"CANADIANTIRE","SERIES_NAME":"Canadian Tire Series","SERIES_ACTIVE":true,"SERIES_LOGO_IMAGE":"/Images/series/nascar-canadian-tire-series-logo.png","SERIES_WEBSITE":"http://www.nascarlocalracing.com/series/canadian_tire_series","EntityState":2,"EntityKey":{"EntitySetName":"Series","EntityContainerName":"SeriesEntities","EntityKeyValues":[{"Key":"SERIES_GUID","Value":"eb41cc8e-5df1-61f9-7674-39bf08e084a9"}],"IsTemporary":false}}]
Back to Top
UI for ASP.NET AJAX banner