Telerik Forums
UI for ASP.NET MVC Forum
1 answer
11 views

Controls loading icon stretching fields

As you can see fields grow and shrink due the the loading icon right of the dynamic controls being larger than the control I believe

Is this a bug or something I can do to resolve

https://i.imgur.com/puFkDGl.gif

Eyup
Telerik team
 answered on 26 Feb 2024
1 answer
31 views

I'm using a k-grid with an items per page dropdown, it initially loads correctly but when a new value is selected then the pager elements are hidden. 

Anton Mironov
Telerik team
 answered on 25 Oct 2023
1 answer
49 views

I'm upgrading a project from 2021.2.511 to 2023.2.829 and I have a page which is extremely data heavy. Using the  .Size(ComponentSize.Small) option still results in a much larger drop-down list than before.

How can I reduce the size of these drop-downs further? In the old version, they simply inherited the font-size of the parent div.

 

This also applies to the multiselect controls as well

Ivan Danchev
Telerik team
 updated answer on 04 Oct 2023
1 answer
254 views


@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.

Anton Mironov
Telerik team
 answered on 27 Sep 2023
1 answer
61 views
Hi,
I have a project implementing kendo grid UI for asp.net mvc. It has a common .Filterable() as:
.Filterable(ftb =>
{
    ftb.Mode(GridFilterMode.Row);
    ftb.Extra(false);
    ftb.Operators(operators => operators.ForString(str => str.Clear().IsEqualTo("Is equal")
                                                                    .StartsWith("Contains")
                                                                    .IsNotEqualTo("Is not equal"))
                                        .ForDate(str => str.Clear().IsEqualTo("Is equal")
                                                                    .IsNotEqualTo("Is not equal")
                                                                    .IsLessThan("Is less than")
                                                                    .IsGreaterThan("Is greater than")
                                                                    .IsLessThanOrEqualTo("Is less than or equal to")
                                                                    .IsGreaterThanOrEqualTo("Is greater than or equal to"))
                                        .ForNumber(str => str.Clear().IsEqualTo("Is equal")
                                                                    .IsNotEqualTo("Is not equal")
                                                                    .IsLessThan("Is less than")
                                                                    .IsGreaterThan("Is greater than")
                                                                    .IsLessThanOrEqualTo("Is less than or equal to")
                                                                    .IsGreaterThanOrEqualTo("Is greater than or equal to")));
})
However, for 1 particular column, I have set .Filterable(ftb => ftb.Cell(cell => cell.Template("nameOfMyDropDownList")));
The custom filter is populated using JS. The thing is, I want to get rid of the Filter Icon that gets displayed along with the dropdown since it does not make sense to have the filter icon there when we can have a custom filter dropdown. 
I tried adding a class to the element to be hidden. But the class name doesn't get added. 
Anton Mironov
Telerik team
 answered on 11 Sep 2023
0 answers
155 views

I am trying to create a kendo grid with one of the column as a multiselect dropdown widget, so users can select multiple values for a column named industry in a single record. I am not able to do so.

Please help.

This is how i have prepared my grid :

$("#ListofMF").kendoGrid({
            dataSource: {
                data: extractedData,
                schema: {
                    model: {
                        fields: {
                            Id: {type: "integer"},
                            FullName: { type: "string" },
                            Temp1: { type: "boolean" },
                            Temp2: { type: "boolean" },
                            Industry: { type: "string" },
                            //Discontinued: { type: "boolean" }
                        }
                    }
                },
                pageSize: 20
            },
            //scrollable: true,
            sortable: true,
            filterable: true,
            pageable: {
                input: true,
                numeric: true,
                pageSize: 6
            },
            columns: [
                {
                    title: " ",
                    width: 30,
                    field: "Id",
                    hidden: true
                },
                {
                    title: " ",
                    width: 40,
                    filterable: false,
                    headerAttributes: { style: "font-weight: bold;" },
                    template: '<input type="checkbox" class="isMFSelected"/>'
                },
                {
                    field: "FullName",
                    title: "Data",
                    //width: "140px",
                    headerAttributes: { style: "font-weight: bold;" }
                },
                {
                    field: "Temp1",
                    title: "Temp 1",
                    width: "130px",
                    filterable: false,
                    headerAttributes: { style: "font-weight: bold;" },
                    template: '<input type="checkbox" class="Temp1" #=Temp1? "checked=checked" : "" #/>'
                },
                {
                    field: "Temp2",
                    title: "Temp 2",
                    width: "130px",
                    filterable: false,
                    headerAttributes: { style: "font-weight: bold;" },
                    template: '<input type="checkbox" class="Temp1" #=Temp1 ? "checked=checked" : "" #/>'
                },
                {
                    field: "Industry",
                    title: "Industry",
                    editor: function (container, options) {
                        // Get the industry template and apply it to the column editor
                        console.log(container.html);
                        var industryTemplate = $("#industryTemplate").html();
                        container.html(industryTemplate);
                    }
                }
            ]
        });
And in another script tag i am preparing the multiselct widget

<script id="industryTemplate" type="text/x-kendo-template">
    @(Html.Kendo().MultiSelect()
        .Name("Industry")
        .DataValueField("Value")
        .DataTextField("Text")
        .BindTo((IEnumerable<SelectListItem>)ViewData["IndustryList"])
    )
</script>
My output on screen for Industry column always remains like :


