jQuery UI autocomplete error via Web Service/JSON response - c#

I've been trying to get this to work for a few hours now but can't see where I'm going wrong.
I've been checking Firebug for the server response and it retrieves the json data via .asmx web service fine. The only error i have to go off is the one in firebug that's triggered when 2 or more characters are typed in:
TypeError: c.settings[d].call is not a function
jQuery Code Snippet:
$(document).ready(function () {
$("#<%= txtCustomer.ClientID %>").autocomplete({
minLength: 2,
async: true,
source: function(request, response) {
$.ajax({
url: "../Services/AJAXHandler.asmx/GetCustomers",
data: "{'filter':'" + request.term + "'}",
dataType: "json",
type: "POST",
contentType: "application/json; charset=utf-8",
dataFilter: function (data) { return data; },
success: function (data) {
response($.map(data.d, function(item) {
return {
label: item.customerName
};
}));
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
var errorMessage = "Ajax error: " + this.url + " : " + textStatus + " : " + errorThrown + " : " + XMLHttpRequest.statusText + " : " + XMLHttpRequest.status;
if (XMLHttpRequest.status != "0" || errorThrown != "abort")
{
alert(errorMessage);
}
}
});
}
});
If anybody could point me in the right direction that would be brilliant.

Related

How can I call an ASP.Net string function with jQuery AJAX?

I have a string function ASP.Net Webform. I want to call this function using AJAX.
That function returns a string value from database with a month index
protected string BringDatas(int month)
{
Counts counts_ = new Counts();
return counts_.GetMonths(month);
}
var dataValue = { "month": 1 };
$.ajax({
type: "POST",
url: "Homepage.aspx/BringDatas",
data: dataValue,
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert("Request: " + XMLHttpRequest.toString() + "\n\nStatus: " + textStatus + "\n\nError: " + errorThrown);
},
complete: function (jqXHR, status) {
alert("complete: " + status + "\n\nResponse: " + jqXHR.responseText);
}
});
Give it a try:
Code Behind:
[WebMethod(EnableSession = true)]
[ScriptMethod(UseHttpGet = true, ResponseFormat = ResponseFormat.Json)]
public static string BringDatas(int month)
{
Counts counts_ = new Counts();
return counts_.GetMonths(month);
}
ajax call
$.ajax({
type: 'GET',
url: 'Homepage.aspx/BringDatas',
data: '{"month": 1}',
contentType: "application/json; charset=utf-8",
dataType: 'json',
async: false,
success: function (response) {
alert("Response: " + response.d);
},
error: function (response) {
}
});
This is javascript side
<script type="text/javascript">
$(document).ready(
function () {
$("#Gonder").click(
function () {
$.ajax
({
type: "POST",
url: "Homepage.aspx/OrnekPost",
data: "{'parametre':'1234'}",
contentType: "application/json; charset=utf-8",
dataType: "text",
success: function (output) {
alert("Response: "+ output);
}, error: function () {
alert("hata var");
}
});
});
})
</script>
Codebehind.cs code
[ScriptMethod]
[WebMethod(EnableSession = true)]
public static string OrnekPost(string parametre)
{
return parametre + " değeriyle post işlemi gerçekleştirildi.";
}

jqplot - pass variable via ajax to C# page

I am unable to retrieve values passed by $.ajax on my c# page.
I am using jqplot and I want to pass two pieces of information. One is stored in a hidden field called 'hidden_plateid' and the second piece of information is from a dropdown box called 'SampleNumberList'
This is the hidden field
<input type="text" name="hidden_plateID" id="hidden_plateID" hidden="hidden" runat="server" />
And this is the drop down box:
<select name="SampleNumberList" class="DropDownBox_editjob" id="SampleNumberList">
<option value="--SELECT--"></option>
<option value="001r">001r</option>
<option value="002r">002r</option>
</select>
I simply then say that everytime, someone selects from the dropdown box, to get and get the information from the db and plot the graph
$('#SampleNumberList').on('change', function (e) {
var ajaxDataRenderer = function (url, plot, options) {
var ret = null;
$.ajax({
data: {
PlateID2: options.PlateID,
SampleID2: options.SampleID,
},
async: false,
url: url,
dataType: "json",
success: function (data) {
alert(data);
ret = data;
},
error: function (xhr, err) {
alert("readyState: " + xhr.readyState + "\nstatus: " + xhr.status);
alert("responseText: " + xhr.responseText);
}
});
return ret
};
var jsonurl = "SpectraData.aspx";
var plot2 = $.jqplot('chartdiv', jsonurl, {
title: "AMIRA",
dataRenderer: ajaxDataRenderer,
dataRendererOptions: {
unusedOptionalUrl: jsonurl, PlateID: $('#hidden_plateID').val(), SampleID: $('#SampleNumberList').val()
}
});
});
I use Request.Querystring to try and retrieve the value in the c# file but so far, I get nothing
if (Request.QueryString["PlateID2"] != null)
{
PlateID = Request.QueryString["PlateID2"].ToString();
}
if (Request.QueryString["SampleID2"] != null)
{
SampleID = Request.QueryString["SampleID2"].ToString();
}
You are trying to retrieve values from a query string , yet you are passing the parameters as json.
In order to retrieve them as a query string params, you need to pass them along your url.
$.ajax({
async: false,
url: url + "?PlateID2=" + options.PlateID + "&SampleID2=" + options.SampleID + "",
dataType: "json",
success: function (data) {
alert(data);
ret = data;
},
error: function (xhr, err) {
alert("readyState: " + xhr.readyState + "\nstatus: " + xhr.status);
alert("responseText: " + xhr.responseText);
}
});
In reality, the right way to do this is to pass params as a json string and intercept in the code behind.
$.ajax({
url: url/Somemethod,
type: 'POST',
dataType: 'json',
data: "{'PlateID2':'" + options.PlateID + "','SampleID2':'" + options.SampleID + "'}",
success: function (data) {
alert(data);
ret = data;
},
error: function (xhr, err) {
alert("readyState: " + xhr.readyState + "\nstatus: " + xhr.status);
alert("responseText: " + xhr.responseText);
}
});
In your codebehind :
[WebMethod]
public static void Somemethod(string PlateID2,string SampleID2)
{
}

Asp.net ajax request (internal server error)

i create web method and create ajax request to call this web method i have internal server error but when i call webservice from URL direct is working fine my ajax request :
$(document).ready(function () {
$('#btnsave').click(function () {
var x = 'sss';
$.ajax({
url: "/WS/WS.asmx/AddCustomer",
type: 'GET',
dataType: 'json',
data: { CustomerType: x },
contentType: 'application/json; charset=utf-8',
error: function (XMLHttpRequest, textStatus, errorThrown){
alert("Request: " + XMLHttpRequest.toString() + "\n\nStatus: " + textStatus + "\n\nError: " + errorThrown);
},
success: function (response) {
if (response.d) {
}
}
});
});
});`
try this, look (data: "{CustomerType:'" + x+ "'}",)...
$(document).ready(function () {
$('#btnsave').click(function () {
var x = 'sss';
$.ajax({
url: "/WS/WS.asmx/AddCustomer",
type: 'GET',
dataType: 'json',
data: "{CustomerType:'" + x+ "'}",
contentType: 'application/json; charset=utf-8',
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert("Request: " + XMLHttpRequest.toString() + "\n\nStatus: " + textStatus + "\n\nError: " + errorThrown);
},
success: function (response) {
if (response.d) {
}
}
});
});
});
I had the same bug, see below the code, it works for me although if it doesn't work, change type: 'POST'.
$.ajax({
url: 'your URL',
type: 'GET',
contentType: "application/json; charset=utf-8",
datatype: 'JSON'
}).fail(function (jqXHR, textStatus, errorThrown) {
alert(textStatus + " : " + errorThrown);
}).done(function (JSData) {
for (var i = 0; i < JSData.length; i++){
//your code
}
});

JSON-data to WebMethod using jQuery returning errors

I'm trying to send a json list populated with the id's from the 'data-seq' attribute only when the 'value' == true.
I have tried out a lot solution but it keeps getting me error messages, the most common are "there is no parameterless constructor for the type string" when using string[] or "string is not supported for deserialization of an array" when using string as code-behind parameter in the WebMethod.
function sentData() {
var json = [];
$('.btn[value="true"]').each(function () {
var obj = {
id: $(this).attr("data-seq")
};
json.push(obj);
});
json = JSON.stringify({ jsonList: json });
console.log(json); // {"jsonList":[{"id":"38468"},{"id":"42443"},{"id":"42444"}]} (the right id's are getting stored)
$.ajax({
type: "POST",
async: true,
url: "Default.aspx/getList",
dataType: "json",
data: json,
contentType: "application/json; charset=utf-8",
error: function (jqXHR, textStatus, errorThrown) {
console.log('bad, ' + errorThrown + ", " + jqXHR.responseText + ", " + textStatus);
},
success: function(json){
//do something with the result
}
});
return false;
}
// Code-Behind
[WebMethod]
[ScriptMethod(UseHttpGet = false)]
public static void getList(string jsonList)
{
// string: string is not supported for deserialization of an array
// string[]: there is no parameterless constructor for the type string
}
You are just sending IDs so send them as comma-separated string like this:
function sentData() {
var json = [];
$('.btn[value="true"]').each(function () {
var id = $(this).attr("data-seq")
json.push(id);
});
$.ajax({
type: "POST",
async: true,
url: "Default.aspx/getList",
dataType: "json",
data: '{jsonList: "' + json + '" }',
contentType: "application/json; charset=utf-8",
error: function (jqXHR, textStatus, errorThrown) {
console.log('bad, ' + errorThrown + ", " + jqXHR.responseText + ", " + textStatus);
},
success: function(json){
//do something with the result
}
});
return false;
}
And Code-Behind:
[WebMethod]
[ScriptMethod(UseHttpGet = false)]
public static void getList(string jsonList)
{
List<string> ListOfIDs = jsonList.Split(',').ToList();
}

returning complete page HTML instead of string output in JSON response

I am trying to achieve a simplest task through ajax using web method . My web method as follow
[WebMethod]
public static string GetDate()
{
return string.Format("says {0}", DateTime.Now.ToString("r"));
}
and ajax code as follow
$(document).ready(function() {
$("#Result").click(function() {
alert('Result Clicked');
$.ajax(
{
type: "POST",
url: "test1.aspx/GetDate",
data : "{}",
contentType: "application/json",
dataType: "json text",
success: function(rsp) {
alert('success');
alert(rsp);
alert(rsp.d);
$('#Result').append(rsp.d);
},
error: function(rsp) {
alert(rsp.status + " " + rsp.statusText + "</br>" + rsp.responseText);
console.log(rsp);
console.log(rsp.responseText);
}
});
});
});
but status says OK and 200 status code, but instead of simple string in rsp.d its shows complete HTML of that page self.
You Can Try this Code May be it is Help Full.
$("#Result").click(function () {
alert('Result Clicked');
$.ajax(
{
type: "POST",
url: "Default.aspx/GetDate",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (rsp) {
alert('success');
alert(rsp);
alert(rsp.d);
$('#Result').append(rsp.d);
},
error: function (rsp) {
alert(rsp.status + " " + rsp.statusText + "</br>" + rsp.responseText);
}
});
});

Categories