I have been trying like the dickens to have a web service called from jQuery using the $.ajax method through IE, but it just does not seem to work. I've looked through Stackoverflow and a veritable amount of Google searches, but none of the solutions people have come up with have worked for me.
The following is how things are set up...
The jQuery call:
function PerformPainPointDataSubmit() {
var coordString = "";
var mapAreas = $('map[id$=body_profile_map]').find('area');
mapAreas.each(function() {
if ($(this).attr('shape').toLowerCase() == "circle") {
coordString += $(this).attr('coords') + ';';
}
});
$.ajax({
type: "POST",
url: "../../LandingPageWebService.asmx/PerformPainPointDataSubmit",
data: JSON.stringify({ "coords": coordString }),
//data: "{'coords':'" + coordString + "'}", // Doesn't work
//data: '{ "coords": "' + coordString + '" }' // Also doesn't work
contentType: "application/json; charset=utf-8",
datatype: "json",
async: true,
cache: false,
success: function(data) {
alert("success: " + status);
},
failure: function(msg) {
alert("fail: " + msg);
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
debugger;
}
});
//$.delay(1000); <-- Explained a little further down
//return false;
}
Please note that the success, failure and error functions never get called.
The following is the definition for LandingPageWebService class (some database code has been removed):
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.Web.Script.Services.ScriptService]
public class LandingPageWebService : System.Web.Services.WebService {
[WebMethod(EnableSession=true)]
public bool PerformPainPointDataSubmit(string coords)
{
string hotSpotCoords = string.Empty;
string[] coordsSplit = coords.Split(new char[] { ';' }, StringSplitOptions.RemoveEmptyEntries);
// parse the string and make sure we only have
// values and nothing else.
foreach (string spl in coordsSplit)
{
string[] indCoords = spl.Split(new char[] { ',' }, StringSplitOptions.RemoveEmptyEntries);
if (indCoords.Length != 3)
{
return false;
}
int x = 0;
int y = 0;
try
{
x = int.Parse(indCoords[0]);
y = int.Parse(indCoords[1]);
}
catch (FormatException formEx)
{
return false;
}
hotSpotCoords += x + "," + y + ";";
}
// snipped out Database saving code
return true;
}
The jQuery function is called fron an OnClientClick within a Button:
<asp:Button ID="btnSave" Text="Save" runat="server" OnClientClick="PerformPainPointDataSubmit();CloseWin()" CssClass="STD_Button" ValidationGroup="vgEditClinicalSummary" CausesValidation="true" />
The page itself is in a modal dialog that is closed when the 'Save' button is clicked. The web service is called in Chrome and Firefox without any problems, no matter how many times I call it. However with IE it becomes a crap shoot.
Typically, but not all the time, it will be called the first time the page is loaded. I figured there was a caching issue, but cache:false was already set. I tried adding a DateTime to the url, but I kept getting errors on that (I honestly don't think I formed it properly, suggestions?). I tried different datatype strings, and of course JSON.stringify() works, but like I said, it will only work once.
I noticed while I had a break in the jQuery function that if I waited a second or two, IE would actually make a call to the web service and execute successfully. It would do that every time. I figured the modal window was closing faster than the server could process the request and not make the web service call. I added the $.delay(1000) in the jQuery code hoping it would work, but unfortunately it didn't.
Now I am at my wits end and have absolutely no idea how to proceed. Everything seems to make logical sense, but obviously something is amiss.
I would be greatly appreciative of help anyone can provide.
