how to save two file from two different html file upload in same function using angularjs and MVC3

here is my all code i am trying to upload small image and large image separate but angularjs not let me allow to do this, it only taking one file but not taking other one. plz anyone help with this. thanks in advance.

<div ng-app="eventModule" >
<div ng-controller="eventController">
<div>
<span >Thumbnail Image</span>
<input type="file" id="fileToUpload" onchange="angular.element(this).scope().selectThumbnail(this.files)"  accept="image/*"  />
</div>
<div>
<span >Large Image</span>
<input type="file" onchange="angular.element(this).scope().selectLargeImage(this.files)" class="LargeImageSubCategory" />
</div>
</div>
<span  data-ng-click="SaveFile()">Submit</span>
</div>

<script>
    var eventModule = angular.module('eventModule', []);
    eventModule.controller('eventController', function ($scope,ArticleService, $http, $sce) {
        $scope.selectThumbnail = function (file) {
            $scope.SelectedThumbnail = file[0];
        }

        $scope.selectLargeImage = function (file) {
            $scope.SelectedLargeImage = file[0];
        }

        $scope.SaveFile = function () {
            $scope.IsFormSubmitted = true;
            $scope.Message = "";
            ArticleService.UploadFile($scope.SelectedThumbnail, $scope.SelectedLargeImage).then(function (d) {
                alert(d.Message);
                ClearForm();
            }, function (e) {
                alert(e);
            });
         };
    });
    eventModule.service("ArticleService", function ($http, $q) {
        this.UploadFile = function (Thumbnail, LargeImage, TitleHeading, Topic, SmallDesc, LargeDesc) {
            var formData = new FormData();
            formData.append("Thumbnail", Thumbnail);
            formData.append("LargeImage", LargeImage);
            // here when i am trying to send two files so controller is not called
            //and function is breaking and alert is comming "File Upload Failed"
            formData.append("TitleHeading", TitleHeading);
            formData.append("Topic", Topic);
            var defer = $q.defer();
            $http.post("/Articles/SaveFiles", formData,
            {
               withCredentials: true,
               headers: { 'Content-Type': undefined },
               transformRequest: angular.identity
            }).success(function (d) {
               defer.resolve(d);
            }).error(function () {
               defer.reject("File Upload Failed!");
            });
            return defer.promise;
         }
    });
</script>

//And My ArticlesController.cs code is

[HttpPost]
public JsonResult SaveFiles(string TitleHeading, string Topic)
{
string Message, fileName, actualFileName;
Message = fileName = actualFileName = string.Empty;
bool flag = false;
if (Request.Files != null)
{
var file = Request.Files[0];
actualFileName = file.FileName;
fileName = Guid.NewGuid() + Path.GetExtension(file.FileName);
int size = file.ContentLength;
try
{
file.SaveAs(Path.Combine(Server.MapPath("~/UploadedFiles"), fileName));
using (TCDataClassesDataContext dc = new TCDataClassesDataContext())
{
Article insert = new Article();
insert.ArticleId = Guid.NewGuid();
insert.TitleHeading = TitleHeading;
insert.SmallImagePath = fileName;
dc.Articles.InsertOnSubmit(insert);
dc.SubmitChanges();
Message = "File uploaded successfully";
flag = true;
}
}
catch (Exception)
{
Message = "File upload failed! Please try again";
}}
return new JsonResult { Data = new { Message = Message, Status = flag } };
}

Answers


You are appending the files to the formdata, thus you need to specify the Thumbnail and LargeImage as parameters of your MVC controller. Please see below:

    [HttpPost]
    public JsonResult SaveFiles(
          HttpPostedFileBase thumbnail
        , HttpPostedFileBase largeImage
        , string titleHeading
        , string topic)
    {
        string Message, fileName, actualFileName;
        Message = fileName = actualFileName = string.Empty;
        bool flag = false;

        if (thumbnail != null && thumbnail.ContentLength != 0) 
        {
            SaveFile(thumbnail);
        }

        if (largeImage != null && largeImage.ContentLength != 0)
        {
            SaveFile(largeImage);
        }

        return new JsonResult { Data = new { Message = Message, Status = flag } };
    }

    private void SaveFile(
        HttpPostedFileBase httpFile) 
    {
        var actualFileName = httpFile.FileName;
        var fileName = Guid.NewGuid() + Path.GetExtension(httpFile.FileName);
        int size = httpFile.ContentLength;
        try
        {
            httpFile.SaveAs(Path.Combine(Server.MapPath("~/UploadedFiles"), fileName));
            using (TCDataClassesDataContext dc = new TCDataClassesDataContext())
            {
                Article insert = new Article();
                insert.ArticleId = Guid.NewGuid();
                insert.TitleHeading = TitleHeading;
                insert.SmallImagePath = fileName;
                dc.Articles.InsertOnSubmit(insert);
                dc.SubmitChanges();
                Message = "File uploaded successfully";
                flag = true;
            }
        }
        catch (Exception)
        {
            Message = "File upload failed! Please try again";
        }
    }

Need Your Help

Android - AudioRecord: Detect a pulse-width modulated signal over the audio jack (mic)

java android performance android-audiorecord

I try to dectect a square wave signal over the audio jack in near real time (Mic). For that reason I use the class AudioRecord in streaming mode. But my problem is, that my phone (mic) always works