如何将kendo验证器消息span元素置于被验证的输入下方？

我试图弄清楚这一点。所有我看到的例子中，使用手动插入如何将kendo验证器消息span元素置于被验证的输入下方？

的html与input和span元件我有以下代码产生形式和其datepicker元素动态：

@using (Html.BeginForm("Reload", "FileDate", FormMethod.Post, new { returnUrl = this.Request.RawUrl, id = "DateForm", onsubmit = "return ValidateDate();" })) 
{ 
    @(Html.Kendo().DatePicker() 
     .Name("Date") 
     .Value(Session["FileDate"] == null ? DateTime.Now : Convert.ToDateTime(Session["FileDate"].ToString())) 
     .Events(e => e 
       .Change("datepicker_change") 
     ) 
    ) 
    @Html.Hidden("returnUrl", this.Request.RawUrl) 

    <script> 
      function datepicker_change() { 
       if(ValidateDate()){ 
        $("#DateForm").submit(); 
       } 
      } 
    </script> 
    }

当产生形式，我有在网页下面的代码：

这是一个验证：

<script> 
     $(document).ready(function() { 
      $("#mainMenu").kendoMenu(); 
      $("#Date").attr('required', 'required'); 
      $("#Date").attr('data-WrongFormat-msg', 'Date Format is Wrong'); 
      var validator = $("#container").kendoValidator({ 
        rules: { 
        WrongFormat: function (input) { 
         if (input.is("[data-role=datepicker]")) { 
          var dateBox = input.data("kendoDatePicker"); 
          return input.data("kendoDatePicker").value(); 
         } else { 
          return true; 
         } 
        } 
       } 
      }) 
     }); 
     function ValidateDate() 
     { 
      var validator = $("#container").data("kendoValidator"); 
      if (validator.validate()) { 
       return true; 
      } 
      else 
      { 
       return false; 
      } 
     } 
</script>

当我提供了不正确的输入或没有输入可言，我得到的span正确的消息。然而，这种跨部修改了页面的布局：