Send data to a controller from a view using viewModel -ASP.NET MVC5 classes

Question

I am working on ASP.NET MVC-5. I got the form in a partial Razor view, and it requires several models, so I use ViewModel; putting all classes (models) in that as follows

public class QualificationViewModel
{    
    public Qualification _Qualification;

    //public Subject _Subject;

    //public FeeScheme _FeeScheme;

}

Now for the time I use only the qualification model to check my code, but I can not send data from the view to the controller method. I get a null value when debugging in the controller method

  [HttpGet]
    public ActionResult CreateNewQualification()
    {
        return PartialView("PartialQualification_Create");

    }

    [HttpPost]
    public ActionResult CreateNewQualification(QualificationViewModel newQualificationData)
    {
        try
        {
            if (ModelState.IsValid)
            {
                //code here...
            }
        }
        catch (DataException ex)
        {
            ModelState.AddModelError("", "Unable To Create New Qualification!" + ex);
        }

        return RedirectToAction("QualificationHome");
    }

I use the jQuery Ajax method to publish data, in the same way I was able to send data for one model class ....

function submit_createNewQualification()
{      
    alert(JSON.stringify($("#NewQualificationForm").serializeObject()));

    $.ajax({
        type: "Post",
        url: "/Qualification/CreateNewQualification",
        dataType: "json",
        contentType: "application/json; charset=utf-8",
        data: JSON.stringify({ newQualificationData: $("#NewQualificationForm").serializeObject() }),
        success: function (data) {
            if (data == true) {
                window.location = "/Qualification/QualificationHome";
            }
        },
        error: function (jqXHR, textStatus, errorThrown) {
        }
    });

}

and I have the following form ...

 @model DatabaseLayer.ViewModels.QualificationViewModel

  @using (Html.BeginForm("CreateNewQualification", "Qualification", FormMethod.Post, new { id = "NewQualificationForm" }))
    {
        @Html.AntiForgeryToken()
     <div class="form-group">
        @Html.LabelFor(model => model._Qualification.QualificationTitle, new { @class = "control-label col-md-3" })
           <div class="col-md-6">
             @Html.EditorFor(model => model._Qualification.QualificationTitle)
             @Html.ValidationMessageFor(model => model._Qualification.QualificationTitle)
           </div>
           </div>

           <div class="form-group">
              @Html.LabelFor(model => model._Qualification.Active, new { @class = "control-label col-md-3" })
             <div class="col-md-6 custom-checkBox-block-1">
               @Html.EditorFor(model => model._Qualification.Active)
               @Html.ValidationMessageFor(model => model._Qualification.Active)
              </div>
           </div>

     <div class="form-group">
        <div class="col-md-offset-2 col-md-10">
             <input type="submit" value="Create Qualification" onclick="submit_createNewQualification()"  class="btn btn-default" />
         </div>
       </div>
}

many thanks...

Answer 1

public class QualificationViewModel
{    
   public Qualification _Qualification {get; set;}

//public Subject _Subject;

//public FeeScheme _FeeScheme;

}

[HttpGet]
public ActionResult CreateNewQualification()
{
    var Model = new QualificationViewModel();
    return PartialView("PartialQualification_Create",model);

}

Answer 2

, JSON , , MVC :

data: $("#NewQualificationForm").serialize()