I am running Ajax on a HTML page that is supposed to make a call to a web service and the ajax call is not working to where I don't believe its even going to the web service at all.
Here's the issue: When I click the button, I get an error for the textStatus and nothing for errorThrown. The local host is running within my VS 2013 IDE with a breakpoint and its never getting there. The nature of the project dictates that I use an HTML page and JQuery to pass data collected to the web service for management of the data. But, its as if its never running and every reference I can find says this code is correct. 2 things that concerned me was the use of JSON to supply the parameter of the data contract. How does this work without something converting it to the data contract class. I've also tried many ways to pass the JSON and none seems to change my fortunes. If I could generate an error to debug, that would at least help point me in the right direction, but I get nada... The thing is I've tried this process using a form with an action set to an ashx page and that works, but that seems more of a hack as I would have to smooze something to go back to the calling html page to say your data has been submitted. Plus, I think the Jquery Ajax is a cleaner more elegant solution. There are several methods in this web service that is already functioning for other projects to accept and manage their data and I want to expand it to include the html page data... can anyone see where I'm going wrong here? Thanks much in advance... I've been stumped for the last 2 days with this one and I have to move on.
The code is as follows:
$(document).ready(function () {
// alert("running inside");
var webServiceURL = 'http://localhost:50350/DBMgr.svc/updateData';
var data = "{FirstName:'name',LastName:'surname'}";
alert(data);
$("input[id='btnSubmitLead']").click(function () {
$.ajax({
type: "POST",
url: webServiceURL,
data: data,
dataType: "json",
success: function (results) {
alert("Your information has been sent, thank you... ");
},
error: function (jqXHR, textStatus, errorThrown) {
alert(textStatus +"-"+ errorThrown);
alert("Your information has not been sent ");
}
});
});
My WCF Service:
public LeadData updateData(LeadData loadData)
{
LeadData updateok = new LeadData();
if (loadData.FirstName.Length > 0)
{
updateok.FirstName = "It has";
updateok.LastName = "Been found";
}
else
{
updateok.FirstName = "Name";
updateok.LastName = "Not Found";
}
return updateok;
}
and the declaration is:
[OperationContract]
[WebInvoke(Method="POST", RequestFormat=WebMessageFormat.Json, ResponseFormat=WebMessageFormat.Json)]
LeadData updateData(LeadData loadData);
[DataContract]
public class LeadData
{
[DataMember]
public string FirstName { get; set; }
[DataMember]
public string LastName { get; set; }
}
Oh yes and the HTML includes this:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type=""></script>