I have been working on implementing a file upload feature with AngularJS/Rails using the Paperclip gem. I was able to resolve the file input issue with a directive, but now I am facing an issue where the image data is not being sent along with other post data.
Here is my HTML code:
<form name="PostForm" ng-submit="submit()" novalidate>
<input type="text" ng-model="post.title">
<input type="file" file-upload />
<textarea ng-model="post.content"></textarea>
</form>
This is my controller:
$scope.create = function() {
function success(response) {
console.log("Success", response)
$location.path("posts");
}
function failure(response) {
console.log("Failure", response);
}
if ($routeParams.id)
Post.update($scope.post, success, failure);
else
Post.create($scope.post, success, failure);
}
$scope.$on("fileSelected", function (event, args) {
$scope.$apply(function () {
$scope.post.image = args.file;
});
});
This is my model:
class Post < ActiveRecord::Base
attr_accessible :content, :title, :image_file_name, :image_content_type, :image_file_size, :image_updated_at
belongs_to :user
has_attached_file :image, :styles => { :medium => "300x300>", :thumb => "100x100>" }, :default_url => "/images/:style/missing.png"
end
However, when I send the data to the server side, the request does not include any information about the image:
{
"content":"Hey",
"created_at":"2013-08-31T17:54:32Z",
"id":17,
"image_content_type":null,
"image_file_name":null,
"image_file_size":null,
"image_updated_at":null,
"title":"Image",
"updated_at":"2013-08-31T17:54:32Z",
"user_id":4
}
Any suggestions on how I can ensure that the image data is also sent to the server?