Foreign key column update returns null value in controller action

[Lukas Lapinskas]

I have a .NET 8 MVC (I'm using ASP.NET Core version of syncfusion) project with a Grid containing a foreign key column. If I run Update action without the foreign key column, it works just fine.

However, when I add the Country column with foreign key and run the same update action, the `value` in the action's parameter is null. How do I fix this?

c# Controller:

```

public class ForeignCitiesController : Controller

{

    private readonly ClientProcessingDatabaseOptions _clientProcessingDatabaseOptions;

    private readonly AddForeignCityHandler _addForeignCityHandler;

    private readonly EditForeignCityHandler _editForeignCityHandler;

    private readonly DeleteForeignCityHandler _deleteForeignCityHandler;

    public ForeignCitiesController(ClientProcessingDatabaseOptions clientProcessingDatabaseOptions, AddForeignCityHandler addForeignCityHandler, EditForeignCityHandler editForeignCityHandler,

        DeleteForeignCityHandler deleteForeignCityHandler)

    {

        _clientProcessingDatabaseOptions = clientProcessingDatabaseOptions;

        _addForeignCityHandler = addForeignCityHandler;

        _editForeignCityHandler = editForeignCityHandler;

        _deleteForeignCityHandler = deleteForeignCityHandler;

    }

    public IActionResult Index()

    {

        var viewModel = new ForeignCitiesViewModel();

        viewModel.Countries = // countries are retrieved ...

        return View("ForeignCities", viewModel);

    }

    [HttpPost]

    public IActionResult Get([FromBody] DataManagerRequest dm)

    {

        if ((dm.Search?.Count > 0) == false && (dm.Where?.Count > 0) == false)

            return Json(new { result = new List<ForeignCityModel>(), count = 0 });

        // cities are retrieved ...

        var filtered = FilterData(dm, cities);

        return Json(new { result = filtered, count = filtered.Count() });

    }

    [HttpPost]

    public IActionResult Insert([FromBody] CRUDModel<ForeignCityModel> crud)

    {

        // code to insert ...

    }

    [HttpPost]

    public IActionResult Update([FromBody] CRUDModel<ForeignCityModel> value)

    {

        var model = value.Value;

        var response = _editForeignCityHandler.Execute(new EditForeignCityRequest

        {

            Id = model.Id,

            City = model.City,

            CountryId = model.CountryId,

            IsUSOrCanada = model.IsUSOrCanada

        });

        if (!response.IsSuccess)

            return BadRequest(new { errorMessage = string.Join(" ", response.ValidationErrors) });

        return Json(model);

    }

    [HttpPost]

    public IActionResult Delete([FromBody] CRUDModel<ForeignCityModel> crud)

    {

        // code to delete ...

    }

    private static IEnumerable<ForeignCityModel> FilterData(DataManagerRequest dm, IEnumerable<ForeignCityModel> data)

    {

        var operations = new DataOperations();

        if (dm.Search != null && dm.Search.Count > 0) data = operations.PerformSearching(data, dm.Search);

        if (dm.Where != null && dm.Where.Count > 0) data = operations.PerformFiltering(data, dm.Where, dm.Where[0].Operator);

        if (dm.Sorted != null && dm.Sorted.Count > 0) data = operations.PerformSorting(data, dm.Sorted);

        if (dm.Skip != 0) data = operations.PerformSkip(data, dm.Skip);

        if (dm.Take != 0) data = operations.PerformTake(data, dm.Take);

        return data;

    }

}

public class Country

{

    public int Id { get; set; }

    public string Name { get; set; }

}

public class ForeignCitiesViewModel

{

    public List<Country> Countries { get; set; } = new();

}

public class ForeignCityModel

{

    public int Id { get; set; }

    public string City { get; set; }

    public string Country { get; set; }

    public int CountryId { get; set; }

    public bool IsUSOrCanada { get; set; }

    public DateTime Modified { get; set; }

}

```

HTML view:

```

@using ClientProcessing.WebUI.Features.ConditionerTables

@model ForeignCitiesViewModel

@{

    ViewData["Title"] = "Foreign Cities";

}

@section Scripts {

    <script>

        async function onActionFailure(e) {

            const stream = e.error[0].error.body;

            const reader = stream.getReader();

            const { value } = await reader.read();

            let text = new TextDecoder().decode(value);

            let error = "Action failed.";

            try {

                const json = JSON.parse(text);

                error = json.errorMessage;

            } catch {

                // text is not valid JSON – ignore

            }

            toastr.error(error);

        }

        function onActionComplete(args) {

            if (args.requestType === 'save' || args.requestType === 'delete')

                toastr.success('Saved.');

        }

    </script>

}

<h1>Foreign Cities</h1>

<ejs-grid id="js-grid" actionFailure="onActionFailure" actionComplete="onActionComplete" allowResizing="true" allowFiltering="true"

          allowPaging="true" height="610" rowHeight="30" enableAutoFill="true" allowSelection="true" showColumnChooser="true"

          toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Update", "Cancel", "Search", "ColumnChooser" })">

    <e-data-manager url="@Url.Action(nameof(ForeignCitiesController.Get), ControllerHelper.GetName<ForeignCitiesController>())"

                    adaptor="UrlAdaptor"

                    insertUrl="@Url.Action(nameof(ForeignCitiesController.Insert), ControllerHelper.GetName<ForeignCitiesController>())"

                    updateUrl="@Url.Action(nameof(ForeignCitiesController.Update), ControllerHelper.GetName<ForeignCitiesController>())"

                    removeUrl="@Url.Action(nameof(ForeignCitiesController.Delete), ControllerHelper.GetName<ForeignCitiesController>())">

    </e-data-manager>

    <e-grid-pagesettings pageSize="15" pageSizes="@(new string[] { "15", "25", "50", "100", "All" })"></e-grid-pagesettings>

    <e-grid-editSettings allowAdding="true" allowDeleting="true" allowEditing="true" mode="Normal" showConfirmDialog="true"></e-grid-editSettings>

    <e-grid-selectionsettings mode="Row" type="Multiple"></e-grid-selectionsettings>

    <e-grid-columns>

        <e-grid-column field="@nameof(ForeignCityModel.Id)" headerText="Id" isPrimaryKey="true" isIdentity="true" visible="false"></e-grid-column>

        <e-grid-column field="@nameof(ForeignCityModel.City)" headerText="City"></e-grid-column>

        <e-grid-column field="@nameof(ForeignCityModel.CountryId)" headerText="Country" foreignKeyValue="Name" foreignKeyField="Id" dataSource="@Model.Countries"></e-grid-column>

        <e-grid-column field="@nameof(ForeignCityModel.IsUSOrCanada)" headerText="Is US or Canada"></e-grid-column>

        <e-grid-column field="@nameof(ForeignCityModel.Modified)" headerText="Modified" allowEditing="false"></e-grid-column>

    </e-grid-columns>

</ejs-grid>

```

[Lukas Lapinskas]

I got it working. The issue was both with the Country and Is US or Canada columns. The binding breaks if Country column is set up correctly but Is US or Canada column is not a dropdown edit type. However, if the Country column is removed, then the binding works even if the Is US or Canada column doesn't have dropdown edit type. Very weird.

Anyways, here's the solution:

<e-grid-column field="@nameof(ForeignCityModel.CountryId)" headerText="Country" foreignKeyValue="Name" foreignKeyField="Id" dataSource="@Model.Countries"></e-grid-column>
<e-grid-column field="@nameof(ForeignCityModel.IsUSOrCanada)" headerText="Is US or Canada" editType="dropdownedit" foreignKeyField="Value"
                foreignKeyValue="Text" dataSource="@(new List<object> { new { Text = "Yes", Value = true }, new { Text = "No", Value = false } })"></e-grid-column>

[Aishwarya Rameshbabu]

Hi Lukas Lapinskas,

Greetings from Syncfusion support.

Based on the information provided, it appears that you are experiencing an issue with updating edited values in the Grid when a foreign key column exists. We have created a simple example using the shared details, where the reported issue does not occur. Even without specifying the edit type for the "Is US or Canada" column, the update action functions correctly. Additionally, the data updates properly regardless of the presence of the foreign key column in the Grid. Please note that the Grid will always use dropdownedit type for foreign key columns to ensure accurate data mapping during CRUD operations.

Kindly refer to the sample attached sample and video demonstration for further details.

If you continue to experience any issues, kindly provide the following details.

Screenshots:

    Please share a screenshot of the network tab to verify the payload information. Also, include any console errors observed.

Syncfusion Package Version:

    Specify the exact version of the Syncfusion package you are currently using.

Sample and Video Demonstration:

    Please provide a simplified sample that replicates the reported issue or attempt to reproduce the issue using the sample provided. Additionally, include the video demonstrating the issue replicating process. 

Providing these details will enable us to conduct a comprehensive analysis and deliver a more precise resolution.

 

Regards,

Aishwarya R

Attachment: 197987SampleAndVideo_d3e2a4ed.zip