Telerik Forums
UI for ASP.NET Core Forum
1 answer
121 views

Hello. I have a problem with grid edit in line.

 

I have defined normal grid, which uses ViewModel.

ViewModel has 3 fields (int A, int B, bool checkbox) 

A field isn't editable by default but whenever I click "edit" I can change B field or check/uncheck checkbox.

I'd like to make field A make editable whenever checkbox is checked by user during edition. So after the checkbox is check A fields is editable.

 

Greetings

Tsvetomir
Telerik team
 answered on 18 Jan 2019
0 answers
59 views

I have two charts, and I'd like to make it so the second chart updates when the series in the first chart is clicked. There's a master page with my RadAjaxManager, so I'm using a RadAjaxManagerProxy with these two charts. I'm having trouble converting the code samples I see in the documentation to work with my RadAjaxManagerProxy.

Here are my two charts:

<telerik:RadHtmlChart ID="Chart_Referrals_By_Month" runat="server" DataSourceID="ReferralsByMonth" Skin="Windows7" RenderMode="Lightweight" Height="250">
     <ClientEvents OnSeriesClick="OnSeriesClick"/>
     <PlotArea>
         <Series>
             <telerik:LineSeries Name="Column1" DataFieldY="AVERAGE_REFERRALS">
                 <TooltipsAppearance Visible="false"></TooltipsAppearance>
                 <Appearance>
                     <FillStyle BackgroundColor="#add8e6"></FillStyle>
                 </Appearance>
             </telerik:LineSeries>
         </Series>
         <XAxis DataLabelsField="MONTH_NAME" Color="black" MajorTickSize="0" MinorTickSize="2" MinorTickType="Outside">
             <LabelsAppearance RotationAngle="-45" />
             <MajorGridLines Visible="false" />
             <MinorGridLines Visible="true" />
         </XAxis>
         <YAxis AxisCrossingValue="0" Color="black" MajorTickSize="2" Step="1">
             <LabelsAppearance DataFormatString="{0}" RotationAngle="0" Skip="0" />
             <TitleAppearance Position="Center" RotationAngle="0" Text="Percent" Visible="false" />
             <MajorGridLines Visible="false" />
             <MinorGridLines Visible="false" />
         </YAxis>
     </PlotArea>
     <ChartTitle Text="Referrals per Day by Month - Average"></ChartTitle>
     <Legend>
         <Appearance BackgroundColor="Transparent" Position="Bottom" Visible="false"></Appearance>
     </Legend>
 </telerik:RadHtmlChart>

 

<telerik:RadHtmlChart ID="Chart_Referrals_By_Day" runat="server" DataSourceID="ReferralsByDay" Skin="Windows7" RenderMode="Lightweight" Height="250">
    <PlotArea>
        <Series>
            <telerik:LineSeries Name="Column1" DataFieldY="PERCENT_REFERRALS">
                <TooltipsAppearance Visible="false"></TooltipsAppearance>
                <Appearance>
                    <FillStyle BackgroundColor="#add8e6"></FillStyle>
                </Appearance>
            </telerik:LineSeries>
        </Series>
        <XAxis DataLabelsField="DAY_NAME_LONG" Color="black" MajorTickSize="0" MinorTickSize="2" MinorTickType="Outside">
            <LabelsAppearance RotationAngle="-45" />
            <MajorGridLines Visible="false" />
            <MinorGridLines Visible="true" />
        </XAxis>
        <YAxis AxisCrossingValue="0" Color="black" MajorTickSize="2">
            <LabelsAppearance DataFormatString="{0}" RotationAngle="0" Skip="0" />
            <TitleAppearance Position="Center" RotationAngle="0" Text="Percent" Visible="false" />
            <MajorGridLines Visible="false" />
            <MinorGridLines Visible="false" />
        </YAxis>
    </PlotArea>
    <ChartTitle Text="Referrals by Day - %"></ChartTitle>
    <Legend>
        <Appearance BackgroundColor="Transparent" Position="Bottom" Visible="false"></Appearance>
    </Legend>
</telerik:RadHtmlChart>

Here's my JavaScript:

function OnSeriesClick(args) {
    var kendoWidget = args.sender;
    if (args.value > 0) {
        $find("<%= RadAjaxManager.GetCurrent(Page).ClientID %>").ajaxRequest(args.category);
    }
} // end OnSeriesClick

 

What I don't know is how to handle this on the server side. From the Implementing Drill-Down Functionality example, I have:

