2014-02-12 6 views
2

Что я делаю неправильно? Я получаю следующую ошибку. Я использую MVC, но не использую оболочки MVC.Kendo Template Invalid in Grid

Uncaught Error: Invalid template:' 
<form action="/Intranet/GalleryFile/Edit" data-ajax="true" data-ajax-method="Post" data-ajax-mode="replace" data-ajax-update="#slideoutmenu" id="form1" method="post">      <input type="hidden" id="fileID" name="fileID" value='#= fileID #' /> 
<input type="submit" value="Save" class="btn btn-default" /> 
</form> ' Generated code:'var o,e=kendo.htmlEncode;with(data){o='\n<form action="/Intranet/GalleryFile/Edit" data-ajax="true" data-ajax-method="Post" data-ajax-mode="replace" data-ajax-update="';slideoutmenu" id="form1" method="post">    <input type="hidden" id="fileID" name="fileID" value=';o+='= fileID ';' /> 
      <input type="submit" value="Save" class="btn btn-default" /> 
</form> ;o+=;}return o;' 

JavaScript:

$(document).ready(function() { 

     var dsGalleryItemFile = new kendo.data.DataSource({ 
      transport: { 
       read: "@Url.Content("~/Intranet/GalleryItemFile/ListFiles/")@Model.galleryItemID" 
      }, 
      // determines if changes will be send to the server individually or as batch 
      batch: false, 
      schema: { 
       model: { 
        id: "fileID", 
        fields: { 
         fileID: { 
          nullable: true 
         }, 
         filename: {}, 
         fileType: { defaultValue: {fileTypeID: 1, fileType: "Web JPEG"} }, 
         fileType: {}, 
         width: { type: "number" }, 
         height: { type: "number" }, 
         } 
        } 
       } 
     }); 

     $("#gvGalleryItemFile").kendoGrid({ 
      columns: [{ 
       field: "filepath", 
       title: "File Upload", 
       width:"250px",//, 
       //template: "<img src='#=filepath.filepath#' />" 
      }, { 
       field: "fileType", 
       title: "File Type", 
       template: "#=fileType.fileType#", 

      }, { 
       field: "width", 
       title: "Width(px)", 
       format: "{0:n0}", 
       width: "110px" 
      }, { 
       field: "height", 
       title: "Height(px)", 
       format: "{0:n0}", 
       width: "110px" 
      }, { 
       field: "fileID", 
       title: "", 
       template: kendo.template($("#gridEditButtonTemplate").html()) 
      }], 
      dataSource: dsGalleryItemFile 
     }); 


    });  

Шаблон:

<script type="text/x-kendo-template" id="gridEditButtonTemplate"> 
     @using (Ajax.BeginForm("Edit", "GalleryFile", null, new AjaxOptions { UpdateTargetId = "slideoutmenu", InsertionMode = InsertionMode.Replace, HttpMethod = "Post" })) 
     { 
      <input type="hidden" id="fileID" name="fileID" value='#= fileID #' /> 
      <input type="submit" value="Save" class="btn btn-default" /> 
     } 
</script> 

Это даже не доходя сторону MVC вещей, так что я не включая этот код. Он просто не прочитает шаблон в моем столбце сетки.

ответ

2

Символ # имеет особое значение в шаблонах кендо и, следовательно, его нужно экранировать, если вы хотите использовать его как обычный символ. Ваш Ajax.BeginForm создает атрибут

data-ajax-update="#slideoutmenu" 

, который является тем, что ломает шаблон. Это должно быть

data-ajax-update="\#slideoutmenu" 

Я не уверен, есть ли способ обойти это с помощью помощников Html. Самое простое исправить будет использовать простой Html.

Смежные вопросы