We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Post back grid data

Hello,

said that I am new to Syncfusion asp.net core (I used a lot WPF controls, anyway) and to asp.net core itself, I am trying to use a datagrid in a page to display data from a collection of objects which is a property of the page model.

The collection in my model is like:

public class Visite

{

[ ... ]

public int Id { get; set; }

public string VisitId { get; set; }

public List<OperazioniVisita> Operazioni { get; set; } = new List<OperazioniVisita>();

public DateTime DataProgrammata { get; set; }
public DateTimeOffset TimestampRegistrazione { get; set; }
public string UsernameRegistrazione { get; set; }
[ ... ]
}

OperazioniVisita is the following model:

public class OperazioniVisita
    {
        public long Id { get; set; }

        public long IdVisita { get; set; }

        public string CodiceImballo { get; set; }

        public int NumeroMovimentazioni { get; set; }

        public int NumeroAperture { get; set; }
    }

In the Controller I have: 

public async Task<IActionResult> EditDetailsVisit(string index)
{
    try
    {
        HttpClient client = new HttpClient();
        HttpRequestMessage request = [ ... ]
    [ ... ]
        Visite v = null;
        var resp = await client.SendAsync(request);

        if (resp.IsSuccessStatusCode)
        {
            string res = await resp.Content.ReadAsStringAsync();
            v = JsonConvert.DeserializeObject<Visite>(res);

            return View(v);
        }
[ ... ]

to render the view, and: 

public async Task<IActionResult> SaveDetailsVisit(Visite visita, string save) 
     [ ... ]
}

for the post back.

In the .cshtml I have:

<div class="col-lg-9 control-section">

                                                            @{                                                                
                                                                var ImballiDropDownList = new Syncfusion.EJ2.DropDowns.DropDownList()
                                                                {
                                                                    DataSource = @NewVisitViewModel.Imballi,
                                                                    Query = "new ej.data.Query()",
                                                                    AllowFiltering = true,
                                                                    Fields = new Syncfusion.EJ2.DropDowns.DropDownListFieldSettings() { Value = "Codice", Text = "Descrizione" },
                                                                    BeforeOpen = "beforeOpen"
                                                                };
}

[ ... ] 
<ejs-grid id="Grid" dataSource="@Model.Operazioni" 
                toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Update", "Cancel" })" 
                allowPaging="true">
                
     <e-grid-editSettings allowAdding="true" allowDeleting="true" allowEditing="true" newRowPosition="Top"></e-grid-editSettings>
     <e-grid-pagesettings pageCount="5"></e-grid-pagesettings>
     <e-grid-columns>
          <e-grid-column field="Id" headerText="Op. ID" visible="false"></e-grid-column>
          <e-grid-column field="IdVisita" headerText="Visit Id" visible="false"></e-grid-column>
          <e-grid-column field="CodiceImballo" headerText="Imballo" textAlign="Center" dataSource="@NewVisitViewModel.Imballi"
                                    foreignKeyField="Codice" foreignKeyValue="Descrizione"
                                    editType="dropdownedit" edit="@(new { @params = ImballiDropDownList } )">
          </e-grid-column>
          <e-grid-column field="NumeroMovimentazioni" headerText="Movimentati" 
                                    textAlign="Center" width="120"
                                    validationRules="@(new { required=true, number=true})">
          </e-grid-column>
          <e-grid-column field="NumeroAperture" headerText="Aperti" 
                                    textAlign="Center" width="100"
                                    validationRules="@(new { required=true, number=true})">
          </e-grid-column>
     </e-grid-columns>
 </ejs-grid>
[ ... ]

When the page appears everything is fine and the items of the model property "Operazioni" are visibile:



I can also add, inline edit or delete rows without any problem.

But in my page I also have other data and a submit button to post back data to the controller. When I do the post back, the model is posted back with the Operazioni property in the posted back model is empty:



Now, I am sure this is because I am missing something big... but I read a lot of threads in your forum and all the samples in the datagrid documentation without reaching a point.


but I wasn't able to adapt these solutions to my case.

Could you please give me a hand ?

Thank you
Giacomo

3 Replies

SS Seeni Sakthi Kumar Seeni Raj Syncfusion Team September 25, 2019 10:14 PM

Hi Giacomo,  

Greetings from Syncfusion.  

Before proceeding with this ticket, we would like to collect some information from you. Please share the following details to analyze the problem at our end.  

  1. Do you posting the Grid Form data to the server-end using SaveDetailsVisit method?
  2. On which action, you are posting the data to the server-end
  3. Are you using an external form or Grid form
  4. Complete code example of the Grid with the related form details
  5. How action has been submitted to the server

Regards,  
Seeni Sakthi Kumar S 



GG Giacomo Galletto replied to Seeni Sakthi Kumar Seeni Raj September 25, 2019 11:13 PM

Hi Giacomo,  

Greetings from Syncfusion.  

Before proceeding with this ticket, we would like to collect some information from you. Please share the following details to analyze the problem at our end.  

  1. Do you posting the Grid Form data to the server-end using SaveDetailsVisit method?
  2. On which action, you are posting the data to the server-end
  3. Are you using an external form or Grid form
  4. Complete code example of the Grid with the related form details
  5. How action has been submitted to the server

Regards,  
Seeni Sakthi Kumar S 


Hello,


my fault, I should imagine that it is very difficult for you to investigate without more code.

I can't send a complete project because it's quite big but I have prepared a zip with all the code involved in this.

The sequence is the following:
  • in the Index view a list of Visite is displayed; each item comes with a button to access to a details view
  • the details view displays the complete set of data of the selected Visite item in read-only mode; the page also has a button to access to an edit mode page, passing the Visite item as model
  • the edit page is the one where the grid displays the list of Operazioni, which is a inner property of Visite item; the page has also a Cancel button and a Save button, this last (is supposed to) post back edited Visite item data, including the list of Operazioni (eventually edited with the grid) 
  • posting back to the controller (yes, with the SaveDetailsVisit method) all the data are properly set, except for the list of Operazioni, which comes back empy
Hope this clarify a bit.

Best regards
Giacomo

Attachment: Sample_26092019_001_c20d2426.zip


SS Seeni Sakthi Kumar Seeni Raj Syncfusion Team September 27, 2019 05:49 AM

Hi Giacomo, 

Thanks for your update, 

From your query, we found that you want to send the Grid edited data’s to server side through the form submit. But Grid is not in part of the form control. So we cannot access the Grid values by using the form submit action. So we can achieve this requirement by using the following way. First you need to create the input elements within the form for each Grid fields after that you need assign the edited row values to the created input elements. So you can access this input element values from the controller. Please hide this input elements if you do not want to show that in view page. 

Regards, 
Seeni Sakthi Kumar S 


Loader.
Live Chat Icon For mobile
Up arrow icon