2016-08-18 11 views
0

私はモーダルウィンドウの問題でkendoUploadウィジェットを持っています。ウィンドウを閉じてから、kendoUploadウィジェットを開くと、その一部のいくつかのインスタンスが作成されるようになります。したがって、ウィンドウを開いて閉じると同時に、多くのレコードとアップロードを行います。何が問題を引き起こす可能性がありますか。私はkendoUploadウィジェットを破棄しようとするたびにウィンドウが閉じても運が無かった。たぶん、間違った構文のため...任意のアイデア? THX!KendoUploadウィジェット重複問題

enter image description here

今は閉じて、再びモーダルウィンドウを開く - 今、私はファイルをアップロードしよう>

enter image description here

を - >

enter image description here

HTML:

<div id="UploadFiles" style="display: none"> 
<h3>Upload your files:</h3> 
<div class="demo-section k-content"> 
    <input name="files" id="files" type="file"/> 
</div> 
<br/> 
<h3>Current files on server:</h3> 
<div id="CurrentFilesOnServer"> 
    <ul class="CurrentFilesOnServerList"> 

    </ul> 
</div> 

モーダルウィンドウ:

// Modal Window Upload file to server 
    var uploadFilesWindow = $("#UploadFiles").kendoWindow({ 
     width: "350px", 
     modal: true, 
     title: "Upload file to server:", 
     actions: [ 
      "Pin", 
      "Minimize", 
      "Maximize", 
      "Close" 
     ], 
     close: function() { 

     } 
    }).data("kendoWindow"); 

JSアップロードセクション:

// upload file on server 
    $(".k-grid-upload") 
     .click(function() { 
      uploadFilesWindow.center().open(); 

      function upload() { 

     $("#files") 
       .kendoUpload({ 
        async: { 
         saveUrl: "/api/Grid/UploadFileOnServer", 
         removeUrl: "", 
         autoUpload: true 
        } 
      } 
     }); 
}); 

C#のコントローラ:

// Upload file on server 

    public string UploadFileOnServer() 
    { 

     var file = HttpContext.Current.Request.Files.Count > 0 ? 
    HttpContext.Current.Request.Files[0] : null; 

     if (file != null && file.ContentLength > 0) 
     { 
      var fileName = Path.GetFileName(file.FileName); 

      var path = Path.Combine(
       HttpContext.Current.Server.MapPath("~/uploads"), 
       fileName 
      ); 

      file.SaveAs(path); 
     } 

     return file != null ? "/uploads/" + file.FileName : null; 


    } 

答えて

0

それがアップロードウィジェットを初期化コードは、初期化及び観察問題を複製に導く、複数回実行されることがかなり確実です。 DOM(唯一の例外はWindowです)から生成されるHTMLマークアップを削除しません剣道UIウィジェットを破棄

http://docs.telerik.com/kendo-ui/intro/installation/jquery-initialization#duplicate-initialization

ので、アップロードを破壊することは助けにはなりません。

http://docs.telerik.com/kendo-ui/intro/widget-basics/destroy

あなたはアップロードがちょうど窓のように、一度だけ初期化されるように、コードをリファクタリングする必要があります。または、ウィンドウ全体を破棄して再作成しますが、DOMが削除されることを覚えておいてください。追加する必要があります。

http://docs.telerik.com/kendo-ui/controls/layout/window/overview#configuration-Destroy

+0

thxそれほど助けになりました! (私はインスタンスを1回だけ初期化しました)。 –

0

は、このようなコードを変更し、今では正常に動作します:

初期化kendoUpload:

$(".k-grid-upload") 
     .click(function() { 
      uploadFilesWindow.center().open(); 
      kup(); 
     }); 
:インスタンスをkendoUpload &コール

var kup = $("#files") 
     .kendoUpload({ 
      async: { 
       saveUrl: "/api/Grid/UploadFileOnServer", 
       removeUrl: "", 
       autoUpload: true 
      } 
     }); 

開き窓

(Thxから@dimodi!)