In this post, I will show you how to pass complex JSON data from jquery to WCF service.
- Create a new website in visual studio.
- Add a new item WCF service named BlogService and replace the existing code with following
IBlog.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Runtime.Serialization;
using System.ServiceModel;
using System.Text;
using System.ServiceModel.Web;
[ServiceContract]
public interface IBlog
{
[WebInvoke(UriTemplate = "blogs", Method = "POST",
BodyStyle = WebMessageBodyStyle.WrappedRequest,
RequestFormat = WebMessageFormat.Json,
ResponseFormat = WebMessageFormat.Json)]
[OperationContract]
string SubmitBlock(Blog blogs);
}
IBlogService.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Runtime.Serialization;
using System.ServiceModel;
using System.Text;
using System.ServiceModel.Web;
using System.ServiceModel.Activation;
[ServiceBehavior]
public class BlogService : IBlog
{
List<Blog> _blogs = null;
[OperationBehavior]
public string SubmitBlock(Blog blogs)
{
//Process your data.
}
}
[DataContract]
[KnownType(typeof(BlogPost))]
public class Blog
{
[DataMember]
public string BlogID { get; set; }
[DataMember]
public string Title { get; set; }
[DataMember]
List<BlogPost> Blogs { get; set; }
}
[DataContract]
public class BlogPost
{
[DataMember]
public string BlogPostID { get; set; }
[DataMember]
public string BlogID { get; set; }
[DataMember]
public string BlogContent { get; set; }
}
- Open web.config and made highlighted changes
<?xml version="1.0"?>
<!--
For more information on how to configure your ASP.NET application, please visit
http://go.microsoft.com/fwlink/?LinkId=169433
-->
<configuration>
<system.web>
<compilation debug="true" targetFramework="4.0"/>
</system.web>
<system.serviceModel>
<services>
<service behaviorConfiguration="Service1Behavior" name="BlogService">
<endpoint address="" binding="webHttpBinding" behaviorConfiguration="EnableScript" contract="IBlog">
<identity>
<dns value="localhost"/>
</identity>
</endpoint>
<endpoint address="mex" binding="mexHttpBinding" contract="IMetadataExchange"/>
</service>
</services>
<behaviors>
<endpointBehaviors>
<behavior name="EnableScript">
<webHttp></webHttp>
</behavior>
</endpointBehaviors>
<serviceBehaviors>
<behavior name="Service1Behavior">
<serviceMetadata httpGetEnabled="true"/>
<serviceDebug includeExceptionDetailInFaults="true"/>
</behavior>
</serviceBehaviors>
</behaviors>
<serviceHostingEnvironment multipleSiteBindingsEnabled="false" />
</system.serviceModel>
</configuration>
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
var DTO =
{
"BlogID": "1",
"Title": "Aspdotnetcodebook",
"Blogs": [
{
"BlogPostID": "1",
"BlogID": "1",
"BlogContent": "This is my first post"
},
{
"BlogPostID": "2",
"BlogID": "1",
"BlogContent": "This is my second post."
}
]
};
var blogs1 = {blogs: DTO };
$(document).ready(function () {
$.ajax(
{
type: "POST",
contentType: "application/json; charset=utf-8",
dataType: "json",
processdata:false,
data:JSON.stringify(blogs1),
url: "http://localhost:6548/Blog/BlogService.svc/blogs",
success: function (data) {
alert(data);
}
}
);
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
</form>
</body>
</html>
Tags:
WCF