QuickTip: SharePoint Attachment Field in List Forms

To show the attachment field in the form as in the above screenshot without the need to click the ‘Add attachment’-button in the ribbon, simply edit the form and put the script below into a Script Editor Webpart. This Script requires jQuery.

jQuery(document).ready(function(){
	//Get all the ribbon buttons from the action-group
	var $ribbonAttachButton = $("#Ribbon\\.ListForm\\.Edit\\.Actions a")
	//If the 'Add Attachment'-button is the only button in the group then hide the group, otherwise just hide the button 
	$ribbonAttachButton.length == 1 && $ribbonAttachButton.closest("li").hide() || $ribbonAttachButton.hide()
	//Get the iportant elements of the hidden attachment field
	var $attachElements = $("#csrAttachmentUploadDiv > #partAttachment > table > tbody > tr:eq(1),#csrAttachmentUploadDiv > #partAttachment > table > tbody > tr:eq(4)")
	//Get the 'OK'- & 'Cancel'-button
	var $attachButtons  = $attachElements.find(".ms-attachUploadButtons")
	//Insert an empty cell in order to adjust to the form's layout
	$("<td></td>").insertBefore($attachButtons)
	//Align buttons to the left
	$attachButtons.css("text-align","left")
	//Remove some margin and rename the 'OK'-button
	$attachButtons.find("#attachOKbutton").css("margin-left",0).val("Attach")
	//Adjust the fields label to match the rest of the form, adjust the height
	$attachElements.find(".ms-formlabel").html("<h3 class='ms-standardheader'>Add Attachments</h3>").css({"height":"auto","width":"auto"})
	//Make the file-selector bigger
	$attachElements.find("#onetidIOFile").addClass("ms-longfileinput")
	//Move elements to the end of the form table
	$attachElements.appendTo($("#part1 > .ms-formtable"))
})