This is a migrated thread and some comments may be shown as answers.

Prevent panelbar from creating duplicate items

7 Answers 168 Views
PanelBar
This is a migrated thread and some comments may be shown as answers.
Sumith Jayasuriya
Top achievements
Rank 1
Sumith Jayasuriya asked on 11 Dec 2012, 07:26 PM
Quite new to MVC and kendo and was wondering if there was a way to prevent panelbar from creating duplicate items and whats the best method to achieve this.

Here is my panelbar markup:
@(Html.Kendo()
                  .PanelBar()
                  .Name("panelbar")
                  .HtmlAttributes(new { style = "width:200px" })
                  .ExpandAll(true)
                  .BindTo(Model, (Kendo.Mvc.UI.Fluent.NavigationBindingFactory<PanelBarItem> mappings) =>
                  {
                      mappings.For<QueryModel>(binding =>
                      {
                          binding.ItemDataBound((panelitem, modelitem) =>
                              {
                                  panelitem.Text = modelitem.category;
                              });
 
                      });
                  })
                   
             )

Here is my class markup for the model:
public class QueryModel
    {
        public string category { get; set; }
        public string controlID { get; set; }
        public string controlType { get; set; }
        public System.Nullable<int> multiplier { get; set; }
        public string caption { get; set; }
        public string dropdownSQL { get; set; }
        public string columnSQL { get; set; }
        public string sortorder { get; set; }
        public string tooltip { get; set; }
    }

And here is my controller action:
public ActionResult Query()
        {
            QueryModel querydata = new QueryModel();
 
            var results = from s in dbContext.T223_Searches
                          join sd in dbContext.T224_SearchDetails on s.KeySearch equals sd.KeySearch
                          join sc in dbContext.T225_SearchCategories on sd.KeyCategory equals sc.KeyCategory
                          where sd.KeySearch == 3
                          orderby sd.SortOrder
                          select new QueryModel
                          {
                              category = sc.Description,
                              controlID = sd.ControlID,
                              controlType = sd.ControlType,
                              multiplier = sd.Multiplier,
                              caption = sd.Caption,
                              dropdownSQL = sd.DDLSQL,
                              columnSQL = sd.SQLColumn,
                              tooltip = sd.ToolTip
                          };
 
            return View("Query", results.ToList());
        }

Is there anyway in the controller action or actual panelbar markup to select DISTINCT category?  My model returns multiple rows which could have different or the same category.  Or is there a way I can check if the item with certain text exists already and not create it?

Also am I going about this the wrong way and do I need to have a separate model just for categories?

7 Answers, 1 is accepted

Sort by
0
Petur Subev
Telerik team
answered on 13 Dec 2012, 01:38 PM
Hello Sumith,

PanelBar item is created for each of the items in the collection passed to the BindTo method (the Model in your case). You should remove the duplicate entries before passing the collection to the BindTo method. 
You can use the District Extensions method LINQ provides.
e.g.

return View("Query", results.Distict(yourComparator).ToList());

where yourComparator is implementing the IEqualityComparer<YourModel> interface.

Here is similar question on the stackoverflow site:

http://stackoverflow.com/questions/8560884/how-to-implement-iequalitycomparer-to-return-distinct-values

Kind Regards,
Petur Subev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Sumith Jayasuriya
Top achievements
Rank 1
answered on 13 Dec 2012, 03:52 PM
Forgive me if I misunderstood, but in the answer you provided the model would remove rows based on my Distinct compareer correct?  I guess maybe I wasn't too clear.  The data in my model would have the columns I listed below in my controller.  I'm trying to use the same model in my view to build a panelbar which needs lists DISTINCT categories from this model.  I was wondering if there was a way to get Distinct category in my view to use to make the panelbar, possibly in the BindTo method?

For example my model data would look like:

Geography State ...
Geography City ...
Demography Income...
Demography Household...

I would need to somehow get the Distinct category (geography, demography) to use in my view to build my panelbar.

If you answer below provides the solution could you please write a small example as I am new to MVC and kendo and I may have misunderstood.  Also maybe I am going about this the incorrect way and so I would like to know the best practice to achieve something like this.

Thank you for your help


0
Accepted
Petur Subev
Telerik team
answered on 17 Dec 2012, 12:41 PM
Hello Sumith,

