On Date picker, page jumping to the top

function OnIframeLoadFinish() {
ULSvmd:
    ;
    var picker;    
    if (typeof this.Picker != 'undefined')
        picker = this.Picker;
    if (picker != null && typeof picker.readyState != 'undefined' && picker.readyState != null && picker.readyState == "complete") {
        document.body.scrollLeft = g_scrollLeft;
        document.body.scrollTop = g_scrollTop;
        g_scrollTop = document.getElementById('s4-workspace').scrollTop;
        picker.style.display = "block";
        if (typeof document.frames != 'undefined' && Boolean(document.frames)) {  /* "document.frames" doesn't work on chrome use "window.frames" instead*/
            var frame = document.frames[picker.id];    
            if (frame != null && typeof frame.focus == 'function')
                frame.focus();
        }
        else {
            picker.focus();
        }
    }
    setTimeout(function(){
        document.getElementById('s4-workspace').scrollTop = g_scrollTop;
    }, 1);
}

max limit for number of columns - sharepoint list

Below the list column limit per type:

Single line of text: 276

Multiple Lines of Text: 192

Choice: 276

Number: 72

Currency: 72

Date and Time: 48

Lookup: 96

Yes / No: 96

Person or group: 96

Hyperlink or picture: 138

Calculated: 48

GUID: 6

Int: 96

Managed metadata: 94

Edit Task through sharepoint 2013 approval workflow

Note:  The 2010 workflow engine opens to an edit form natively, so this post only applies to those of you that need to use the 2013 workflow for your approval process.

If your end-users are like mine, they don't appreciate having to click "Edit Item" in the ribbon in order to approve a task which they clicked on from their email notification.  I'm not a fan of it either, so here's a clever work-around to keep everyone happy.

1. Open SharePoint Designer 2013 and navigate to your Tasks list where workflow is creating your assigned workflow tasks.
2. Click the New... menu button in the Forms section
   
