jQuery.ajax() issue with chrome and IE 8

[Gaurav Chander]

Hello All,

I am working on an application in which I need to populate dropdowns on the basis on previous selection from drop down. code is working fine in mozilla but it fails in Internet explorer and chrome

here is the explained scenario

function populateAdvertiser(){
		
		var value = $("#accType").val();
		
		var url = '${pageContext.request.contextPath}/Graph/getAdvertiser.xads?acc_type='+value;
		jQuery.ajax({
			type : "GET",
			url : url,
			dataType : "json",
			cache:false,
			success : function(data) {
				for ( var i = 0; i < data.length; i++) {
					a = data[i].value;
					b = data[i].name;
					jQuery("#advertiser").append(jQuery('<option></option>').val(b).html(a));
				}
 				
			},
			error : function(XMLHttpRequest, textStatus, errorThrown) {
				alert('Unexpected server error');
			}
		});
	}

above javascript function calls a java method and in return receives a json of format name:value

i have checked the json on multiple websites and they say it is correct but i'm not able to populate the select list in IE8, it goes to error and give the alert Unexpected server error.

i have tried setting cache: false, async:false

contentType in java is set to application/json.

don't know where I'm going wrong.

also in chrome above function works fine but there is a similar function for another dropdown which fails.
in case of chrome request does not even goes to the servlet.

both function are working fine in mozilla

any help would be appreciated.

PS: IE version is 8 and chrome version is 17.0.963.56

thanks.

[Gaurav Chander]

on checking the data in firebug i found a special character 'é' was there which was casing parsing issues in IE. so it is resolved..

[Gaurav Chander]

so now i'm only stuck with chrome issue.. chrome is not sending request to controller..


please suggest for that..

[Bear Bibeault]

Please post an SSCCE.

[Gaurav Chander]

well issue is resolved as i was passing a parameter in url with name 'advertiser' and had a select tag on the same page with name 'advertiser' so got issues in chrome.

but it would be nice if you could explain me why it worked in mozilla and not chrome.

below is the code

		function populateCampaign() {
			var value = $("#advertiser").val();
			var accType = $("#accType").val();
		    
		    jQuery('.ui-dialog-titlebar').css('display', 'none');
		 	jQuery('#loading').dialog({
				height : 80,
				width : 130,
				modal : true,
				resizable : false,
				closeOnEscape : false
			});   
		 	jQuery('.ui-dialog-titlebar').css('display', 'none'); 
			
		 	var url = '${pageContext.request.contextPath}/Graph/getCampaign.xads?advertiser='+ value + '&acc_type=' + accType;
		 	jQuery.ajax({
				type : "GET",
				url : url,
				dataType : "json",
				success : function(data) { 
					jQuery("#campaign").html('');
				 	jQuery("#campaign").append(jQuery('<option></option>').val('').html('Select an Option'));
					jQuery("#campaign").append(jQuery('<option></option>').val('0').html('ALL'));
					
					for ( var i = 0; i < data.length; i++) {
						a = data[i].value;
						b = data[i].name;
						jQuery("#campaign").append(jQuery('<option></option>').val(b).html(a));
					} 
    			    $("#campaign").multiselect("enable");
					$("#campaign").multiselect("refresh");
					jQuery('#loading').dialog("close");
					jQuery('#loading').dialog("destroy");
				} ,
				error : function(XMLHttpRequest, textStatus, errorThrown) {
					alert('Unexpected server error '+XMLHttpRequest.status);
				} 
			}); 
	}
</script>
<form method="get" id="graphForm" action="${pageContext.request.contextPath}/Graph/viewGraph.xads" target="iframe" onsubmit="return verify()">
<p  class="td">Select Graph Parameters</p>
	<table>
 		<tr>
 			<td class="td" >Advertiser</td>
 			<td><select id="advertiser" name="advertiser" onchange="populateCampaign()" style="width:10%">
 				</select></td>
 			</td>
 		</tr>
 		<tr>
 			<td><input type="submit" value="Generate" ></td>
 		</tr>
 	</table>
</form>

because of the same name chrome was not sending request to controller
but the URL was called in ajax only and select tag was passed on submit

so why it didn't worked?

i know i should not have same names but it would be better if i know the reason for the failure.

thank you for your time.