Click here to Skip to main content
15,940,921 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
Hi all,

New to MVC development. Struggling to load a partial view for 'Create' with prepopulated field values from Parent View.

Basically I have a main View, and within the Main view I have a partial view which displays a grid with Edit button and Add button.

This is how I am loading my Partial view in my Parent view.
var url = '@Url.Action("Index", "MyModel")';
$.ajax({
    url: url ,
    type: "get",
    success: function (data) {
        $('#partialPlaceHolder').html(data);
        $('#partialPlaceHolder').fadeIn('fast');
    },
    error: function (xhr, status, error) {
        alert(xhr.responseText);
    }
});


The Edit button loads the 'Edit' View and the Add button loads the 'Create' view, pretty standard MVC.

But now my main issue is, I want to prepopulate the 'Create' view when 'Add' button is clicked with values from the Parent View. So the users dont have to input the values into them again.

My model consists of 3 items

 public class MyModel
    {

        public int ID { get; set; }

        [DisplayName("My Note")]      
        [Required(ErrorMessage = "Note cannot be left blank.")]
        public string MyNote { get; set; }
               
        [DisplayName("My Value")]
        [Required(ErrorMessage = "Value is required")]
        [StringLength(12, MinimumLength = 12)]
        public string MyValue { get; set; }

        [DisplayName("My List")]
        [Required(ErrorMessage = "Please select an item.")]
        public int MyList{ get; set; }
    
        public virtual MyListModel MyLists { get; set; }
}


When the Add button is clicked, I want the 'Create' view to pre populate the 'My Value' and 'My List' item from the Parent View and populate the 'create' view when its loaded. So the user would only have to fill in the 'My notes' text box and click on 'Create' button to save the changes. Is something like this possible? Any help would be appreciated.

Below is the Action result code in my - Create Controller.

What I have tried:

[ValidateAntiForgeryToken]
[HttpPost]
public ActionResult Create(MyModel mymodel)
{
    try
    {
        if (ModelState.IsValid)
        {

            try
            {

                db.MyModel.Add(mymodel);
                db.SaveChanges();
                //Populating droplist
                ViewBag.MyList = new SelectList(db.MyList, "ID", "MyText", mymodel.MyList);
                return Json(new { success = true });
            }
            catch (Exception e)
            {
                throw e;
            }

        }


        return Json(new
        {
            success = false,
            responseText = ModelState.Keys.SelectMany(k => ModelState[k].Errors)
                          .Select(m => m.ErrorMessage).ToList()
        });
    }
    catch (Exception ex)
    {

        return Json(new { success = false, responseText = "Error creating new note. " + ex.Message });
    }

}
Posted
Updated 16-Sep-16 3:18am
v2

I'm not really sure of your approach as the code you're posting doesn't make a whole lot of sense.

In a nut shell you have to call an action on a controller via ajax, and pass the action a model which will be created in js from the data on the parent view. You can gather this data dynamically via js or just make the parent view generate hard-coded js that makes the model.

The below link shows how you pass a model to an action and inject the results into the page, just adapt as needed.

asp.net mvc - Pass Model To Controller using Jquery/Ajax - Stack Overflow[^]
 
Share this answer
 
Hi thanks for your reply. I have managed to get the values to the model without using ajax post.

I have basically hidden the fields which i wanted to auto-populate and then when the 'Add' button is clicked on the 'Create' view I am passing the values to the model (basically adding it to the submit form). Below is the code which worked.

$('body').on('click', '#btnAdd', function (e) {

           var myValue = $('#myValue').val(); //from the parent view
           var myListId = $('#mylist').val(); //from the parent view
          //Bind the above values to the form, which gets added to the model
           $("#frmCreateNote input[name=myvalue]").val(myValue);
           $("#frmCreateNote #mylist").val(myListId).attr("selected", "selected");
       });
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900