Telerik Forums
UI for ASP.NET MVC Forum
2 answers
222 views

Short version:

In a line series chart I have tooltips. These show all the time when the mouse is nowhere near an actual point on the chart. Seems no matter where my mouse is on a like I will see the tooltip for the point that is closest to my mouse. I want to be required to actually hover over the real data point on the chart to get the tooltip, not the line itself.

 

Longer version:

Open to suggestions if there is a better way. In the attached photo, you can see a chart that shows my customer gains and losses for a given period. The period is filterable. The "Maximize" button in the upper right doubles the chart width, and uses JavaScript to recalculate the step if needed (i.e. if there are too many data points to see all at once) and redraws the chart. When the user hovers over a data metric, they see a customized tooltip that lets them investigate the data that created the chart. This is a new Kendo window that pops up and contains a Kendo grid. The grid contains the exact number of customers in the metric they clicked on.

The ultimate problem is that while trying to navigate my mouse to the "Customer List" link I end up getting a new tooltip before I get there. It's too tough to use. So I want to only show a tooltip when actually hovering over the data point circle. If there's a better way I would listen to suggestions.

Paul
Top achievements
Rank 1
 answered on 19 Feb 2018
1 answer
419 views

I've seen several somewhat related threads, but none have helped me. When I click edit and then cancel, the item is removed from the grid (not the database). What is different about this scenario is I am using a composite key EventId + NameId + LocationId where each record will have either a NameId or a LocationId, but not both.

