Basic list CRUD operations using REST API in SharePoint 2013

Hi, today i want to share how to do basic list CURD operation using REST API.

Here the steps,

We need on SharePoint list and i have created associate list as below.

First we will design html page where we will show a button to get all items in associate list and display in a table. 

Before that we will add one content editor web part to the page. as we know that RESTAPI code will be write in script tags <script></script> and will keep the code in content editor web part.

Page looks like this.

GET ALL ITEMS:

When user click on get associate details, it will fetch the list items and display in a table format. Each row contains update and delete button. Also it will show one common button to add new item.

Here the Output.

ADD AN ITEM:

When user click on "Add Associate", it will show four text box to enter associate id, Name, number and address

It will looks as below when click on "Add associate" button.

Here the code to add new item to list.

After successfully adding new item, the table will update and will show as below.

UPDATE An ITEM:

As previously said, each row have update and delete button. Whenever user click on update button,
it will show four text boxes with the respective item at the bottom of the table.




Now user can update the details and click on "update" button, then it will update the list and refresh the table also.




And when user click on delete button in the table respective item will get delete and refresh the table.

Delete An Item:

When user clicks on delete button, it will delete the respective item from list and update the table.

Find the complete code over here

How to redirect to root site when user click on subsite logo

Requirement:

I have one sub site (this is search center) under the root site collection. Whenever search any keyword it will redirect to search site. Here there is no way to go to home site. Now users want to go back when they click on site logo.

Solution:

Here the solution.

1. Open the sub site/ Search site in SharePoint designer 2013.
2. Open the site's master page and add the below JQuery script.

<script type="text/javascript">
$(function(){
  $('.ms-siteicon-a').click(function(e){
   e.preventDefault();
    window.location.href="/";
  });
});
</script>

Now save and check it.