Sign up ×
Stack Overflow is a community of 4.7 million programmers, just like you, helping each other. Join them, it only takes a minute:

I made angularjs spring rest file upload by the following code it works well and save file ,now I want to add some input text like description to html form with file upload and save them What is the code I should add to formData() in angular controller to make this?

angularjs controller

var myDropzone = new Dropzone("div#file", 
                { url: "#"
                });
            myDropzone.on("addedfile", function(file) {
                 $scope.file=file; 

            });
     $scope.uploadFile=function(){
        var formData=new FormData();
        formData.append("file",$scope.file);
        console.log(formData)
        $http.post('/pagingpoc/app/newDocument', formData, {
            transformRequest: function(data, headersGetterFunction) {
                return data;
            },
            headers: { 'Content-Type': undefined }
            }).success(function(data, status) {                       
                console.log("Success ... " + status);
            }).error(function(data, status) {
                console.log("Error ... " + status);
            });
        $('#saveAttachmentModal').modal('hide');
  };

html form

  <form ng-submit="uploadFile()"  enctype="multipart/form-data">

        <div class="form-group">
          <label>Description</label>
          <textarea rows="5" cols="5" ng-model="description"></textarea><br>
        </div>

        <div  id="file" class="dropzone"></div>
        <div class="modal-footer">
         <button type="button" class="btn btn-default" 
                   data-dismiss="modal" ng-click="clear()">
              <span class="glyphicon glyphicon-ban-circle"></span> Cancel
                        </button>
          <button type="submit"  class="btn btn-primary">
                      <span class="glyphicon glyphicon-save"></span> Save
                        </button>
        </div> 
     </form>

Rest Controller

      public void UploadFile(MultipartHttpServletRequest request,
                HttpServletResponse response) throws IOException {

        Attachment attachment=new Attachment();
        Iterator<String> itr=request.getFileNames();
        MultipartFile file=request.getFile(itr.next());
        String fileName=file.getOriginalFilename();
        attachment.setName(fileName);
        attachmentRepository.save(attachment);
        File dir = new File("/home/ali/");
         if (dir.isDirectory())
         {
            File serverFile = new File(dir,fileName);
           BufferedOutputStream stream = new BufferedOutputStream(
                 new FileOutputStream(serverFile));
           stream.write(file.getBytes());
           stream.close();
       }else {
        System.out.println("Error Found");
      }

 }
share|improve this question
    
headers: {enctype:'multipart/form-data'} inside your post – Pankaj Parkar Feb 12 at 15:43

1 Answer 1

up vote 1 down vote accepted

controller:

var myDropzone = new Dropzone("div#file", { url: "#"});
myDropzone.on("addedfile", function(file) {
    $scope.file=file; 
});
$scope.text = '';
$scope.uploadFile = function(){
    var formData=new FormData();
    formData.append("file",$scope.file);
    formData.append("text",$scope.text); //here
    $http.post('/pagingpoc/app/newDocument', formData, {
            transformRequest: function(data, headersGetterFunction) {
                return data;
            },
            headers: { 'Content-Type': undefined }
            }).success(function(data, status) {                       
                console.log("Success ... " + status);
            }).error(function(data, status) {
                console.log("Error ... " + status);
            });
        $('#saveAttachmentModal').modal('hide');
  };

hmlt:

Description
Cancel Save
share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.