Add a button on page which creates Site Columns.
<asp:Content ContentPlaceHolderID="PlaceHolderMain" runat="server">
<div>
<input type="button" id="btnSiteColumns" value="Create Site Columns" onclick="createSiteColumns()" />
</div>
</asp:Content>Add following code to App.js.
'use strict';
var context = SP.ClientContext.get_current();
var hostWebUrl, hostWebContext, hostWeb;
$(document).ready(function () {
hostWebUrl = decodeURIComponent(getQueryStringParameter("SPHostUrl"));
//Get Host Web Context using App web
hostWebContext = new SP.AppContextSite(context, hostWebUrl);
hostWeb = hostWebContext.get_web();
});
// Retrieve a query string value.
function getQueryStringParameter(paramToRetrieve) {
var params = document.URL.split("?")[1].split("&");
for (var i = 0; i < params.length; i = i + 1) {
var singleParam = params[i].split("=");
if (singleParam[0] == paramToRetrieve) return singleParam[1];
}
}
//Create Site Columns on Host Web
function createSiteColumns() {
var fields;
var createFields;
//Get Host Web Fields Collection
fields = hostWeb.get_fields();
//Define the fields schema
var fieldSchema = new Array(
'<Field Name="EmployeeId" DisplayName="Employee ID" Type="Text" EnforceUniqueValues ="TRUE" Indexed="TRUE" Required="True" Group="EmployeeDetails"/>',
'<Field Name="EmployeeName" DisplayName="Employee Name" Type="User" Required="FALSE" Group="EmployeeDetails"/>');
for (var iFieldsCounter = 0; iFieldsCounter < fieldSchema.length; iFieldsCounter++) {
//Parameters to pass
//fields.addFieldAsXml(string schemaXml,bool addToDefaultView, AddFieldOptions options)
createFields = fields.addFieldAsXml(fieldSchema[iFieldsCounter], false, SP.AddFieldOptions.addFieldCheckDisplayName);
}
context.load(fields);
context.load(createFields);
context.executeQueryAsync(
function () {
alert('Site Columns Created Successfully.')
},
function (sender, args) {
alert('Failed to create Site Columns. Error:' + args.get_message() + '\n' + args.get_stackTrace());
});
} 