When I step through the code, my popup is displayed and bound as expected. When I click the cancel button it removes my edited item from the grid. I've tried jumping into the datasource change and sync events and doing an e.preventDefault() when I know this is the cancel of an edit, but that does not work (record disappears after that). Is there any spot I can jump in and intercept the removal of the item? Or is there something special I need to configure when using a composite key where one part will be null or zero? I get it that kendo must be thinking I am cancelling an insert instead of an update and it is probably related to my composite key use. My other grids work fine. Thanks.

 

            @(Html.Kendo().Grid<ContactViewModel>().Name("contactGrid")
                  .Columns(column =>
                  {
                      column.Template(t => { }).Title("Edit").Width(10)
                          .ClientTemplate(@"<a class='btn btn-info btn-xs k-grid-edit' title='Edit this contact.'><i class='fa fa-edit'></i></a>");
                      column.Bound(p => p.IncidentID).Hidden(true);
                      column.Bound(p => p.NameID).Hidden(true);
                      column.Bound(p => p.LocationID).Hidden(true);

                      ...

                  })
                  .Editable(editable => editable.Mode(GridEditMode.PopUp)
                      .TemplateName("EventContact")
                  .Filterable().Sortable().Pageable().ColumnMenu()
                  .Events(ev =>
                  {
                      ev.Edit("onContactGridEdit");
                  })
                  .DataSource(dataSource => dataSource
                      .Ajax()
                      .PageSize(10)
                      .Model(m =>
                      {
                          m.Id(c => new { c.IncidentID, c.NameID, c.LocationID });
                          m.Field(c => c.IncidentID).DefaultValue(Model.IncidentID);
                      })
                      .Read(read => read.Action("Read", "Contact", new { incidentID = Model.IncidentID }))
                      .Create(update => update.Action("Create", "Contact"))
                      .Update(update => update.Action("Update", "Contact"))
                      .Destroy(update => update.Action("Delete", "Contact"))
                  .Events(events =>
                  {
                      events.Change("incidentUpdate.onDataSourceChange");
                  })  )  )

            function dataSourceChange(e) {

                if (e.action === "remove" && !e.items[0].ContactIsNew) {   // this is a field I set to determine if it is a create or update
                    e.preventDefault();
                }
            }

            function dataSourceSync(e) {

                if (e.action === "remove" && !e.items[0].ContactIsNew) {   // this is a field I set to determine if it is a create or update
                    e.preventDefault();
                }
            }

Steve
Top achievements
Rank 1
 answered on 19 Feb 2018
5 answers
641 views

Hello,

I have a Telerik MVC Ajax grid. One each coloumn there is a column menu with sorting and the multicheck filters. I would like the multicheck filters to be sorted a-z.

The ColumnMenuInit event is calling the following code found in another question:

    var filterMultiCheck = e.container.find(".k-filterable").data("kendoFilterMultiCheck");
    if (filterMultiCheck != undefined) {
        filterMultiCheck.container.empty();
        filterMultiCheck.checkSource.sort({ field: e.field, dir: "asc" });
        filterMultiCheck.checkSource.data(filterMultiCheck.checkSource.view().toJSON());
        filterMultiCheck.createCheckBoxes();
    }

However, this isn't working. Any ideas?

Thank you

Lucy

Preslav
Telerik team
 answered on 19 Feb 2018
1 answer
313 views

Hello,
I have a Telerik MVC Ajax grid. I noticed that in the latest release you handle null values in the Multi check filter. It now shows 'null' in the filter. This is a very technical term and we would rather then word 'Blanks' to appear. Is there anyway I can achieve this?

Thank you
Lucy

Stefan
Telerik team
 answered on 19 Feb 2018
3 answers
888 views

We are using the below code for loading data in a Kendo dropdown inside a grid. The data is getting loaded, but after applying filter and selecting an item in the filter only the filter data is displayed in the dropdown. The dropdown is not getting refreshed to load the entire data. Please help

 

@(Html.Kendo().DropDownList()
            .Name("VehicleSegment") // The name of the widget should be the same as the name of the property.
            .DataValueField("VehicleSegmentID") // The value of the dropdown is taken from the ID property.
            .DataTextField("VehicleSegmentName") // The text of the items is taken from the EmployeeName property.
           .MinLength(3)
           //.OptionLabel("---Select Vehicle Segment ---")
          .HtmlAttributes(new { style = "width:100%" })
         .Template("#= VehicleSegmentID # | For: #= VehicleSegmentName #")
          .Height(290)
           //.Filter(FilterType.Contains)
           .Filter("contains")
          .DataSource(source =>
          {
              source.Custom()
                  .ServerFiltering(true)
                  .ServerPaging(true)
                  .PageSize(80)
                  .Type("aspnetmvc-ajax") //Set this type if you want to use DataSourceRequest and ToDataSourceResult instances
                  .Transport(transport =>
                  {
                      transport.Read("Virtualization_Read", "Program");
                  })
                  .Schema(schema =>
                  {
                      schema.Data("Data") //define the [data](http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#configuration-schema.data) option
                            .Total("Total"); //define the [total](http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#configuration-schema.total) option
                  });
          })
          .Virtual(v => v.ItemHeight(20).ValueMapper("valueMapper"))

Dimitar
Telerik team
 answered on 19 Feb 2018
1 answer
270 views

I have a Tooltip setup to display a grid of data when a span is clicked.  The span has 'data' elements which contain the parameters to be passed to the Action method on the Controller.  This all works pefertly fine in my development environment, however when I deploy to test or production the parameters being passed to the Action method are null.

My implementation follows this example:

https://demos.telerik.com/aspnet-mvc/tooltip/ajax#

When I try the demo at this link, it also does not display the content of the tooltip, just a blank tooltip.

So my question is why does this work for in my development environment but not my test or production environment?  Also, does the example on the demo site not work?

My code is as follows:

.CSHTML content
This is partial content, but enough to show what is setup:

            <div class="row skills-border skills-border-bottom">

                <h3>CMRP <span class="small" style="font-size: .5em">(Click on # for detail)</span></h3>


                <div class="col-md-6 col-lg-6">
                    @{
                        string cmrpValidClass = item.CMRPValidCount == 0 ? "label-danger" : "label-success";
                        string cmrpValidTextClass = item.CMRPValidCount == 0 ? "text-danger": "text-success" ;
                    }
                    <span class="label cmrpDetail @cmrpValidClass" data-group="@item.Category~~true" data-validcmrp="true">@Html.DisplayFor(x => item.CMRPValidCount)</span>

                    <h5 class="@cmrpValidTextClass"> @Html.DisplayNameFor(x => x.CMRPValidCount) </h5>

                </div>

                <div class="col-md-6 col-lg-6">
                    @{
                        string cmrpNotValidClass = item.CMRPNotValidCount == 0 ? "label-success" : "label-danger";
                        string cmrpNotValidTextClass = item.CMRPNotValidCount == 0 ? "text-success" : "text-danger";
                    }
                    <span class="label cmrpDetail @cmrpNotValidClass" data-group="@item.Category~~false" data-validcmrp="false">@Html.DisplayFor(x => item.CMRPNotValidCount)</span>

                    <h5 class="@cmrpNotValidTextClass hasTooltip" title="@cmrpNotValid"> @Html.DisplayNameFor(x => x.CMRPNotValidCount) </h5>

                </div>
            </div>
        </div>
    }
</div>
@(Html.Kendo().Tooltip()
      .For(".cmrpDetail")
      .ShowOn(TooltipShowOnEvent.Click)
      .LoadContentFrom("CMRPDetail", "CenterOfExcellence")
      .Position(TooltipPosition.Top)
      .Width(700)
      .Height(500)
      .Events(events =>
      {
          events.RequestStart("requestStart");
          events.Show("show");
      }))

 

<script>
    function show() {
        this.refresh();
    }
    function requestStart(e) {
        e.options.data = {
            id: e.target.data("group")
        }
    }

</script>

From CenterOfExcellenceController

        public ActionResult CMRPDetail(string id)
        {
            string[] parameters = id.Split(new []{"~~"}, StringSplitOptions.None);

            IEnumerable<CMRPDetailEntity> result = _mPractSkillsBo.GetCMRPDetailByGroup(parameters[0], bool.Parse(parameters[1]));

            return PartialView("CMRPDetail", result);
        }

 

The Routes

        public static void RegisterRoutes(RouteCollection routes)
        {
            routes.IgnoreRoute("{resource}.axd/{*pathInfo}");


            routes.MapRoute("Default", "{controller}/{action}/{id}",
                new {controller = "Home", action = "Index", id = UrlParameter.Optional}
                );

            routes.MapRoute(
                "DeleteUser",
                "{controller}/{action}/{id}/{guid}",
                new {controller = "Account", action = "Delete"});

        }

Ianko
Telerik team
 answered on 19 Feb 2018
2 answers
228 views

Hey

 

DropDownList component don't fire the change event when using keyboard enter after the list is filtered.

 

Reproducible here: https://demos.telerik.com/aspnet-mvc/dropdownlist/events

1. Click on the dropwdown list to access filter input

2. Search for "Item"

3. use keyboard arrow down to select Item 2

4. hit keyboard enter.

The change event is not fired.

 

If you do the same, but skip step 2, the change event is fired.

Dan-Petter
Top achievements
Rank 1
 answered on 19 Feb 2018
3 answers
250 views
Does the capability exist to only have a hierarchy grid available for specific records.  Basically is there a way to dynamically set the .ClientDetailTemplateId?
Eduardo Serra
Telerik team
 answered on 16 Feb 2018
1 answer
97 views

I have a 10 column grid with a hierarchy grid consisting of only 2 columns. By default it seems the hierarchy grids fills the space of the parent grid and thus the 2 columns are stretched across the entire width.

I have tried explicitly setting a width for each column of the hierarchy grid but they do not seem to have any effect whatsoever. 

Is there a way to set hierarchy grid total width or be able to set column widths of the hierarchy grid?

Viktor Tachev
Telerik team
 answered on 16 Feb 2018
2 answers
104 views
How can I set aggregates values in header mvc grid for every column like on a the picture? Thanks
Olexandr
Top achievements
Rank 1
 answered on 16 Feb 2018
Narrow your results
Selected tags
Tags
+? more
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?