SharePoint custom file uploader by JSOM & REST\oData

SharePoint имеет встроенную возможность прикреплять файлы к элементам списка.

Но нет возможности иметь 2 поля. Что бы логически разделять документы.
Такого столбца просто нет в списке.
Так же нет возможности задать библиотеку, куда складывать вложения.
Что бы просмотреть вложенные элементы, необходимо открыть элемент списка.
Решением может быть создание своего custom field type.
Использовать серверный код для реализации функционала. В таком случае ограничений почти нет.
Можно купить. Есть несколько предложений на рынке.
Я же кратко покажу как добавить такой функционал без серверного кода.
Решение должно иметь возможность явно указать библиотеку, куда складывать файлы.
Не блокировать интерфейс на время загрузки.
Иметь возможность загрузки файлов большого размера.
Решение должно сразу же отображать загруженный файл и предоставлять возможность его удаления.
Все должно быть без постбэков.
Все будет сделано на JavaScript.

Для начала создайте новую форму просмотра.
Это можно сделать в SharePoint Designer.

Имя папки для хранения файлов- "Documents".
Библиотека указывается в html элементе для загрузки файлов:

onchange="UploadFile('Documents', 'fileinputInit')"

Добавьте в нее html:

<tr> 
    <td width="190px" valign="top" class="ms-formlabel"> 
        <h3 class="ms-standardheader"> 
            <nobr>Документы по открытию</nobr> 
        </h3> 
    </td> 
    <td width="400px" valign="top" class="ms-formbody"> 
        <input style="margin-left:2px" type="button" id="browseButton" value="Добавить файл ..." onclick="fileinputInit.click()" />
        <input type='file' id='fileinputInit' onchange="UploadFile('Documents', 'fileinputInit')" style='position:absolute;visibility:hidden;' multiple="multiple" /> 
        <div id="attachedFilesInit"> 
            <h2 id="initAnchor"></h2> 
        </div> 
    </td>
</tr> 

Этот html надо вставить в таблицу полями формы.
Что бы поле загрузки располагалось после поле "Название", вставьте код выше после указанного ниже:

    <td width="190px" valign="top" class="ms-formlabel"> 
        <h3 class="ms-standardheader"> 
            <nobr> 
                Название<span class="ms-formvalidation"> *</span> 
            </nobr> 
        </h3> 
    </td> 
    <td width="400px" valign="top" class="ms-formbody"> 
        <SharePoint:FormField runat="server" id="ff1{$Pos}" ControlMode="New" FieldName="Title" __designer:bind="{ddwrt:DataBind('i',concat('ff1',$Pos),'Value','ValueChanged','ID',ddwrt:EscapeDelims(string(@ID)),'@Title')}" /> 
        <SharePoint:FieldDescription runat="server" id="ff1description{$Pos}" FieldName="Title" ControlMode="New" /> 
    </td> 
</tr>

 Потом добавить после:

Этот JS

Решение работает асинхронно.
Загрузки делалась именно с помощью REST, т.к. JSOM имеет ограничение файла на загрузку в 2 Mb.

В результате у Вас должно быть как на гиф ниже:

Решение есть куда дорабатывать.

Для начала отключить возможность сабмита формы, на время загрузки.

И индикатор загрузки в список файлов.