240 likes | 330 Vues
Learn to develop mobile web applications for SharePoint using PhoneGap and jQuery Mobile. Understand PhoneGap project structure, tips, and demo for CRUD operations in SharePoint 2013. Explore SharePoint communication methods using ASMX, SVC services, and REST API.
E N D
PhoneGapAnd_jQueryMobileForSharePoint var MobileWebInSharePoint = { Author: ‘Kiril Iliev’, Tags: [‘SharePointAPI’, ‘MobileWeb’] };
Summary • What is PhoneGap? • PhoneGap.ProjectStructure • Short DEMO and Tips • SharePoint.Communication • DEMO – CRUD with SharePoint 2013 REST Services
What is PhoneGap? PhoneGap is a collection of tools, and libraries that allow you to build native mobile applications for multiple devices.* * PhoneGap Site
PhoneGap.ProjectStrucutre • The www folder • App Init – index.js and index.html • Enable debug information • Loading plugins • App information
DEMO PhoneGap Project Structure
SharePoint.Communication • Using ASMX Services and SOAP Messages • Using SVC services • Using the API – SharePoint 2013 _api
SharePoint.Communication = { asmxService: true}; • object = { • spSite: $("#spSite").val() + "_vti_bin/authentication.asmx", • spSoap: • "<?xml version='1.0' encoding='utf-8; ?>" + • "<soap:Envelope xmlns:xsi='http://www.w3.org/2001/XMLSchema-instance' xmlns:xsd='http://www.w3.org/2001/XMLSchema' xmlns:soap='http://schemas.xmlsoap.org/soap/envelope/'>" + • "<soap:Body>" + • "<Login xmlns='http://schemas.microsoft.com/sharepoint/soap/'>" + • "<username>" + window.localStorage.getItem("username") + "</username>" + • "<password>" + window.localStorage.getItem("username") + "<password>" + • "</Login>" + • "</soap:Body>" + • "</soap:Envelope>" • }
SharePoint.Communication = { svcServices: true}; • $.getJSON($("#spSite").val()+"/_vti_bin/listdata.svc/Birthdays",function(data){ • $.each(data.d.results,function(i,item){ • varoutput="<li><ahref='#'data-theme='b'data-icon='gear'>"+$(this).attr("ows_Title")+"</a></li>"; • $("#spListView").append(output); • }); • $("#spListView").listview("refresh"); • });
SharePoint.Communication = { sp2013API: true}; • GetListItems:function(params,onSuccessFunc,onErrorFunc){ • varxhr=$.ajax({ • headers:{ • "Authorization":spListViewModel.cryptBasicAuth(window.localStorage.getItem("username"), • window.localStorage.getItem("password")), • "ACCEPT":"application/json;odata=verbose",//orapplication/atom+xml • "X-RequestDigest":params.formDigest • }, • url:params.spSite, • type:"POST", • dataType:"json", • contentType:"application/json;odata=verbose", • success:onSuccessFunc, • error:onErrorFunc • }); • }
SharePoint.Communication = { sp2013API.Extend: true}; • _api alias for _api_bin/client.svc • All new functionalities in _api are presented in the _api_bin/client.svc as well • Querying is similar to the Managed Client Object Model
SharePoint.Communication = { sp2013API.ServiceEndPoints: […]};
DEMO Service End Points
SharePoint.Communication = { CRUD.Read: {…}}; • GET request • Accept Header • application/json;odata=verbose //or application/atom+xml
DEMO SharePoint.ReadData
SharePoint.Communication = { CRUD.Create: {…}}; • Sending the FormDigest Header • X-RequestDigest header inside the SharePoint context • X-RequestDigest header outside the SharePoint context • __metadata ‘type’ property required • List name dependent • Conflicts with different lists
DEMO SharePoint.CreateData
SharePoint.Communication = { CRUD.Delete: {…}}; • If-Match header • RequestType: ‘DELETE’ • ItemIdentification(ID) • …and do not forget the FormDigest, of course
DEMO SharePoint.DeleteData
SharePoint.Communication = { CRUD.Update: {…}}; • If-Match header – etagidentification • RequestType: ‘PUT’ or ‘MERGE’ • Do I need to mention the FormDigest?
DEMO SharePoint.UpdateData
Diamond Sponsor: Thanks to our Sponsors: Platinum Sponsors: Gold Sponsors: Swag Sponsors: Media Partners:
Expect very soon: SharePoint Saturday! • Saturday, June 8, 2013 • Same familiar format – 1 day filled with sessions focused on SharePoint technologies • Best SharePoint professionals in the region • Registrations will be open next week (15th)! • www.SharePointSaturday.eu