I have an HTML form that I can use to create documents with text only content currently. However, I want to be able to upload file data through the form as well.
How can I do this? Here is the form I am using so far
<form class="form-horizontal well" id="submitform" name="submitform">
<label class="control-label" for="brand">Brand</label>
<label class="control-label" for="link">Any other thoughts?</label>
<div class="control-group">
<div class="controls">
<textarea class="input" rows="3" name="notes" id="notes"></textarea>
</div>
</div>
<div class="control-group">
<div class="controls">
<input type="submit" class="btn"/>
</div>
</div>
<label class="control-label" for="picture[]">Got a Picture?</label>
<div class="control-group">
<div class="controls">
<input type="file" name="_attachments" id="picture" accept="image/*" multiple/>
</div>
</div>
</div>
</fieldset>
</form>
I tried using some AJAX to upload the file, but I was only able to the upload the filename as an attachment, not the actual contents.
$.couch.db("couchclothes").saveDoc
(
{
type: $('#type').val(),
brand: $('#brand').val(),
fit: $('#fit').val(),
color: $('#color').val(),
link: $('#link').val(),
notes: $('#notes').val()
},
{
success: function(data)
{
alert("Saved data ok.");
var id = data.id;
var rev = data.rev;
// send a PUT request here
}
}
);