title: Element not being validated w/ unobtrusive validation after AJAX and dynamic creation using MVC 3 and jQuery
body: <p>Here's my problem...</p>
  
  <p>I have a page that initially renders and displays an AJAX form created using Ajax.BeginForm.  Some criteria is entered and the AJAX form is posted.  A partial view is returned which contains an HTML form created using Html.BeginForm.  </p>
  
  <p>So far so good...  Everything to this point works fine.  My unobtrusive client validation works great on the elements created from the partial view.  My problem happens when I now try to create some dynamic input elements (via jQuery) and insert/append them into the form created by the partial view. I cannot get any unobtrusive client validation to occur on my dynamically created elements.</p>
  
  <p>I have tried: 
    - cloning existing elements, modifying their ids/names and appending them in the DOM.
    - creating html strings and inserting them in the DOM.</p>
  
  <p>After each insert of the dynamic element I have tried calling:
    - $.validator.unobtrusive.parseElement()  [new element]
    - $.validator.unobtrusive.parse() [new container, document, etc]
    - $.validator.unobtrusive.parseDynamicContent() [plug-in] </p>
  
  <p>Here are the jQuery code details...</p>
  
  <pre><code>$("#insert").live("click", function () {
      var html = "&lt;input type='text' value='' name='CustomerNominationVolume' id='CustomerNominationVolume' data-val-required='The Nomination (Dth) field is required.' data-val-number='The field Nomination (Dth) must be a number.' data-val='true' /&gt;&lt;br /&gt;"
      html += "&lt;span class='field-validation-valid' data-valmsg-replace='true' data-valmsg-for='CustomerNominationVolume'&gt;&lt;/span&gt;";
      $("#new").html(html);
  });
  
  $("#parse").live("click", function () {
      $.validator.unobtrusive.parse(document);
  });
  
  $("#validate").live("click", function () {
      var element = $("#CustomerNominationVolume");
      var form = $(element).first().closest('form');
      form.validate().element(element);
  });
  </code></pre>
  
  <p>Any help would be GREATLY appreciated!</p>
  
  <p><strong>EDIT:</strong>
  After doing some additional research and testing I went back to this <a href="http://xhalent.wordpress.com/2011/01/24/applying-unobtrusive-validation-to-dynamic-content/" rel="nofollow">solution</a> to determine why it wasn't working for me.  As it turns out I was inserting new input elements that were part of a list.  Therefore, the name of my new elements would look similar to this:  something[0].id, something[1].id, etc...</p>
  
  <p>These names caused the $.validator.unobtrusive.parseDynamicContent() function to fail on this line:
      $('[name=' + elname + ']').rules("add", args);</p>
  
  <p>I simply changed this to 
      $("[name='" + elname + "']").rules("add", args);</p>
  
  <p>Everything is now working fine...</p>