2017-08-16 18 views
0

最初に、ここではすべてのページを試しましたが、何も助けません。だからこれは他のすべてのバスのように見えるAjax/Jsonがsuccesの後にページをリフレッシュするのを防ぐ

私は単に画像が保存されているファイルアップローダーを望んでいて、画像のIDを文字列として隠し入力フィールドに戻すだけで、フォームが提出されます。

に関係なく、私は、入力フィールドがここ:( を消える私のコードは

HTML

 <label for="file-uploader" class="custom-file-upload"> 
      <i class="fa fa-cloud-upload fa-5x"></i><br /> Custom Upload 
     </label> 
     <input style="display: none" id="file-uploader" name="file" multiple="" type="file" /> 
     <div id="input-wrapper"> 
      Here comes all input fields 
     </div> 

AJAX/JSON

で作るさわやか用のページを、防ぐことができない何をすべきか
 $("#file-uploader").change(function() { 
      var formData = new FormData(); 
      var totalFiles = document.getElementById("file-uploader").files.length; 
      for (var i = 0; i < totalFiles; i++) { 
       var file = document.getElementById("file-uploader").files[i]; 

       formData.append("file-uploader", file); 
      } 
       $.ajax({ 
        type: "POST", 
        url: '@Url.Action("Fileuploader", "Admin")', 
        data: formData, 
        dataType: 'json', 
        contentType: false, 
        processData: false, 
        success: function (data, e) { 
         $('#input-wrapper').append($('<input>').attr('type', 'hidden').attr('name', 'imagesId').attr('value', data.Id)); 
        }, 
        error: function(error) { 
         alert("error"); 
        } 
      }); 
     return false; 
     }); 

CONTROLLER

public JsonResult Fileuploader(int? pictureId) 
    { 
     db = new ApplicationDbContext(); 
     var name = ""; 
     if (pictureId != null) 
     { 
      var findImage = db.Imageses.Find(pictureId); 
      if (findImage == null) return Json(new { result = "Error" }, JsonRequestBehavior.AllowGet); 
      var filename = findImage.Url.Substring(10); 
      var path = Server.MapPath("~/Uploads/" + filename); 
      if (System.IO.File.Exists(path)) 
      { 
       System.IO.File.Delete(path); 
      } 
      db.Imageses.Remove(findImage); 
      db.SaveChanges(); 
     } 
     if (Request.Files.Count > 0) 
     { 
      for (int i = 0; i < Request.Files.Count; i++) 
      { 
       var file = Request.Files[i]; 
       name = Guid.NewGuid().ToString(); 
       var fileformat = Path.GetExtension(file.FileName); 
       var filename = name + fileformat; 
       var path = Path.Combine(Server.MapPath("~/Uploads/"), filename); 
       file.SaveAs(path); 
      } 
      for (int i = 0; i < Request.Files.Count; i++) 
      { 
       var file = Request.Files[i]; 
       var img = new Images() 
       { 
        Filename = file.FileName, 
        DateCreated = DateTime.Now, 
        Url = "~/Uploads/" + name 
       }; 
       db.Imageses.Add(img); 
       db.SaveChanges(); 
      } 
     } 

     return Json(new { result = "Sucess", Id=name }, JsonRequestBehavior.AllowGet); 
    } 
+0

私は、あなたが要求しているものと受け取っているものを見るために、フィドラーをダウンロードすることをお勧めします – Craig

+0

私はこの時点で、フィドラーを試みたことはありません。すべてのデータは正しいです。私の視点では、それがまだajax.succesの後にまだリフレッシュしている理由を理解することだけです。しかし、私はすぐにフィドラーを試してみる:) –

答えて

0

あなたの#ファイルアップローダは、アクションメソッドが書かれたフォームの中にありますか?

アクション属性をオフにしてから、ajax呼び出しのsuccess関数のフォーム要素に属性を追加しようとします。

0

「ブラウザ同期を有効にする」を無効にしたところで動作しています。

関連する問題