3. Give your new form a name, select the radio button by Display item form, check the box next to Set as default form for the selected type, and select the Workflow Task (SharePoint 2013) content type (assuming that is the content type you're using for your workflow tasks) and click the OK button.
   
4. Open the new form in Code view by clicking on the form name, then click the Advanced Mode button in the ribbon to open up the form for editing.
5. Paste the following javascript AFTER the <asp:Content ContentPlaceHolderId="PlaceHolderMain" runat="server"> line (approx line 14):
   <script type="text/javascript">
   <!--
   var origUrl = window.location.toString();
   var editUrl = origUrl.replace("CustomDisplayForm","EditForm");
   window.location = editUrl;
   //-->
   </script>
   
6. Save the changes to your form and then test by navigating to your list and clicking on the link to your task...it should be redirected to the Edit form via your new custom display form script.  This also means that when the end user clicks the link to the task from their email notification, the link will take them directly to the edit form page to approve/reject.
   

Reference Link : http://www.sharepointmaestra.com/Blog/Post/44/2013-Workflow-Task-Links-Redirect-to-Edit-Form

SharePoint 2013 Workflow: ‘Start a Task Process’ vs. ‘Assign a Task’ and Retrieving Comments from a Task List Item

https://ramirezmery.wordpress.com/2015/10/30/start-a-task-process-vs-assign-a-task-and-retrieving-comments-from-a-task-list-item/

Calculated field for start date and duration

http://blog.pentalogic.net/2010/05/calculated-columns-adding-hours-onto-a-date-field/

JSLink break normal view of sharepoint task list

https://www.xylos.com/blog/en/2013/08/sharepoint-2013-applying-js-link-on-task-lists-breaks-the-default-rendering-of-the-checkboxes/

Installation of SharePoint

For Installing SharePoint, We need to follow the below-mentioned steps:

GitHub Repository: https://github.com/vignesh2295/SPInstallation

Step-1: Install Windows Server version as per our need.

Step-2: Install and enable all the roles and feature in the server manager. For this, we can go for the Powershell script attached to my git hub Repository



Step-3: After installing the roles and Features, we need to install and configure the MS SQL server versions compatible to our SharePoint.

Step - 4: Once the SQL server got configured, we need to check for windows update and install the updates.

Step - 5: Then install prerequisites.exe from the SharePoint installation media, it will automatically download and install all the required applications for the SharePoint installation.

If it is not installing and throwing errors, like the tool was unable to install AppFabric, due to a network issue.

So we can download and install the files using PowerShell script. Refer to repository

Step - 6: Once the prerequisites are successfully installed, start installing the setup file in SharePoint installation media.

Step - 7: After SharePoint got installed, run the SharePoint configuration wizard, it will start creating configuration database for the sharepoint server and it will create an application pool in IIS.

Step - 8: The last step in SharePoint installation is setting up the central admin site, we can customize the services and features as per our need or else we can go for the default setting and configuration.

For Getting city,state and country using postal/zip code

For Getting city, state and country using zip code:

Reference URL : http://www.zippopotam.us/

GitHub reference : https://github.com/crowell/Zippopotamus

$('input[title="ZipCode Required Field"]').blur(function(){

  var zip = $(this).val();
  var city = '';
  var state = '';

  //make a request to the google geocode api
  $.getJSON({
    url  : 'https://api.zippopotam.us/us/'+zip+'',    
    data : {
        sensor  : false
    },
    success : function( data, textStatus ) {
    debugger;
state =data.places[0].state;
city =data.places["0"]["place name"];
country =data.country;

    //pre-fill the city and state
    $('input[title="City"]').val(city);
    $('input[title="State Required Field"]').val(state);
    $('input[title="Country Required Field"]').val(country);
    }
  });
});

Upload file in document library with metadata at a time

<head>
    <script src="jquery.min.js" type="text\javascript"></script>
</head>
<body>
<div>
<label>DocName:</label>
<input type="text" id="DocName" />
</div>
<div>
<label>User:</label>
<input type="text" id="Popuser" />
</div>
<div>
<input type="file" id="uploadFile" />
</div>
<div style="margin-top:20px;">
<button type="button" onclick="readFile()">Submit</button>
</div>
<script>
var fileInput; 
$(document) 
    .ready(function () {
    debugger;
        fileInput = $("#getFile"); 
        SP.SOD.executeFunc('sp.js', 'SP.ClientContext'); 
    }); 
 
var arrayBuffer; 
 
function readFile() { 
    debugger;
    //Get File Input Control and read th file name 
   
    var element = document.getElementById("uploadFile"); 
    var file = element.files[0]; 
    var parts = element.value.split("\\"); 
    var fileName = parts[parts.length - 1]; 
   
    //Read File contents using file reader 
    var reader = new FileReader(); 
    reader.onload = function (e) { 
        uploadFile(e.target.result, fileName); 
    } 
    reader.onerror = function (e) { 
        alert(e.target.error); 
    } 
    reader.readAsArrayBuffer(file); 
} 
var attachmentFiles; 
 
function uploadFile(arrayBuffer, fileName) { 
    //Get Client Context,Web and List object. 
    var clientContext = new SP.ClientContext(); 
    var oWeb = clientContext.get_web(); 
    var oList = oWeb.get_lists().getByTitle('DocUpload'); 
   
    //Convert the file contents into base64 data 
 var bytes = new Uint8Array(arrayBuffer); 
    var i, length, out = ''; 
    for (i = 0, length = bytes.length; i < length; i += 1) { 
        out += String.fromCharCode(bytes[i]); 
    } 
    var base64 = btoa(out); 
    //Create FileCreationInformation object using the read file data 
    var createInfo = new SP.FileCreationInformation();
     
    createInfo.set_content(base64); 
    createInfo.set_url(fileName); 
   
    //Add the file to the library 
    this.uploadedDocument = oList.get_rootFolder().get_files().add(createInfo) 
    //Load client context and execcute the batch 
    listItem = uploadedDocument.get_listItemAllFields();
    listItem.set_item('docName', fileName);
//here we can set all the list items
    listItem.update();
    clientContext.load(uploadedDocument,'ListItemAllFields'); 
    clientContext.executeQueryAsync(Function.createDelegate(this, this.QuerySuccess), Function.createDelegate(this, this.QueryFailure)); 
} 
 
function QuerySuccess() { 
var id = uploadedDocument.get_listItemAllFields();
//here we can get all the fields
    console.log('File Uploaded Successfully.'); 
    alert("File Uploaded Successfully.");
} 
 
function QueryFailure(sender, args) { 
    console.log('Request failed with error message - ' + args.get_message() + ' . Stack Trace - ' + args.get_stackTrace()); 
alert("Request failed with error message - " + args.get_message() + " . Stack Trace - " + args.get_stackTrace()); 
} 
 

</script>
</body>

Autofill people picker in sharepoint

function setLoginName() {
debugger;
    var loginName = _spPageContextInfo.userLoginName;
    var peoplePickerDiv = $("[id$='ClientPeoplePicker'][title='Name']");
    var peoplePickerEditor = peoplePickerDiv.find("[title='Name']");
    var spPeoplePicker = SPClientPeoplePicker.SPClientPeoplePickerDict[peoplePickerDiv[0].id];
    peoplePickerEditor.val(loginName);
    spPeoplePicker.AddUnresolvedUserFromEditor(true);
}
$(document).ready(function(){
SP.SOD.executeFunc('clientpeoplepicker.js', 'SPClientPeoplePicker', function () {
       setLoginName(); //your code goes here
    });
});

Autofill state and city based on zipcode

https://nobleintentstudio.com/blog/zip-code-to-city-state-lookup/


$('#input').blur(function(){

  var zip = $(this).val();
  var city = '';
  var state = '';

  //make a request to the google geocode api
  $.getJSON('https://maps.googleapis.com/maps/api/geocode/json?address='+zip+'',function(response){
    //find the city and state
    var address_components = response.results[0].address_components;
    $.each(address_components, function(index, component){
      var types = component.types;
      $.each(types, function(index, type){
        if(type == 'locality') {
          city = component.long_name;
        }
        if(type == 'administrative_area_level_1') {
          state = component.long_name;
        }
       
        if(type == 'country'){
          country = component.long_name;
        }
      });
    });

    //pre-fill the city and state
    $('#City').val(city);
    $('#State').val(state);
    $('#Country').val(country);
  });
});

Autopopulate address

https://developers.google.com/maps/documentation/javascript/examples/places-autocomplete-addressform