Dotnetnuke Call ajax from the module

Question

Now I am trying to create a dnn module using ajax calls. But there is a jquery error which indicates

Syntax Error: Unexpected Token <

I tried working with ajax "url:" and tried to create a new ascx in the root folder, but still showing a 404 error.

My ajax call is below

$.ajax({ url: "NewsManagement.ascx/Add", contentType: "application/json; charset=utf-8", dataType: "json", method: "POST", beforeSend: function () { }, cache: false, data: { title : $('#txt_Title').val(), news_content : $('#txt_Content').val(), image : $('#file_Image').val(), chapter_id : $('#sel_Chapter').val(), is_draft : $('#chk_Draft').val(), posted_date : $('#dp_PostDate').val(), created_by : "", lastupdate_by : "" }, success: function (data) { console.log(data); if (data == "success") { console.log(data); } else { initMdlError("SERVER : " + data); } }, error: function (data, textStatus, error) { // ERROR IS BEING CALLED FROM HERE console.log("JQUERY JAVASCRIPT : " + error); initMdlError(error); }, complete: function () { console.log('complete'); } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 

Is there any way to solve the problems?

Answer 1

The problem you are working with is that DNN does not correctly handle the requested URL that you are calling. If you want to call the service URL in DNN, you need to set up routes to handle calls.

 namespace Christoc.Com.Modules.SlidePresentation.services { public class SlidePresentationRouteMapper : IServiceRouteMapper { public void RegisterRoutes(IMapRoute mapRouteManager) { mapRouteManager.MapRoute("SlidePresentation", "{controller}.ashx/{action}", new[] {"Christoc.Com.Modules.SlidePresentation.services"}); } } } 

In the controller you can define the available methods

 [DnnAuthorize(AllowAnonymous = true)] public ActionResult ListOfSlides() { try { var slides = Slide.GetSlides(ActiveModule.TabID, ActiveModule.ModuleID); return Json(slides, JsonRequestBehavior.AllowGet); } catch (Exception exc) { DnnLog.Error(exc); return Json(null, JsonRequestBehavior.AllowGet); } } 

https://slidepresentation.codeplex.com/SourceControl/latest#DesktopModules/SlidePresentation/services/SlidePresentationController.cs

javascript sample

  //get slides on initialization this.init = function(element) { //var data = {}; //removed because we don't need this //data.moduleId = moduleId; //removed because we don't need this when calling setModuleHeaders //data.tabId = tabId; //removed because we don't need this //serviceFramework.getAntiForgeryProperty(); //removed because we don't need this $.ajax({ type: "POST", cache: false, url: baseServicePath + 'ListOfSlides', //data: data, //dataType:"json", beforeSend: serviceFramework.setModuleHeaders }).done(function(data) { viewModel.slides = ko.utils.arrayMap(data, function(s) { return new slide(s); }); ko.applyBindings(viewModel); $(element).jmpress(); }).fail(function () { Console.Log('Sorry failed to load Slides'); }); }; 

Here's an example module that does this

https://slidepresentation.codeplex.com/

And the user group video that I made a few years ago in this module. https://www.youtube.com/watch?v=hBqn5TsLUxA