title: asp.net mvc unobtrusive validation shows validation error message on render
body: <p><strong>Short version:</strong> why is validation message is visible by default when <code>data-valmsg-replace='false'</code>? and how do I fix it?</p>
  
  <p><strong>Details:</strong></p>
  
  <p>In my razor I do:</p>
  
  <pre><code>@Html.TextArea("Description", Model.FormData.Description, new { @class="span12" })
  @Html.ValidationMessage("Description", L("Description is required"))
  </code></pre>
  
  <p>validation message is rendered as (as expected):</p>
  
  <pre><code>&lt;span class="field-validation-valid" data-valmsg-for="Description" data-valmsg-replace="false"&gt;Description is required&lt;/span&gt;
  </code></pre>
  
  <p>and message <strong>is visible</strong> on page initial render. It seems to be by design, but makes no sense (notice <code>data-valmsg-replace='false'</code>).</p>
  
  <p><strong>Questions</strong>    </p>
  
  <ol>
  <li><p>What is a reasoning behind this design decision, specifically, to have error message visible by default when it comes with <code>data-valmsg-replace='false'</code>?  </p></li>
  <li><p>Is there a better solution than adding <code>.field-validation-valid { display: none; }</code></p></li>
  </ol>