Click here to Skip to main content
15,868,016 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
I have created a new "ASP.NET Web Site" which included Extjs javascript framework but I cannot make the ExtJs to call WCF Service via ajax and return result properly. It always shows failure message (return with error number 500 - Internal Server Error).

In my testing website project, it contains the following important files
1. Controller.svc and its codebehind Controller.cs which is in App_Code folder
2. Default.aspx
3. web.config
4. Ext lib files

Please help me to point what is wrong or what configuration I missed.

Codes in Controller.cs file.
C#
using System;
using System.Linq;
using System.Runtime.Serialization;
using System.ServiceModel;
using System.ServiceModel.Activation;
using System.ServiceModel.Web;
using System.Diagnostics;
[ServiceContract(Namespace = "")]
[AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)]
public class Controller
{
    [OperationContract]
    [WebInvoke(BodyStyle = WebMessageBodyStyle.WrappedRequest,
               RequestFormat = WebMessageFormat.Json,
               ResponseFormat = WebMessageFormat.Json,
               UriTemplate = "/Add")]
    public int Add(int a, int b)
    {
        Debug.WriteLine("Adding....");
        return a + b;
    }
}

Codes in Default.aspx file.
XML
<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!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>
    <link rel="stylesheet" type="text/css" href="scripts/ext-3.2.1/resources/css/ext-all.css" />
    <!-- LIBS -->
    <script type="text/javascript" src="scripts/ext-3.2.1/adapter/ext/ext-base.js"></script>
    <script type="text/javascript" src="scripts/ext-3.2.1/ext-all.js"></script>

    <script type="text/javascript" language="javascript">
        Ext.onReady(function() {
            var aVal = 5;
            var bVal = 7;
            var params = { a: aVal, b: bVal };
            Ext.lib.Ajax.defaultPostHeader = 'application/json';
            Ext.Ajax.request({
                url: 'Controller.svc/Add',
                method: 'POST',
                params: Ext.encode(params),
                success: function(response, options) {
                    alert("sucess: " + response.responseText);
                    Ext.MessageBox.alert('sucess', 'Succeed to add values')
                },
                failure: function(response, options) {
                    alert("failure: " + response.responseText);
                    Ext.MessageBox.alert('Failed', 'Unable to add values');
                }
            });
        });       // End of Ext.onReady
    </script>
  </head>
<body>
    <form id="form1" runat="server">
    <div>
    </div>
    </form>
</body>
</html>

Codes in web.config file:
XML
<configuration>
.
.
.
    <system.serviceModel>
        <behaviors>
            <endpointBehaviors>
                <behavior name="ControllerAspNetAjaxBehavior">
                    <enableWebScript />
                </behavior>
            </endpointBehaviors>
  </behaviors>
        <serviceHostingEnvironment aspNetCompatibilityEnabled="true" />
        <services>
   <service name="Controller">
    <endpoint address="" behaviorConfiguration="ControllerAspNetAjaxBehavior"
     binding="webHttpBinding" contract="Controller" />
   </service>
  </services>
    </system.serviceModel>
</configuration>
Posted
Updated 25-Nov-10 21:49pm
v6

1 solution

After taking a few days to investigate I can make it work now. I would like to share my solution just in case anyone having a problem like me ;)

Codes in Controller.cs must be like below

C#
using System;
using System.Linq;
using System.Runtime.Serialization;
using System.ServiceModel;
using System.ServiceModel.Activation;
using System.ServiceModel.Web;
using System.Diagnostics;
[ServiceContract(Namespace = "")]
[AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)]
public class Controller
{
    [OperationContract]
    [WebInvoke(Method = "POST", // Even though the default is POST but I think there is a bug that sometimes make it not working so it would be better to specify
               BodyStyle = WebMessageBodyStyle.Wrapped,
               RequestFormat = WebMessageFormat.Json,
               ResponseFormat = WebMessageFormat.Json)]
    public int Add(int a, int b)
    {
        Debug.WriteLine("Adding....");
        return a + b;
    }
}



There is nothing changed in Default.aspx

And There is something must be specific in Web.config as below

XML
<configuration>
.
.
.
<system.serviceModel>
    <behaviors>
        <!-- string of adding new section -->
        <serviceBehaviors>
          <behavior name="WebScriptBehavior">
            <serviceMetadata httpGetEnabled="true"/>
            <serviceDebug includeExceptionDetailInFaults="true"/>
          </behavior>
        </serviceBehaviors>
        <!-- end of adding new section -->
        <endpointBehaviors>
          <behavior name="WebScriptBehavior">
            <webHttp />  <!-- change from enableWebScript /-->
          </behavior>
        </endpointBehaviors>
    </behaviors>
    <serviceHostingEnvironment aspNetCompatibilityEnabled="true" />
    <services>
      <service name="Controller">
         <endpoint address="" contract="Controller"
                   behaviorConfiguration="WebScriptBehavior"
                   binding="webHttpBinding"/>
      </service>
    </services>
 </system.serviceModel>
</configuration>
 
Share this answer
 
v4
Comments
Dalek Dave 26-Nov-10 4:20am    
Great Answer.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS


CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900