Nullable Foreign Key column not working

[Robin]

Hi

I am using a grid with with a ForeignKey-column.
Grid is displaying data from a database table, column is a nullable foreign key to another database table.

The grid displays my data as expected, except the nullable foreign key column.
Column stays empty in view, but value can (and is) selected in edit mode.

Main table class is:
{ long Id, string Text, long? ForeignKeyId }

ForeignKey class is:
{ long Id, string Text }

Cannot change classes, cause they are created by EntityFramework from database.
If I do it anyway and make "long? ForeignKeyId" > "long ForeignKeyId", it will display values in grid, but cannot select null value then.

Can't find a data-option-label like in normal DropDownList as well.

So my question is, how to use a ForeignKey-Column in a grid with an intended possible null value?

Greets Robin

[Angel Petrov]

Hi Robin,

Can you please set the value primitive setting to true for the editor of the foreign key column as demonstrated below and let us know if that fixes the matter?

@(Html.Kendo().DropDownListFor(m => m)
        .DataValueField("CategoryID")
        .DataTextField("CategoryName")
        .ValuePrimitive(true)
        .BindTo((System.Collections.IEnumerable)ViewData["categories"])
)

Regards,
Angel Petrov
Progress Telerik

[Robin]

Hi Angel

Can you tell why you're using DropDownListFor?

In the docs https://demos.telerik.com/aspnet-mvc/grid/foreignkeycolumn it's descriping column.ForeignKey.

Current Code:

 

List<VW_Group> groups = currentUser?.UserInfo?.UserId == null ? new List<VW_Group>() : Data.GetGroups(currentUser.UserInfo.UserId);


    @(Html.Kendo().Grid<VW_InternalCauser>()
        .Name("InternalCausers")
        .Columns(c =>
        {
            c.Bound(e => e.Text).Width("250px");
            c.ForeignKey(f => f.GroupId, groups, "Id", "Path").Title("Test").Width("300px");
            [...]
        })
        [...]
        .Editable(e => e.Mode(GridEditMode.InCell).DisplayDeleteConfirmation(false))
        .DataSource(s => s
            .Ajax()
            .Batch(true)
            .ServerOperation(false)
            .Model(m => m.Id(i => i.Id))
            .Read("GetInternalCausers", "ProcessConfig")
            [...]
        )
    )

[Angel Petrov]

Hi Robin,

The DropDownListFor is actually the editor for the cell. It is a preferable choice as it has a value and text fields. In essence one may hold some IDs of another table in the current table which is displayed in the grid. When editing a record however displaying IDs is not desirable so one has to display their corresponding text. That is why a DropDownListFor is used.

Regards,
Angel Petrov
Progress Telerik

[Robin]

Hi Angel

I've tried to get it working, but don't know what to do.

Below my current code - can you assist with this?

Btw., Formatting options won't show up.

 

@{
ApplicationUser currentUser = Session["User"] as ApplicationUser;
List<VW_Group> groups = currentUser?.UserInfo?.UserId == null ? new List<VW_Group>() : Data.GetGroups(currentUser.UserInfo.UserId);
}

<div id="processConfigCausers">

@(Html.Kendo().Grid<VW_InternalCauser>()
.Name("InternalCausers")
.Columns(c =>
{
c.Bound(e => e.Text).Width("250px");
//c.ForeignKey(f => f.GroupId, groups, "Id", "Path").Title("Title").EditorTemplateName("Vorgangsportal_InternalCausersDDL").Width("300px");
c.Bound(e => e.Inherit).Width("150px");
c.Command(e => e.Custom(Resource.Views_2_ExIntern_Vorgangsportal_Pages_Config_RemoveTitleButton).Click("removeInternalCausers").IconClass("k-i-close k-icon")).Width(150);
})
.ToolBar(t =>
{
t.Create();
t.Save();
})
.Navigatable()
.Sortable()
.Editable(e => e.Mode(GridEditMode.InCell).DisplayDeleteConfirmation(false))
.DataSource(s => s
.Ajax()
.Batch(true)
.ServerOperation(false)
.Model(m => m.Id(i => i.Id))
.Read("GetInternalCausers", "ProcessConfig")
.Create("InsertInternalCauser", "ProcessConfig")
.Update("UpdateInternalCauser", "ProcessConfig")
.Destroy("DeleteInternalCauser", "ProcessConfig")
)
)