Biswajit
Top achievements
Rank 1
 asked on 22 Aug 2023
0 answers
44 views

Grid with Parent rows and Detail Table. Parent row has a DropDown bound to choices. The data in the Detail Table includes a DropDown bound to same possible choices. When page 1st renders all the DropDowns in the detail table display the same choice that the parent row shows.  It is possible for parent row to have 1 value then each of the 5 detail rows to have different values for the column that is manipulated with dropdown. The problem is that the detail dropdowns although bound to data rows with proper value instead show the text that the parent dropdown shows.

This is before user makes any choices. If user clicks on dropdown in detail table it will change to dropdown and show the correct choice.

How to get the detail tables to render correctly when initially displayed? I added a couple of images for illustration. InitialRender.png is the screen right after it loads. Afterclick.png is the screen after clicking the dropdown control, but not changing the value. You see that the dropdown has selected the value that corresponds to the data in the datasource for that row. The dropdowns in the detail rows dont even have a value of "Multiple" to select.

 

 

 

 


Keith
Top achievements
Rank 1
Iron
Iron
 updated question on 15 Aug 2023
1 answer
209 views

I have a Kendo dropdown list in my project, data of which is dependent from some external conditions and can be changed while widget is already constructed.

When you have 1 item initially and you open dropdown - height for the suggestions popup is fine and covers this 1 item.

When you later change number of items to 6 for example and try to open it - height is still covers only one item and creates a scroll instead of just expand to all available area.

Here is a Dojo example of how it works: https://dojo.telerik.com/oGubaqiX

You should open dropdown, then hit "Change DS" button and the open dropdown again.

As you can see the behavior is absolutely wrong.

How can I change it or what am I doing wrong?

Neli
Telerik team
 answered on 10 Aug 2023
1 answer
130 views

Hi,

I am working on a grid having inline edit functionality.  I am trying to create a dropdown which display a list of persons, however, I want to save the email id of the person in our backend SQL DB.

I am trying to implement this with editor template approach -

I have tried the below code -

Grid:

columns.Bound(mm => mm.Person).Title("Assigned To").EditorTemplateName("PersonList").HeaderHtmlAttributes(new { style = "white-space: normal" });

PersonList.chstml

@(Html.Kendo()
            .DropDownList()
            .Filter("contains")
            .Name("Person")
            .DataTextField("Name")
            .DataValueField("Email")
            .DataSource(dataSource =>
            {
                dataSource.Read(read => read.Action("GetPeopleByArea", "Common").Data("getPeopleByArea"))
                .ServerFiltering(true);
            })
            //.HtmlAttributes(new { required = "required", data_required_msg = "Select Person Name", style = "width: 100px" })
            .ValuePrimitive(true)
            .AutoWidth(true)
            .OptionLabel("-- Please Select --")            
    )

 

function getPeopleByArea() {
        var grid = $("#Grid").data("kendoGrid");
        var dataItem = grid.dataItem("tr.k-grid-edit-row");
        return {
            Area: dataItem.Area
        };
    }

When I edit the grid the dropdown work list works fine and it displays the filtered list of people as expected.  However, Instead of the email id the record is getting updated with Null or blanks in the backend table.

However, this approach works fine if I do not use getPeopleByArea function to filter the area based on certain conditions and use a different controller function to get the whole list.

Also, if I am using  .DataTextField("Name") and  .DataValueField("ID"), ID is getting stored and same is getting displayed on the grid instead of the Name.

What am I doing wrong here ? Can anyone please suggest.

Please let me know if you have any questions.

 

 

Thanks

Saurabh

 

Saurabh
Top achievements
Rank 1
Iron
 answered on 07 Aug 2023
0 answers
40 views

Was originally doing this with ASP.NET AJAX WebForms Telerik Grid, but because of walls we hit with other functionality we are moving page to MVC.

Thing of Order Line and then as detail table we have Line Items. The Order Line has a Category Drop Down. When the Order Line Category gets changed all the Line Items must be changed to the same Category of the Order Line. If a Line Item category is changed then if all the Line Items have the same category then the Order Line needs to get changed to the category of all the Line Items. If all of the Line Items arent the same then the Order Line must be changed to the "Multiple" category.

We have been able to make changes to the datasource of the Line Items and if you click on the drop down in a Line Item the DropDown will change and the Category of the Order Line is shown as selected, but not until then.  When page 1st renders the Order Line has a drop down with "Category One" showing, then all the Line Items will also show that category in the drop down. If you change the Category of the Order Line with say "Category Two" the line items get changed, but user doesnt see in grid. If the user clicks on the Line Item dropdown the drop down appears and the item selected shows "Category Two".

How to make this work as desired with MVC and Kendo?

Keith
Top achievements
Rank 1
Iron
Iron
 asked on 04 Aug 2023
Narrow your results
Selected tags
Tags
+? more
Top users last month
horváth
Top achievements
Rank 2
Iron
Iron
Steve
Top achievements
Rank 2
Iron
Erkki
Top achievements
Rank 1
Iron
Mark
Top achievements
Rank 2
Iron
Iron
Veteran
Jakub
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
horváth
Top achievements
Rank 2
Iron
Iron
Steve
Top achievements
Rank 2
Iron
Erkki
Top achievements
Rank 1
Iron
Mark
Top achievements
Rank 2
Iron
Iron
Veteran
Jakub
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?