Home > .NET > JQuery & JSON in .NET 2

JQuery & JSON in .NET 2

2012/08/20

Sometimes is hard to return to old technologies, because many things are changed.

Now i’m developing a site where is requested .NET 2 because there is a existing site that should be rewritten (absolutely postback-based…) , but for now is requested some work for a calendar where i’m using the Fullcalendar JQuery plugin (without postback).

Five years ago i began to work in Ajax using the Microsoft Ajax technologies and the Ajax toolkit, that for example was having a specific object for calling page methods from Javascript.

Now i’m working with JQuery , also with SharePoint, from some years , and to return to .NET 2 with Visual Studio 2008 (yes,was requested also this…) was a bit difficult.

So now i have a little todo list ..

First , download the ASP.NET Ajax 1 for .NET 2 from http://www.microsoft.com/en-us/download/confirmation.aspx?id=883

The Ajax Toolkit is not strictly required.

In the ASP.NET project add a reference to C:\Program Files\Microsoft ASP.NET\ASP.NET 2.0 AJAX Extensions\v1.0.61025\System.Web.Extensions.dll

Doing this is automatically added an “<assemblies> ” section :

<add assembly=”System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35″/>

in the web.config ( this is done working with Visual Studio 2008 Team System SP1).

Apparently a static page method inside an aspx page does not work , it is requested to add an asmx web service.

A sample code could be this AgendaSvc.asmx:

using System;
using System.Collections.Generic;
using System.Web;
using System.Web.Services;
using System.Web.Script.Services;
[WebService(Namespace = "<a href="http://tempuri.org/">http://tempuri.org/</a>")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.ComponentModel.ToolboxItem(false)]
[ScriptService]
public class AgendaSvc : System.Web.Services.WebService
{
   [WebMethod]
   [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
   public string TestJSON()
   {
      return "test"; // ok, is not JSON, only for sample
   }
}

And the calling code:

$.ajax({
   type: "POST",
   url: "AgendaSvc.asmx/TestJSON",
   data: "{}",
   async: true,
   contentType: "application/json; charset=utf-8",
   dataType: "json",
   complete: callbackFunction
});
 

And this works.

The problems begins if you need to pass a value , for example in javascript

data: "{'value': 'aa'}",

And then in the asmx code behind

public string TestJSON(string value)

This does not work until in the web.config is added

<httpHandlers>
    <remove verb="*" path="*.asmx"/>
    <add verb="*" path="*.asmx" type="System.Web.Script.Services.ScriptHandlerFactory" validate="false"/>
</httpHandlers>

Inside the <system.web> section.

If i use a class as response , for example

public class WmJsonGenericResponse
{
   string _Value;
   public string Value
   {
      get
      {
         return _Value;
      }
      set
      {
         _Value = value;
      }
   }
}

I can write

[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public WmJsonGenericResponse TestJSON(string value)
{
   WmJsonGenericResponse objTest = new WmJsonGenericResponse();
   objTest.Value = "aaa";
   return objTest;
}

And then the callback javascript routine can be written as

function callbackFunction(xData, status) {
   if (status == "success") {
      var objJson = jQuery.parseJSON(xData.responseText);
      if(objJson.Value ==  "aaa") ....

As i usually do in .NET 4

Advertisements
Categories: .NET
%d bloggers like this: