Link to the uploaded document in RichTextHtmlField is not generated if custom document upload form is used

Question

I have a RichTextHtmlField in a page. The user who is entering data need to upload the document for reference. I want to change the selected option of Destination Library in the form. To do so, I have copied entire content of
Upload.aspx page and created a custom action to launch the custom upload form. When I click on the custom action button I am getting the exact ouput which I want but after the upload operation completes I am not getting the link generated in the
field area, as SharePoint OOTB upload form does.
My custom action contains following code:
<CustomAction Id="Ribbon.PublishTab.Publishing.Actions.UploadDocumentButton" Location="CommandUI.Ribbon">
<CommandUIExtension>
<CommandUIDefinitions>
<CommandUIDefinition Location="Ribbon.EditingTools.CPInsert.Links.Controls._children" >
<Button Id="Ribbon.PublishTab.Publishing.UploadDocumentButton1" Command="UploadDocumentButton1"
Image16by16="/_layouts/15/Solution/Images/Approval_16_by_16.jpg"
Image32by32="/_layouts/15/Solution/Images/Approval_32_by_32.jpg"
LabelText="Upload File" TemplateAlias="o1" Sequence="1000" />
</CommandUIDefinition>
</CommandUIDefinitions>
<CommandUIHandlers>
<CommandUIHandler Command="UploadDocumentButton1" CommandAction="javascript:function test(){
var url = _spPageContextInfo.webAbsoluteUrl + '/_layouts/15/DiscussionBoardEventReceiver/Pages/UploadFile.aspx?UseDivDialog=true&amp;LCID=1033&amp;Source=' + _spPageContextInfo.serverRequestPath +'&amp;AssetPageFolder=true&amp;seed=0.10343389471709208';
var options = {url: url};
SP.UI.ModalDialog.showModalDialog(options);
} test();">
</CommandUIHandler>
</CommandUIHandlers>
</CommandUIExtension>
</CustomAction>
The page UploadFile.aspx the exact code which is found in Upload.aspx in
\_layouts folder.
The file is uploaded successfully but the link is not getting generated. What am I missing?

Answer 1

Hi,
According to your description, you might want to upload a file to a library and insert the corresponding hyperlink into the RichTextHtmlField when editing a page.
Based on the code above, a modal dialog holds the custom “UploadFile.aspx” will be responsible for the file uploading, however, as there seems no code in the callback
function of the modal dialog to handle the operations after file uploaded, though file will be uploaded, there will be no hyperlink get generated and inserted into the page.
A demo about how to work with callback function of modal dialog:
https://alinimer.wordpress.com/2013/02/25/open-pages-and-forms-in-modal-dialog-for-sharepoint-2013/
As we can see, if using the OOTB feature to insert a file into the page, the corresponding HTML structure would be like this:
Thus, a possible workaround is that you can write code in the callback function to capture the dialog closing event and inject a hyperlink into the page accordingly.
About how to inject HTML into page:
http://stackoverflow.com/questions/3762385/best-way-to-inject-html-using-javascript
About how to modify the HTML source code of a page using JavaScript:
http://www.w3schools.com/js/js_htmldom_html.asp
http://njarb.com/2011/06/update-html-content-using-javascript/
Best regards
Patrick Liang
TechNet Community Support