This is a migrated thread and some comments may be shown as answers.

Using Jsonp to Call Ajax Enabled web service Cant get it work

1 Answer 93 Views
Data Source
This is a migrated thread and some comments may be shown as answers.
Max
Top achievements
Rank 1
Max asked on 10 Oct 2012, 07:20 AM
Hi

this is the javascript i am using :
dataSourceTest = new kendo.data.DataSource({
    //read the data from webservice
    transport: {
        read: {                 
            url: ServiceBaseUrl,           
            type: "GET",
            dataType: "jsonp",                      
            contentType: 'application/json',          
            complete: function(data) {           
                if (data.success && data.code) eval(data.code);
                if (data.success) {
                    alert(  data.responseText );
                    res =JSON.stringify( data.responseText);         
                }
                else alert("ERROR:" + data.message);
            }
        },   
        parameterMap: function (data, operation) {
           // debugger;
            if (operation !== "read") {
                return JSON.stringify({ datas: data.models });
            }
        },
        schema: {                            
            model: {
            id: "_EmployeeID",
            fields: {
                _EmployeeID: { type: "string", hidden: true ,editable:false},
                _Adress:{type:"string"},
                _City :{type:"string"},
                _Country: {type:"string"},              
                _Extension:{type:"string"},
                _FirstName:{type:"string"},
                _HomePhone :{type:"string"},
                _LastName:{type:"string"},
                _Notes: { type: "string", hidden: true },
                _PostalCode: {type:"string"},
                _Region:{type:"string"},
                _Title :{type:"string"},
                _TitleOfCourtesy: { type: "string" },
                _BirthDate:{type :"date"},
                _HireDate: {type:"date"}
            },//fields
        },//model     
     },//schema
    },
});
$(document).ready(function () {  
$("#TestGrid").kendoGrid({
    dataSource: dataSourceTest,
    pageable: true,
    scrollable: false,
    navigatable: true,
    columns: [
      { field: "_FirstName", title: "FirstName" },
      { field: "_LastName", title: "LastName" },
      { field: "_Adress", title: "Address" },
      { field: "_City", title: "City" },
      { field: "_Country", title: "Country" },
      { field: "_Extension", title: "Extension" },   
      { field: "_HomePhone", title: "HomePhone" },   
      { field: "_Notes", title: "Notes" , hidden: true},
      { field: "_PostalCode", title: "PostalCode" },
      { field: "_Region", title: "Region" },
      { field: "_Title", title: "Title" },
      { field: "_TitleOfCourtesy", title: "TitleOfCourtesy" },
      { field: "_BirthDate", title: "Birth Date", template: '#= kendo.toString(_BirthDate,"dd/MM/yyyy , hh:mm:ss ")#' },
      { field: "_HireDate", title: "Hire Date", template: '#= kendo.toString(_HireDate,"dd/MM/yyyy") #' } hh:mm:ss => adding this will format te time 
    ],
     pageable: {
        refresh: true,
        pageSizes: true
     },
      filterable: true,
      columnMenu: true,
      sortable: true,
      dataBound: function(e) {
      displayFilterResults();
      },
});
});

this is the web service method i am calling :
[OperationContract]
   [WebInvoke(Method = "GET", UriTemplate = "/GetEmployeeData", ResponseFormat = WebMessageFormat.Json)]
   public IEnumerable<EmployeeTest> GetEmployeeData()
   {
       dbContext = new EntitiesModel();
       using (EntitiesModel dbcontext = new EntitiesModel())
       {
           var Emp = (from p in dbcontext.Employees
                      select new EmployeeTest
                      {
                          _Adress = p.Address,                         
                          _City = p.City,
                          _Country = p.Country,
                          _EmployeeID = (p.EmployeeID).ToString(),
                          _Extension = p.Extension,
                          _FirstName = p.FirstName,                        
                          _HomePhone = p.HomePhone,
                          _LastName = p.LastName,
                          _Notes = p.Notes,
                          _PostalCode = p.PostalCode,
                          _Region = p.Region,
                          _Title = p.Title,
                          _TitleOfCourtesy = p.TitleOfCourtesy,
                         // _HireDate=p.HireDate,
                        //  _BirthDate=p.BirthDate
                      }).ToList();
           //JavaScriptSerializer Ser = new JavaScriptSerializer();
           //Ser.Serialize(Emp);
           return  Emp;
       }
   }
this is the config :
<system.web.extensions>
   <scripting>
     <webServices>
       <jsonSerialization maxJsonLength="2147483647" />
     </webServices>
   </scripting>
 </system.web.extensions>
  
 <system.serviceModel>
   <behaviors>
     <endpointBehaviors>
       <behavior name="webHttpBehavior">
         <dataContractSerializer maxItemsInObjectGraph="10000000" />
         <webHttp />
       </behavior>
     </endpointBehaviors>
     <serviceBehaviors>
       <behavior name="">
         <serviceMetadata httpGetEnabled="true" />
         <serviceDebug includeExceptionDetailInFaults="true" />
       </behavior>
     </serviceBehaviors>
   </behaviors>
   <bindings>
     <!-- for passing data with jsonp-->
     <webHttpBinding>
       <binding name="webHttpBindingWithJsonP" crossDomainScriptAccessEnabled="true" maxBufferSize="2147483644" maxReceivedMessageSize="2147483644" transferMode="Buffered">
         <readerQuotas maxStringContentLength="2147483644" />
       </binding>
 
     </webHttpBinding>
   </bindings>
   <!--<behaviors>
     <serviceBehaviors>
       <behavior name="ServiceAspNetAjaxBehavior">
         <serviceMetadata httpGetEnabled="true"  />
         <serviceDebug includeExceptionDetailInFaults="true"  />
       </behavior>
        
     </serviceBehaviors>
     <endpointBehaviors>      
       <behavior name="ServiceAspNetAjaxBehavior" />
     </endpointBehaviors>
   </behaviors>-->
    
   <serviceHostingEnvironment aspNetCompatibilityEnabled="true" multipleSiteBindingsEnabled="true" />
 
   <services>
     <!-- for passing data with jsonp-->
     <service name="TestTelerikWCF.ServiceTelerikTest">
       <endpoint address="" bindingConfiguration="webHttpBindingWithJsonP" binding="webHttpBinding"  contract="TestTelerikWCF.ServiceTelerikTest" behaviorConfiguration="webHttpBehavior" />
     </service>
   </services>
    
   <standardEndpoints>
     <webScriptEndpoint>
       <standardEndpoint name="" crossDomainScriptAccessEnabled="true"/>
     </webScriptEndpoint>
   </standardEndpoints>
 </system.serviceModel>
 <system.webServer>
   <modules runAllManagedModulesForAllRequests="true"/>
 </system.webServer>

this is the html code:
<!DOCTYPE html>
<html>
<head>
    <link href="styles/kendo.common.css" rel="stylesheet" />
    <link href="styles/kendo.default.css" rel="stylesheet" />
    <!--<link href="styles/kendo.silver.css" rel="stylesheet" />-->
    <title></title>
    <script src="jquery-1.8.2.js" ></script>
    <script src="js/kendo.all.min.js" ></script>
    <script src="KendoGridjs.js" ></script>
    
</head>
<body>
   <div id="TestGrid"></div>
</body>
</html>

need help cant get it working and cant find what i am doing wrong

thanks.

1 Answer, 1 is accepted

Sort by
0
Max
Top achievements
Rank 1
answered on 10 Oct 2012, 02:07 PM
problem solved 
Tags
Data Source
Asked by
Max
Top achievements
Rank 1
Answers by
Max
Top achievements
Rank 1
Share this question
or