• Save
jsSaturday - PhoneGap and jQuery Mobile for SharePoint 2013
Upcoming SlideShare
Loading in...5

jsSaturday - PhoneGap and jQuery Mobile for SharePoint 2013






Total Views
Views on SlideShare
Embed Views



0 Embeds 0

No embeds



Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
Post Comment
Edit your comment
  • Question for the public: Which design pattern do you see in the index.html and js files?
  • Explain: www folder, content type for new files Explain the interaction between HTML and JS file – creates custom events AFTER device ready Show debugging information – App.cs file Show Config.xml file – the app manifest, explain about plugins
  • Open the feeds in the browser:'Birthdays')/items'Birthdays')/items(1)

jsSaturday - PhoneGap and jQuery Mobile for SharePoint 2013 jsSaturday - PhoneGap and jQuery Mobile for SharePoint 2013 Presentation Transcript

  • PhoneGapAnd_jQueryMobileFor SharePointvar 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 librariesthat allow you to build native mobileapplications for multiple devices.* * PhoneGap Site
  • What is PhoneGap? Re-usability
  • PhoneGap.ProjectStrucutre The www folder App Init – index.js and index.html Enable debug information Loading plugins App information
  • DEMOPhoneGap 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) {          var output = "<li><a href=# 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) {          var xhr = $.ajax({              headers: {                  "Authorization": spListViewModel.cryptBasicAuth(window.localStorage.getItem("username"),       window.localStorage.getItem("password")),                  "ACCEPT": "application/json;odata=verbose", //or application/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: […]};Area Access pointSite http://sitecollection/_api/siteWeb http://sitecollection/_api/web http://User Profile sitecollection/_api/SP.UserProfiles.Peo pleManagerSearch http://sitecollection/_api/searchPublishing http://sitecollection/_api/publishing
  • DEMOService End Points
  • SharePoint.Communication = { CRUD.Read: {…}};• GET request• Accept Header • application/json;odata=verbose //or application/atom+xml
  • DEMOSharePoint.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
  • DEMOSharePoint.CreateData
  • SharePoint.Communication = { CRUD.Delete: {…}};• If-Match header• RequestType: ‘DELETE’• ItemIdentification(ID)• …and do not forget the FormDigest, of course
  • DEMOSharePoint.DeleteData
  • SharePoint.Communication = { CRUD.Update: {…}};•If-Match header – etag identification•RequestType: ‘PUT’ or ‘MERGE’•Do I need to mention the FormDigest?
  • DEMOSharePoint.UpdateData
  • Thanks to our Sponsors:Diamond Sponsor: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