Wednesday, June 24, 2015

Grid PopupEdit with file Upload

Using the grid in popup edit mode requires a template for the popup screen, here is that template:
 <div>  
   <div class="editor-label">  
     <b>Your Saved Search to Use:</b>  
   </div>  
   <div class="editor-field">  
     @Html.EditorFor(model => model.savedSearchID,"SavedSearchesTemplate")  
     @Html.ValidationMessageFor(model => model.savedSearchID)  
   </div>  
 </div>  
 @Html.HiddenFor(m => m.ApplicationFile);  
 <div>  
   <div class="editor-label">  
     <b>Project Plan Document:</b>  
   </div>  
   <div class="editor-field">  
       @(Html.Kendo().Upload()  
       .Name("files")  
     .Events(events => events.Success("onSuccess"))  
     .Multiple(false)  
      .Async(a => a.Save("Save", "Projects").AutoUpload(true)  
    ))  
   </div>  
 </div>  



The trick to getting the value is to use the onSuccess event of the upload control to set the hidden field to the value of the uploaded file.
  function onSuccess(e) {  
     $("#ApplicationFile").val(getFileInfo(e));  
   }  



Then in the Grid Save Event, update the "model" to the value of this hidden field.



  function saving(e) {  
     var uid = $(".k-edit-form-container").closest("[data-role=window]").data("uid"),  
   model = $("#myprojectsgv").data("kendoGrid").dataSource.getByUid(uid);  
     var thefile = $("#ApplicationFile");  
     model.set("ApplicationFile",thefile.val());  
   }  

No comments:

Post a Comment