/*
@(Html.Kendo().DropDownListFor(e => e)
    .DataValueField("Id")
    .DataTextField("Text")
    .ValuePrimitive(true)
        .OptionLabel("test")
    .BindTo((System.Collections.IEnumerable)ViewData["categories"])
)
*/

</div>

[Angel Petrov]

Hi Robin,

From the code it seems that the BindTo for the DropDownList uses a categories collection from the ViewData(code provided below). Can you please ensure that it holds the correct data? It should hold the list with all possible values for that column.

If you can send us a small sample which demonstrates the problem we should be able to quickly provide a solution.

@(Html.Kendo().DropDownListFor(e => e)
    .DataValueField("Id")
    .DataTextField("Text")
    .ValuePrimitive(true)
        .OptionLabel("test")
    .BindTo((System.Collections.IEnumerable)ViewData["categories"])
)

Regards,
Angel Petrov
Progress Telerik

[Robin]

So BindTo goes to groups variable from code above.

How to go with the column in the grid? - Does it has to be a ForeignKey column or a simple bound?
With ForeignKey column I still not have a null value option to select - but can select all others.
Does the BindTo-data has to have a null value in its data on its own?

@(Html.Kendo().DropDownListFor(e => e)
.Name("DropDownListForName")
.DataValueField("Id")
.DataTextField("Text")
.ValuePrimitive(true)
.OptionLabel("test")
.BindTo(groups)
)

groups is a List of { long Id, string Text }.

[Angel Petrov]

Hi Robin,

Since the field is a foreign key either a ForeignKey column or a normal bound column with a drop down as an editor seem like the most appropriate solution.

As for having a value which is null it depends on the exact requirement. If you want to only have it for the new records by default and for the already existing one you would like to user to pick a non-null value. You can define the field in the data source model and provide a default value as shown in this demo. If you want to have a null value representation in the drop down you should put an item which value is null.

Regards,
Angel Petrov
Progress Telerik

[Robin]

Hi Angel

So I'm using ForeignKey column again and dropped DropDownListFor (cause I don't know how to handle it) and added an empty entry to the DDL source.
Cause Id for DDL entry class cannot be null I will try to use -1 as Id and catch it on server site.
But hoped for a simple "null-select-option" instead.

Greets Robin

[Angel Petrov]

Hello Robin,

If you send us a small sample with a setup matching yours we can try and search for an alternative solution to the problem. 

Regards,
Angel Petrov
Progress Telerik

[Robin]

Hi Angel

Cause it's easier for samples and cause I want to change anyway, here an example in MVVM.

https://dojo.telerik.com/AxeSUquk/3

What I want to have is the behaviour from the DDL below.
It's excepting all the three values and offering a null option additionally - without manipulating the original three elemented array - and has null as value when null is selected.

Also I wonder why values from data-column can't be a part of the view model - or displaying wrong data (Id) if I use vm.ddlData.

Greets Robin

[Angel Petrov]

Hi Robin,

In order to have the same exact experience the editor which is initialized should have the optional label enabeld which is not set by default. That said a possible solution to this case is to add a custom editor and set its properties accordingly. When following this approach providing values for the column is not required as you can configure the drop down data source as desired.

Regards,
Angel Petrov
Progress Telerik

[Robin]

Hi Angel

Didn't get it running yet.

Cause it's taking to much time for now, I will stay with "-1" as value and converting to null on server side.

Greets Robin

[Angel Petrov]

Hello Robin,

Do not hesitate to contact us again if questions in regards of our components arise.

Regards,
Angel Petrov
Progress Telerik