If I understand you correctly you want to bind the PanelBar to the district elements in the Model collection.

As I replied in my previous post you can use the Distict Method. Check the attached project which uses all the items to populate the Grid and only the Distict records for the PanelBar.

Kind regards,
Petur Subev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Sumith Jayasuriya
Top achievements
Rank 1
answered on 18 Dec 2012, 03:34 PM
Thank you for your help Petur, i got the required functionality working.  Now I have a different question.  I want to create a div element for each of these panel items, and when I had the panelbar hardcoded I just used to .Content property with my html elements in there, but now I get various errors when trying to set the .Content property for each panel item.

Here is my markup below:
@(Html.Kendo()
                  .PanelBar()
                  .Name("panelbar")
                  .HtmlAttributes(new { style = "width:200px" })
                  .ExpandAll(true)
                  .BindTo(Model.Distinct(new CategoryComparator()), (panelitem, modelitem) =>
                  {
                      panelitem.Text = modelitem.category;
                      panelitem.Content = () =>
                          {
                              @<div id="modelitem.category"></div>
                          };
                  })
             )


It seems like I am getting a syntax error most of the time, but my VS is not showing any errors, and I only get these issues when debugging.  I've tried variations in the syntax but haven't been able to get it to work.

Any help is much appreciated.  Thanks again.

Edit:  Also have a seperate issue with kendo dropdownlist and comboboxes where the actual drop down list that slides down is scrolling with the screen.  Please let me know if I should start a different topic for this.
0
Petur Subev
Telerik team
answered on 20 Dec 2012, 08:27 AM
Hello Sumith,

You should use the following approach to render the Content of the PanelBarItem when binding in Razor View:

@{ Html.Kendo().PanelBar()
           .Name("panelbar")
           .BindTo(Model, (PanelBarItem item, Kendo.Mvc.Examples.Models.Category cat) =>
             {
                 item.Text = cat.Description;
                 item.Content = () => Html.ViewContext.Writer.Write(cat.Description);
             })
           .Render();
           }


Regards,
Petur Subev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Alejandro
Top achievements
Rank 1
answered on 30 Apr 2014, 07:32 PM
Ok Petur,

But... if I need to render a Partial View? 

Basically I should write the panelItems dynamically using the BindTo method and their content is a partial view with its model. 

How do I do that?

I'm using...

@(Html.Kendo().PanelBar()
                                          .Name("panelbar")
                                            .BindTo((List<FicheroMedico.Models.LugarVisita>)Model.LugaresVisitas2, (Kendo.Mvc.UI.Fluent.NavigationBindingFactory<PanelBarItem> mappings) =>
                                                {
                                                    mappings.For<FicheroMedico.Models.LugarVisita>(binding => binding.ItemDataBound((visita, domi) =>
                                                        {
                                                            visita.Text = domi.Domicilio;
                                                            visita.Content = () => Html.Partial("Address", domi.Address); //Address it's a partial view
                                                        })
                                                        );
                                         })
)

Happens is that instead of the partial view, the main view is written within each panelbaritem

Thanks!

Alejandro.
0
Petur Subev
Telerik team
answered on 02 May 2014, 07:56 AM
Hello Sumith,


Again you should use the same technique. 

I tried the following (which is using dynamic in contrast to your case, so you do not have to actually cast the dynamic expreesion) and it is working fine.

@{Html.Kendo().PanelBar()
        .Name("fff")
        .BindTo((new[] { new { partial = "somePartial", text = "foo" }, new { partial = "someOther", text = "bar" } }), (Kendo.Mvc.UI.Fluent.NavigationBindingFactory<PanelBarItem> mappings) =>
            {
                mappings.For<dynamic>(binding => binding.ItemDataBound((pbitem, dyn) =>
                    {
                        pbitem.Text = dyn.text;
                        pbitem.Content = () => { Html.Partial((string)dyn.partial); }; //Address it's a partial view
                    })
                    );
            }).Render();
 }


Kind Regards,
Petur Subev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
PanelBar
Asked by
Sumith Jayasuriya
Top achievements
Rank 1
Answers by
Petur Subev
Telerik team
Sumith Jayasuriya
Top achievements
Rank 1
Alejandro
Top achievements
Rank 1
Share this question
or