protected void RadAjaxManager1_AjaxRequest(object sender, AjaxRequestEventArgs e) {
    string seriesName = Chart_Referrals_By_Month.PlotArea.Series[0].Name;
} // end RadAjaxManager1_AjaxRequest

 

However, this line never executes. I'm missing a step here, and I was hoping you could point out what I need.

Thank you!

bdrennen
Top achievements
Rank 1
 asked on 17 Jan 2019
2 answers
287 views

We are experiencing an issue with the virtual scrolling of a combobox when used as a custom editor template in a grid with in-cell editing. I have a solution to demonstrate the issue, but it is too large to upload.

Basically, when clicking into the combobox, the control is bound and looking at the web requests, the value is passed correctly to the ValueMapper and the index is retrieved correctly from the server. However, if you then TAB or press ENTER in the combobox, it attempts to retrieve the value based on the text in the combobox, clearing the reference.

Veselin Tsvetanov
Telerik team
 answered on 17 Jan 2019
1 answer
65 views

I use the Silverlight control before. it can use Keyboard navigation to select certain row. but asp.net core control can not do that. how can i use keyboard to change the selected row.

when the cell is editable. can i use down arrow to close the edit state and change to the next row like spreadsheet.

Milena
Telerik team
 answered on 16 Jan 2019
2 answers
415 views

Hi Telerik Team, 

I am facing an issue with the position of Kendo controls on my page. I am using Chrome browser. The issue persists for Autocomplete, Dropdown lists, date pickers and Grid column menu. As we scroll down the page and then if we try to open the Grid column menu, it opens up much below than it should be and the gap increases as we increase the vertical scrolling of the page. Is it a known issue? 

Attached is the screenshot for the same.

Please help me out with this.We are using Kendo controls in every page for our web application.

Thanks

LIS Help
Top achievements
Rank 1
 answered on 16 Jan 2019
6 answers
120 views

Hello,

