Hello Techies,
I created a custom form to submit list item and attach multiple attachments.
And would need to redirect user to default list view after all the attachments are attached to a list item.
I tried adding window.location.href='default List url' but it redirects while the attachments are getting added.
It works fine for small file(s) but for large file(s), only 1 attachment gets added.
Here is the snippet:
HTML:
-
- <table align="left" border="1" cellpadding="0" cellspacing="0" >
- <tbody>
- <tr>
- <td valign="top">
- <h3> Nameh3>
- td>
- <td valign="top" style="padding:9px;">
- <input type="text" value="" maxlength="255" id="Title" title="Name" style="width: 96%;" ms-spellcheck-true">
- td>
- tr>
-
- <tr >
- <td >
- <span style="font-family: " segoe ui" ,sans-serif; color: #444444">
- Click here to attach file
- span>
- <div id="attachFilesHolder ">
- <input type="file" id="attachment" name="FileUpload" multiple/>
- div>
- td>
- <td>
- td>
- tr>
- table>
- <div>
- <input name="SaveItem" style=" height: 40px; font-size: 15px;" id="NewSaveItem" accesskey="O" onclick="" type="button" value="Click here to submit " target="_self">
- div>
And here is my js:
- var ListTitle = "SubTask";
-
- $( document ).ready(function() {
-
- $("#NewSaveItem").click(function() {
- CreateNewItem();
-
- });
-
-
- });
-
- function CreateNewItem() {
- var data = {
- __metadata: { 'type': "SP.Data.SubTaskListItem" },
- Title: $('#Title').val()
- };
-
- $.ajax({
-
- url: _spPageContextInfo.webAbsoluteUrl + "/_api/Web/Lists/GetByTitle('" + ListTitle + "')/Items",
- type: "POST",
- headers: {
- "accept": "application/json;odata=verbose",
- "X-RequestDigest": $("#__REQUESTDIGEST").val(),
- "content-Type": "application/json;odata=verbose"
- },
-
- async: false,
- data: JSON.stringify(data),
- success: function (data) {
- if (data.d.ID != undefined && data.d.ID > 0){
-
- UploadFileToListItem(data.d);
-
- }
- else
- {
- console.log('Item added successfully');
- }
- },
- error: function (error) {
- console.log('Problem saving data');
- }
- });
-
-
- }
-
-
-
-
-
- function UploadFileToListItem(data) {
- var element = document.getElementById("attachment");
- lastFileName = element.files[element.files.length - 1].name;
- for (var i = 0; i < element.files.length; i++) {
- var file = element.files[i];
- uploadFile(data, file);
- }
- alert('Done');
- window.location.href = 'https://connect.sharepoint.com/sites/SpApps/Lists/SubTask/';
- }
-
-
- function uploadFile(data, file) {
- var getFileBuffer = function (file) {
- var deferred = $.Deferred();
- var reader = new FileReader();
-
- reader.onload = function (e) {
- deferred.resolve(e.target.result);
- }
-
- reader.onerror = function (e) {
- deferred.reject(e.target.error);
- }
-
- reader.readAsArrayBuffer(file);
-
- return deferred.promise();
- };
-
- getFileBuffer(file).then(function (buffer) {
- var binary = "";
- var bytes = new Uint8Array(buffer);
- var i = bytes.byteLength;
- while (i--) {
- binary = String.fromCharCode(bytes[i]) + binary;
- }
- var fileName = file.name;
- var error = ''
- $().SPServices({
- operation: "AddAttachment",
- async: false,
- listName: ListTitle,
- listItemID: data.Id,
- fileName: fileName,
- attachment: btoa(binary),
- completefunc: function (xData, Status) {
- console.log(file.name + " uploaded");
- }
- });
- });
-
-
- }