1

I have a problem that I frequently deal with using MVC that I can't seem to find an easy solution for.

Very frequently I find myself creating a viewmodel for an object that has a collection of smaller objects.

For instance,

I created a Staff screen where the user adds a staff member to the database. Most of this is fairly straight forward, but then I need to be able to add a credential.

The number of credentials a staff can have is dynamic, so there's a second table with a foreign key referencing the staff, as well as the appropriate credential data.

So my viewmodel has a Staff object, and an IEnumerable of Credential objects.

Currently when the user adds/edits staff in the partialview form, a popup with the credential fields appears. When you save the credential, I manually generate the hidden fields of every single property as hidden html elements using javascript strings, then append it to the appropriate places. It gets really unmanageable.

var hid0 = "<input name=CurrentCredentials.Index type=hidden value='i-" + statid + "'>";
var hid1 = "<input name=CurrentCredentials[i-" + statid + "].StatID id='credentials-statid-" + statid + "' type=hidden value='" + statid + "'>";

...etc to hid7. I also generate a series of tags to display the data on the page. An absolute mess.

It currently works, but there has to be a better way, and I'm about to deal with a very similar problem. I feel like I'm reinventing the wheel. My first instinct was to add a nested form, but my research tells me MVC forbids this, so that's out of the question.

To sum up what I'm looking for: How can I dynamically load/save objects in the partial view, without losing the data on HTTPPOST?

Ricardo Pontual
  • 3,749
  • 3
  • 28
  • 43
  • Have you tried using an ajax post instead of a form post? – nurdyguy May 18 '17 at 18:25
  • Preferable way , you use jquery ajax for this purpose – Asif Raza May 18 '17 at 18:39
  • 1
    Sounds like you're trying to do too much on a single form. Nesting forms creates invalid HTML but you can have multiple forms on the page. As others have suggested, AJAX will help break up problem into manageable parts without navigating away from your view. – Jasen May 18 '17 at 18:55
  • Playing around with ajax forms. I absolutely agree that it feels like my form does far too much work, but the problem is that I want the entire form to save in one post. I don't want the user to have to sit around for the first form to finish before the second form is ready. Is there a way to send it all in one piece? (I also might be completely misunderstand how all this works. I'm obviously pretty new. Hopefully this was coherent) – Umpty MaDoo May 18 '17 at 19:19
  • Also, I'm not sure how multiple forms would really resolve the issue. If I'm adding a staff, a primary key hasn't been created yet, and that key is needed in the creation of the credential. I wouldn't want either object to be saved to the database without the other. – Umpty MaDoo May 18 '17 at 19:26
  • With ajax you can post whatever you want (up to a limit based on total amount of data transferred). You can wrap several forms worth of data into a single json object, send it up to the server and consume it. – nurdyguy May 18 '17 at 19:33
  • ooooh that sounds exactly like what I want. How would I go about doing that? I'm creating my forms primarily with razor code, so it would be ideal if I could copy and paste my existing razor fields into a new form. Could you provide a basic example? – Umpty MaDoo May 18 '17 at 19:46
  • That's a very large question... You'll still use razor for some stuff (initial page load etc). Here is a fairly basic example you can you to get you started: https://chsakell.com/2013/05/10/ajax-and-jquery-in-asp-net-mvc/ – nurdyguy May 18 '17 at 19:51
  • 1
    I suggest you look at using the `BeginCollectionItem` helper method - refer [this answer](http://stackoverflow.com/questions/40539321/a-partial-view-passing-a-collection-using-the-html-begincollectionitem-helper/40541892#40541892) for an example –  May 18 '17 at 22:04

0 Answers0