HI,

I am trying to implement same as in the below link. Left side I will have some kind Post. When user clicks on post, a detail description of the post and link to post. How can i achieve that using Kendo UI.

https://www.simplyhired.com/search?q=public+health&l=indianapolis%2C+in&job=iJJy6i0E0V-4gvVMEPNpNN_jKCO99ik22-I_b_wJfFsVWYYHszfIow&t=7&sr=100

https://www.indeed.com/?vjk=ecee10295b7129db&advn=2889100715288898

Thanks

I want to do a grid, where there is a single radio button in the column, indicating which of those rows is "selected" in the dataset for processing in the backend. So I'll have multiple rows, with their own data in it, and a radio button that when clicked will leave the radio buttons in the other rows unselected. All data needs to be pushed to the server in a submit/post form.

How would I go about doing this in a sane method? The backend is expecting an object including other data from the form including a List<MyObject> from that grid, where MyObject is similar to the following:
long Id; // database ID for this object
bool IsSelected; // whether the radio button was checked
double SomeNumberValue; // value I want to track
int Order; // displayed order

Ultimately the object the controller is receiving is similar to this:
long TicketId;
...
List<MyObject> Items; // data from my grid above
...
string OtherData;

@model DetailSelectionViewModel

@(Html.Kendo().DropDownListFor(m => m)
        .DataValueField("Id")
        .DataTextField("Name")
        .Value(Model.Selected)
        .Events(e =>
        {
            e.Select("SelectionDropDownItemSelected");
            e.DataBound("SelectionDropDownDataBound");
        })
        .DataSource(dataSource => dataSource
            .Read(read => read.Action("GetDetailList", "DataWorksheet"))
        )
)

Above is the drop down that I have embedded within a detail grid.  When a value is changed in the master grid I need to traverse through all the detail rows and change the selected item in the dropdown list in each row.

So I successfully traverse the dataitems bound to the detailgrid. The dropdown appears to be changed until you actually click on the dropdown list and the dropdown appears with the selecteditem still being the item that was selected when the grid was originally rendered. When I click on the dropdown the Read Action occurs and the data is retrieved and the dropdown is bound, but the selected value isnt set to the new value desired.

Thinking that I can traverse the dataitems and set the values there. Think I need to traverse the datagrid itself and find the dropdown list in each row and programmatically choose the selected value.  I see no sample code to one traverse the datagrid that is a child when parent changed. I see no sample code to find the dropdown list in a datagrid row.

My logic starts when the datasource change event occurs for the parent grid.

Can anyone assist please. These tasks cant be that uncommon.

Updating a project to .net 6 from 4.x and I'm trying to get the Kendo grid to fire up and I'm getting the error CS1061... does not contain a definition for Kendo. Can someone help me out with this? I'm missing some kind of reference.

