No data-val* attributes with Partial Views

I have a view with Html.BeginForm() that calls a partial view(mentioned below and has no Form) passing in the main viewmodel. The Model has Data Annotation.

On initial load of the page validation works perfectly if I try to submit without selecting proper values.

I also have another button on the page that if clicked loads another instance of the same partial view on the page, using $.ajax() post to Controller, which returns just the PartialView, and append it to the existing div.

If I now try to submit the form these dynamic controls, although they are bound to the same model and although I have set the correct .ValidationMessageFor helpers, no validat开发者_运维技巧ion appears for them since the controls do not appear to be generated with the data-val* attributes.

i used fiddler and found that $.ajax post to controller , generates the partial view with simple and no ValidationMessage where generated as well.Hence cant use unobtrusive javascript for dynamic controls that got added.

Is it necessary to have the View inside a form always?, in that case i will have nested forms and that will not work as well.

EDIT 1 : As mentioned by Adam Tuliper in the question ViewContext.FormContext = new FormContext generated the partial view with all data-val* attributes. Hence answers my above question. Now the validation for dynamic content was not firing. so as per Erick (in the Comment section), i removed form validator [form.removeData(‘validator’);] and then it started validating dynamic content as well.

Below is the partial View

         <div id="divVehicleInfo">                        
        <fieldset>
            <legend>Vehicle Information</legend>
          @for (var i = 0; i < Model.QuoteInput.Vehicle.Count(); i++)
          {
            <div class="editor-label">
                @Html.LabelFor(model => model.Vehicle[i].VehicleMake)
            </div>
            <div class="editor-field">
                @Html.EditorFor(model => model.Vehicle[i].VehicleMake)
                @Html.ValidationMessageFor(model => model.Vehicle[i].VehicleMake)
            </div>

             <div class="editor-label">
                @Html.LabelFor(model => model.Vehicle[i].VehicleModel)
            </div>
            <div class="editor-field">
                @Html.EditorFor(model => model.Vehicle[i].VehicleModel)
                @Html.ValidationMessageFor(model => model.Vehicle[i].VehicleModel)
            </div>

          }                              
        </fieldset>                
        </div>

And this is the Model for Partial View

    public class Vehicle
    {
        public int VehicleID { get; set; }

        [Required]
        [DisplayName("Vehicle Make")]
        public string VehicleMake { get; set; }

        [Required]
        [DisplayName("Vehicle Model")]
        public string VehicleModel { get; set; }

    }

You need to include the unobtrusive validation script in the partial view.

<script src="@Url.Content("~/Scripts/jquery.validate.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>

A partial View does not inherit the scripts of a page it is placed in unless they are executed again once the dom is upadated.

As mentioned by Adam Tuliper in the question ViewContext.FormContext = new FormContext generated the partial view with all data-val* attributes. Hence answers my above question. Now the validation for dynamic content was not firing. so as per Erick (in the Comment section), i removed form validator [form.removeData(‘validator’);] and then it started validating dynamic content as well.