This is how I do it (Note: this will only work with DNN6.2 and above);
In the View.ascx.cs add
protected override void OnInit(EventArgs e) { base.OnInit(e); ServicesFramework.Instance.RequestAjaxScriptSupport(); ServicesFramework.Instance.RequestAjaxAntiForgerySupport(); jQuery.RequestDnnPluginsRegistration(); }
This ensures that jquery and the required DNN ajax plugins are added.
Initiate the services framework jquery plugin in the View.ascx like this inside javascript script tags (S.O. wouldn't allow me to include them)
var modId = <%=ModuleId %>; var sf = $.ServicesFramework(modId);
- Now in a separate javascript file or in the view.ascx control add the ajax function
function getAllItems(){ $.ajax({ type:"GET", url:sf.getServiceRoot("MyProject")+"Service/GetAllItems", beforeSend:sf.setModuleHeaders, data:{moduleId:modId}, cache:false }).done(function(data){ alert("Success!"); }).fail(function(){ alert("Crashed!"); }).always(function(){ //something you want done whether passed or failed //like hide progress bar, ajax spinner etc. }); }
The DNN jquery plugin will build the url which will look similar to this (Note: 142 is just for illustration purpose and will be replace with actual module id)
/DesktopModules/MyProject/API/Service/GetAllItems?moduleId=142