In my grid, i have a nested object and i would like to add the filterable feature on it (so it doesn't display [] object). I followed this tutorial:

- https://demos.telerik.com/aspnet-core/grid/filter-multi-checkboxes

 

The call to the web API is done, but I keep having a javascript error after the call 

Uncaught TypeError: e.slice is not a function

 

How can i fix this ? Thank you very much

Here is my code so far: 

 

@(Html.Kendo().Grid<EnginViewModel>()
    .Name("enginGrid")
    .Columns(col =>
    {
         col.Bound(c => c.Famille) //EnginViewModel.Famille
            .Title("Famille")
            .Filterable(ftb => ftb.Multi(true).Search(true)
                .DataSource(d => d.Read(r => r.Action("Familles", "EditorTemplate").Data("{ field: 'Nom'}"))))
            .EditorTemplateName("Famille")
            .ClientTemplate("#= data ? data.FamilleDesignation : \"\" #");
    })
    .ToolBar(toolbar =>
    {
        toolbar.Create().IconClass("fa fa-plus").Text(" Créer un engin");
    })
    .Sortable(true)
    .Filterable(f =>
    {
        f.Mode(GridFilterMode.Menu);
    })
    .DataSource(ds => ds.Ajax()
        .ServerOperation(true)
        .Model(m =>
        {
            m.Id(f => f.Id);
        })
        .Events(evt => evt.Error("onGridDatasourceError"))
        .Read(a => a.Action("Read", "Engins").Type(HttpVerbs.Get))
        .Create(a => a.Action("Create", "Engins").Type(HttpVerbs.Post))
        .Update(a => a.Action("Update", "Engins").Type(HttpVerbs.Put))
        .Destroy(a => a.Action("Delete", "Engins").Type(HttpVerbs.Delete)))
)
Tsvetina
Telerik team
 answered on 16 Jan 2019
2 answers
193 views
I have an incremental search working in a dropdownlist and I would like to show a more distinct spinning icon or image when the control is making the Ajax call to the controller.  Is there a way to change this?  Can a style be changed?  In a perfect world showing a bubble hint with "Searching would be ideal.
Reid
Top achievements
Rank 2
 answered on 14 Jan 2019
2 answers
92 views

Hello,

I'm able to set the color of the points on the chart (red and blue). I'm unable to get rid of the black-center of the points by setting the background color.

How do I set both color of points and background color (center of point) to same color?

Thanks.

js code:

----------

<script>
        function getPointColor(point)
        {
        if (point.dataItem.Name === "Left Eye Sensor")
        {
            return "#af3d3c";
        }
        else
        {
            return "#3f48cc";
        }
    }
</script>

@(Html.Kendo().Chart<KendoScatterChart.Models.ChartScatterPlotPoint>(Model)
            .Name("pressureDataChart")
            .Legend(legend => legend
                .Position(ChartLegendPosition.Bottom)
            )
            .ChartArea(chartArea => chartArea
                .Background("transparent")
            )
            .SeriesDefaults(seriesDefaults =>
                seriesDefaults.Scatter().Labels(labels => labels.Visible(true)).Markers(markers => markers.Size(8))
            )
            .DataSource(dataSource => dataSource
                .Group(group => group.Add(model => model.Name))
            )
            .Series(series =>
            {
                series.Scatter(model => model.X, model => model.Y).ColorHandler("getPointColor").Markers(markers => markers.Background("getPointColor"));
            })
            .XAxis(x => x
                .Date()
                .Title(title => title.Text("Date"))
            )
            .YAxis(y => y
                .Numeric()
                .Title(title => title.Text("Pressure [mmHg]"))
            )
            .Zoomable()
            .Pannable()
)

C# code:

------------

    public class ChartScatterPlotPoint
    {
        public DateTime X { get; set; }
        public double Y { get; set; }

        public string Name { get; set; }

        public string Color { get; set; }

        public ChartScatterPlotPoint(DateTime dateTime, double v, string name, string color)
        {
            this.X = dateTime;
            this.Y = v;
            this.Name = name;
            this.Color = color;
        }
    }

    public class TempModel : ModelBase
    {
        // For KendoUI plotting.
        public List<ChartScatterPlotPoint> DataPointList { get; set; }
        public List<string> DateList { get; set; }

        public string Name { get; set; }

        public TempModel()
        {

// for demo - color set by js-method.
            DataPointList = new List<ChartScatterPlotPoint>(){
                new ChartScatterPlotPoint(DateTime.Parse("12/18/2018"), 1, "Left Eye Sensor", "blue"),
                new ChartScatterPlotPoint(DateTime.Parse("12/19/2018"), 2, "Left Eye Sensor", "blue"),
                new ChartScatterPlotPoint(DateTime.Parse("12/20/2018"), 3, "Left Eye Sensor", "blue"),
                new ChartScatterPlotPoint(DateTime.Parse("12/18/2018"), 1.5, "Right Eye Sensor", "green"),
                new ChartScatterPlotPoint(DateTime.Parse("12/19/2018"), 2.5, "Right Eye Sensor", "green"),
                new ChartScatterPlotPoint(DateTime.Parse("12/20/2018"), 3.5, "Right Eye Sensor", "green")
            };
        }
    }

James
Top achievements
Rank 1
 answered on 14 Jan 2019
3 answers
1.7K+ views

I just started using the controls and started with the test app to learn. I can't find out how to set the row height. The row height from the test app is way to large. How do I adjust the row height?

<div class="row">
    <div class="col-xs-5 col-md-12">   
        @(Html.Kendo().Grid<TelerikAspNetCoreApp1.Models.OrderViewModel>()
                                        .Name("grid")
                                        .Columns(columns =>
                                        {
                                            columns.Bound(p => p.OrderID).Filterable(false);
                                            columns.Bound(p => p.Freight);
                                            columns.Bound(p => p.OrderDate).Format("{0:MM/dd/yyyy}");
                                            columns.Bound(p => p.ShipName);
                                            columns.Bound(p => p.ShipCity);
                                        })
                                        .Pageable()
                                        .Sortable()
                                        .Scrollable()
                                        .Filterable()
                                        .HtmlAttributes(new { style = "height:450px;" })
                                        .DataSource(dataSource => dataSource
                                            .Ajax()
                                            .PageSize(20)
                                            .Read(read => read.Action("Orders_Read", "Grid"))
                                        )
        )
    </div>
</div>
Vincent
Top achievements
Rank 1
Iron
 answered on 13 Jan 2019
18 answers
798 views
Hello, in my site I have boxes and in the boxes I have charts. The boxes do have a default width and height(height & width are the same. Even on resize). Now only do the charts their own thing and get their own height. How can I fix it so the charts will fit in the boxes?
Chili
Top achievements
Rank 1
 answered on 11 Jan 2019
Narrow your results
Selected tags
Tags
+? more
Top users last month
Rob
Top achievements
Rank 3
Bronze
Iron
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Bronze
Iron
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?