Hello,
I am new in REST API in SharePoint. i have practices some task but some is not working.
the below code is not working, please help this below code where i wrote wrong.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script><script type="text/javascript" src="/sites/Tesite/SiteAssets/ScriptFiles/REST.js"></script><div id="createData"><table><tr><td><table><tr><td>Customer Id</td><td><input type="text" id="CustomerId"/></td></tr><tr><td>First Name</td><td><input type="text" id="CustomerFirstName"/></td></tr><tr><td>Last Name</td><td><input type="text" id="CustomerLastName"/></td></tr><tr><td>Location</td><td><input type="text" id="CustomerLocation" /></td></tr><tr><td>Ph-Number</td><td><input type="text" id="CustomerPhNumber"/></td></tr><tr><td><input type="button" id="btnadd" value="Add New Items" Onclick="createItem()" /></td></tr></table></td></tr></table></div><div id="readData"><div id="tbldatamain"><table id=tbl2><tr><th><input type="radio"></th></input><th>Customer ID</th><th>First Name</th><th>Last Name</th><th>Location</th><th>Ph-Number</th></tr></table></div><input type="hidden" id="hdndata" value=""/><div><table><tr><td><button id="btndel">Update</button></td><td><button id="btndelete">Delete</button></td></tr></div></div><style>
#readData{
;
top: 205px;
left: 915px;
}
</style>
var v1='';
var v2='';
var v3='';
var v4='';
var v5='';
var itemid='';
SP.SOD.executeOrDelayUntilScriptLoaded(GetMethods, 'sp.js');
function GetMethods(){
jQuery(document).ready(function(){
debugger;
createItem();
read();
update();
Deleted();
});
}
function read(){
var resturl = _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getbytitle('Customer')/items";
debugger;
jQuery.ajax({
url: resturl,
method: "GET",
headers: { "Accept": "application/json; odata=verbose" },
success: function (data) {
var lnt = data.d.results.length;
for(var i=0; i<lnt; i++ ){
var title = data.d.results[i].Title;
var firstname = data.d.results[i].First_x0020_Name;
var lastname = data.d.results[i].Last_x0020_Name;
var phnumber = data.d.results[i].Ph_x002d_Number;
var location = data.d.results[i].Location;
var id = data.d.results[i].ID;
var tbldata = "<tr><td><input type='radio' class='addcls' name='rd1' value='"+id+"' onclick='javascript:getcheked();' /></td><td >"+title+"</td><td>"+firstname+"</td><td>"+lastname+"</td><td>"+location+"</td><td>"+phnumber+"</td></tr>"
jQuery("#tbl2").append(tbldata);
}
},
error: function (data) {
console.log(data.responseJSON.error);
}
});
}
function addNewItem(url, data) {
debugger;
jQuery.ajax({
url: _spPageContextInfo.webAbsoluteUrl + url,
type: "POST",
headers: {
"accept": "application/json;odata=verbose","X-RequestDigest": jQuery("#__REQUESTDIGEST").val(),"content-Type": "application/json;odata=verbose"
},
data: JSON.stringify(data),
success: function (data) {
alert("Record Added");
},
error: function (error) {
console.log(JSON.stringify(error));
}
});
}
function GetItemTypeForListName(name) {
return"SP.Data." + name.charAt(0).toUpperCase() + name.slice(1) + "ListItem";
}
function createItem(){
//jQuery("#btnadd").click(function(){
debugger;
var addNewItemUrl = "/_api/Lists/GetByTitle('Customer')/Items";
var itemType = GetItemTypeForListName('Customer');
var CustomerId : $("#CustomerId").val();
var CustomerFirstName : $("#CustomerFirstName").val();
var CustomerLastName : $("#CustomerLastName").val();
var CustomerLocation : $("#CustomerLocation").val();
var CustomerPhNumber : $("#CustomerPhNumber").val();
var item = {
"__metadata": { "type": itemType },"Title": CustomerId,"First_x0020_Name": CustomerFirstName,"Last_x0020_Name": CustomerLastName,"Location": CustomerLocation,"Ph_x002d_Number": CustomerPhNumber
};
addNewItem(addNewItemUrl, item);
//});
}
function update(){
jQuery("#btndel").click(function(){
var requestUri = _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/GetByTitle('Customer')/getItemById(" + itemid + ")";
var itemType = GetItemTypeForListName('Customer');
var item = {
"__metadata": { "type": itemType },"Title": v1,"First_x0020_Name": v2,"Last_x0020_Name": v3,"Location": v4,"Ph_x002d_Number": v5
};
UpdateData(requestUri,item);
});
}
function getcheked(){
jQuery(".addcls").each(function(){
if(jQuery(this).is(":checked")){
var chkdata = jQuery(this).val();
jQuery("#hdndata").val(chkdata);
itemid =jQuery("#hdndata").val();
var jQueryrow = jQuery(this).closest("tr"), // Finds the closest row <tr>
jQuerytds2 = jQueryrow.find("td:nth-child(2)");
jQuerytds2.prop("contentEditable", "true");
jQuerytds2.keyup(function(){
v1 = jQuery(this).text();
});
jQuerytds3 = jQueryrow.find("td:nth-child(3)")
jQuerytds3.prop("contentEditable", "true");
jQuerytds3.keyup(function(){
v2 = jQuery(this).text();
});
jQuerytds4 = jQueryrow.find("td:nth-child(4)");
jQuerytds4.prop("contentEditable", "true");
jQuerytds4.keyup(function(){
v3 = jQuery(this).text();
});
jQuerytds5 = jQueryrow.find("td:nth-child(5)");
jQuerytds5.prop("contentEditable", "true");
jQuerytds5.keyup(function(){
v4 = jQuery(this).text();
});
jQuerytds6 = jQueryrow.find("td:nth-child(6)");
jQuerytds6.prop("contentEditable", "true");
jQuerytds6.keyup(function(){
v5 = jQuery(this).text();
});
}
})
}
function UpdateData(requestUri,item){
jQuery.ajax({
url: requestUri,
type: "POST",
data:JSON.stringify(item),
headers: {
"accept":"application/json;odata=verbose","content-type": "application/json;odata=verbose","X-RequestDigest": jQuery("#__REQUESTDIGEST").val(),"X-HTTP-Method": "MERGE","IF-MATCH":"*"
},
success: onSuccess,
error: onError
});
}
function onSuccess(data) {
alert("Updated");
}
function onError(error) {
console.log(JSON.stringify(error));
}
function DeleteItem(deleteuri){
jQuery.ajax({
url: deleteuri,
type: "POST",
headers: {
"accept":"application/json;odata=verbose","content-type": "application/json;odata=verbose","X-RequestDigest": jQuery("#__REQUESTDIGEST").val(),"X-HTTP-Method": "DELETE","IF-MATCH":"*"
},
success: onDeleteSuccess,
error: onDeleteError
});
}
function onDeleteSuccess(){
alert("Entry Deleted");
}
function onDeleteError(){
console.log(JSON.stringify(error));
}
function Deleted(){
jQuery("#btndelete").click(function(){
var requestUri = _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/GetByTitle('Customer')/getItemById(" + itemid + ")";
DeleteItem(requestUri);
});
}