Hi, I have the following chart and I would like to insert a plot band when I click on the chart. I use the same javascript code in the console of the browser and it works, however, it does not work when I do it from my code:

    <script>
        // Hub Settings
        var hub = Global.HubManager.createHub(Global.HubType.BestOrders)
        var hubConnection = hub.connection;
        var hubStart = hub.start;
   
        function onPlotAreaClick(e) {
           console.log(kendo.format("Plot area click :: Timestamp {0} : {1:N0}",
                e.category, e.value
            ));
            
            showVerticalLine();
        }

        function showVerticalLine() {
            console.log("generating vertical line")

            var chart = $("#BestOrdersLive").data("kendoChart");
            var plotbands = chart.options.categoryAxis.plotBands[0];
            console.log(plotbands);
            plotbands = {color: "Red", from: 30, to: 30};
            console.log(plotbands);
            
            chart.redraw();
        }
        
    </script>
   <div id="live-chart">
        @(
            Html.Kendo().Chart<BestOrderViewModel>()
            .Name("BestOrdersLive")
            .AutoBind(true)
            .Theme("Black")
            .Title("Best Orders Live")
            .Legend(true)
            .Events(e => e.PlotAreaClick("onPlotAreaClick"))
            .DataSource(dataSource => dataSource
					.SignalR()
                    .AutoSync(true)
					.Transport(tr => tr
					    .Promise("hubStart")
					    .Hub("hubConnection")
					    .Client(c => c
					        .Read("read")
					        .Create("create")
					        .Update("update")
					        .Destroy("destroy")
					        )
					    .Server(s => s
					        .Read("read")
                            .Create("create")
                            .Update("update")
					        .Destroy("destroy")
					        )
					)
             )
            .Series(series =>
            {
                series.Column(model => model.DealVolume).Name("TradeVolume").CategoryField("ActionTime").Axis("volume").Tooltip(t => t.Visible(true));
                series.Line(model => model.BestBid).Name("BestBid").CategoryField("ActionTime").Color("Yellow");
                series.Line(model => model.BestAsk).Name("BestAsk").CategoryField("ActionTime").Color("Blue");
                series.Line(model => model.DealPricePaid).Name("DealPricePaid").CategoryField("ActionTime").Color("Red").Width(0);
                series.Line(model => model.DealPriceGiven).Name("DealPriceGiven").CategoryField("ActionTime").Color("Green").Width(0);
                series.Line(model => model.DealPriceOTC).Name("DealPriceOTC").CategoryField("ActionTime").Color("Black").Width(0);
                series.Line(model => model.ReferencePrice).Name("ReferencePrice").CategoryField("ActionTime").Color("Grey");
                
            })
            .Transitions(false)
            .CategoryAxis(axis => axis
                .Date()
                .Title("Hora")
                .BaseUnit(ChartAxisBaseUnit.Minutes)
                .Labels(labels => labels.Format("HH:mm:ss").Step(10).Rotation(90))
            .Crosshair(c => c.Visible(true))
            .PlotBands(bands => bands.Add().From(2).To(2).Color("Transparent"))
            )
            .ValueAxis(config =>
                config
                    .Numeric("price")
                    .Visible(true)
                    .Title("Preço (€)")
            )
            .ValueAxis(config =>
                config
                    .Numeric("volume")
                    .Visible(true)
                    .Title("Volume")
            )
            .Zoomable(zoomable => zoomable
            .Mousewheel(mousewheel => mousewheel.Lock(ChartAxisLock.Y))
            .Selection(selection => selection.Lock(ChartAxisLock.Y))
            )
            .Pannable(pannable => pannable
            .Lock(ChartAxisLock.Y)
            )
            )
   </div>

So we have a need that in a parent row we change a value (a percentage) and then take that new value and potentially apply to rows in detail table.  Once that is all complete need to take results from the applying the percentage to details rows and update another value in the parent row,.

Basically Parent has a discount percentage. Change the value from say 10% to 20%.

Now go row by row in detail table and potentially discount the price of the each row if they meet a criteria.

I have this working already. At the end do a detailGrid.datasource.sync() and looks good.

Next need to go through the detail table and grab all the changed prices and total them up and put in the parent row total column.

I keep the total during the updating of the detail rows.

Thought doing a parentRowModel.set("Total",newTotal) and then parentGrid.datasource.sync() would do it, but no luck.

Also at the very end we dont want the parentGrid.datasource.sync() to close the detail table. Want it to remain expanded.

What I think is happening is the parentGrid.datasource.sync() is causing the detail table to be restored to original value.

Expect:

User changes parent.

Code changes all of the detail rows that meet a criteria
Code syncs detailGrid to update the UI 
Code syncs the parentGrid to update the parent row changed from calculations
User reviews the changes and manually saves to push changes back to database.
User needs to be able to make changes to multiple parents and details before committing change to database.

Let's say I have a program with two buttons, and each one of them populate my grid with different data

. Every time I click any button it reads the data and replace the current data on the grid with the new one. The problem is, let's say button 1 returned an error like 'Uncaught TypeError: Cannot read properties of null', then when I try to click button 2, which has data that doesn't cause errors, then the read method is not called, it doesn't even show on the network tab.

Is it suppose to be like that, or is there a way to make a situation like this work?

Some information: My grid is made by using MVC model (Html.Kendo().Grid<>) approach, with dataSource.Ajax().

Using your ASP.NET MVC Grid Detail Template demo listed at following link

https://demos.telerik.com/aspnet-mvc/grid/detailtemplate?_ga=2.212498388.1559105652.1688053353-1103487563.1679788213&_gl=1*1tfyiak*_ga*MTEwMzQ4NzU2My4xNjc5Nzg4MjEz*_ga_9JSNBCSF54*MTY4ODA2NTcyMi4xMTYuMS4xNjg4MDY4NDc5LjIxLjAuMA..

How can I enforce or only allow one Detail to be expanded at any given time?

Need an example of using the Filter component with a DataSource.  Using the Apply button of the DataSource I would like to pass the arguments collected from the Filter to the Contoller function bound to the Read command of the datasource.