12 Replies - 2190 Views - Last Post: 03 May 2013 - 11:56 AM

#1 MannyG  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 26
  • Joined: 15-April 13

Jquery's ajax function not being called

Posted 02 May 2013 - 02:34 PM

I have a web page which fill's form data based on some json data sent from a web service. Once the form is ready to be submitted a function is called which takes all the form data turns it into a xml-formatted string then parses the xml so it becomes a valid xml object. This is where the problem happens, once this data is turned into an xml I would like to post this data back to the web service so the database can be updated. However using the $.ajax() function to post this data, neither the success nor error function within are ever called. This lead's me to believe the ajax function is never being called or run. Below are the code snippets:

submit button for form:

    <input type="submit" name="submitbutton" id="submitbutton" value="Submit" onclick="postData()"/>



postData function:

    function postData()
    		{
                //gathering all inputs
    			var cb = document.getElementById('paymentList');
    			var selected_cb = cb.options[cb.selectedIndex].text;
    			var pguid = getParameterByName('guid');
    			var xmlString = '<string>' +
    			addField('approver', $('#approver').val()) +
    			addField('companyName', $('#companyName').val()) +
    			addField('emailAddress', $('#emailaddress').val()) +
    			addField('address1', $('#address1').val()) +
    			addField('address2', $('#address2').val()) +
    			addField('city', $('#city').val()) +
    			addField('province', $('#province').val()) +
    			addField('country', $('#country').val()) +
    			addField('postalCode', $('#postalcode').val()) +
    			addField('phoneNumber', $('#phone').val()) +
    			addField('paymentMethod', selected_cb);
    			
                //gathering all table data now
    			xmlString+='<contractData>';
    			$('#table tbody tr:has(img[src="images/checkmark.png"])').each(function() {
    			  xmlString += '<contract>' + addField('vendorPart', $('td:eq(1)', this).text()) +
    					addField('description', $('td:eq(2)', this).text()) +
    					addField('price', $('td:eq(3)', this).text()) +
    					addField('quantity', $('td:eq(4) input', this).val()) + '</contract>';
    			});
    		
    	
    			xmlString += '</contractData></string>';
    			 
    		//hard coded var for purpose of this example, as web service name will be 
    			var properid = 'somedata';
    			
    			xmlDoc = $.parseXML( xmlString );
    			$xml = $( xmlDoc );

                //this function I believe is never run as neither alerts below are posted
    			$.ajax({
                     type: "POST",
                     url: "http://www.webservice.com/service.asmx/sendMeMyData",
                     data: {properdata:properid, xml: $xml},
                     dataType: "text",
                     success: function() {
    					
    					alert("posted");
    				 },
    				 error: function ()
    				 {
    					alert("error");
    				 }
    			});
    			
    		}



addField function (just so you know what it does when it's called in postData()):

    function addField(name, value) { // Add a single element and value
    		  value = value.replace(/&/g, '&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;');
    		  return '<' + name + '>' + value + '</' + name + '>';
    	}


Is This A Good Question/Topic? 0
  • +

Replies To: Jquery's ajax function not being called

#2 andrewsw  Icon User is online

  • Fire giant boob nipple gun!
  • member icon

Reputation: 3460
  • View blog
  • Posts: 11,727
  • Joined: 12-December 12

Re: Jquery's ajax function not being called

Posted 02 May 2013 - 02:46 PM

What does your console say? If you don't know what this is there are links in my signature.

In Google Chrome, for example, there is a Network tab that will show information about network activity, as well as the Console itself which will display error messages.

I haven't investigated the following, so I'm just speculating:

Is $xml = $( xmlDoc ); necessary? Shouldn't you just be passing the xml, rather then a jQuery object? In which case, shouldn't the dataType be "xml"?

..and print out xmlString to check that it is correctly formed. console.log(xmlString); will print it to the console window.
Was This Post Helpful? 0
  • +
  • -

#3 MannyG  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 26
  • Joined: 15-April 13

Re: Jquery's ajax function not being called

Posted 02 May 2013 - 03:13 PM

Printing the xml into the console, show's that it appears perfectly fine. I tested this before also via an alert and the xml format look's fine. If I use jquery to search for data within the xmlstring after it's been parsed as an XML it retrieves the data which lead's me to believe that the xml is formatted correctly.

When looking at the network tab in IE, the browser becomes unresponsive. I can currently only test this on IE as chrome and firefox only work when I host the code on production which I can't do at the moment. In an hour or so I can.

Perplexing...
Was This Post Helpful? 0
  • +
  • -

#4 andrewsw  Icon User is online

  • Fire giant boob nipple gun!
  • member icon

Reputation: 3460
  • View blog
  • Posts: 11,727
  • Joined: 12-December 12

Re: Jquery's ajax function not being called

Posted 02 May 2013 - 03:35 PM

Personally, I would first get it working with a much simpler, static, xml string.
Was This Post Helpful? 0
  • +
  • -

#5 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 3541
  • View blog
  • Posts: 10,226
  • Joined: 08-June 10

Re: Jquery's ajax function not being called

Posted 02 May 2013 - 03:38 PM

Quote

This lead's me to believe the ajax function is never being called or run.

well, you do an AJAX request on a submit button, i.e. as soon as you start the AJAX, you load a new page unloading all code concerned with the previously started AJAX.
Was This Post Helpful? 1
  • +
  • -

#6 andrewsw  Icon User is online

  • Fire giant boob nipple gun!
  • member icon

Reputation: 3460
  • View blog
  • Posts: 11,727
  • Joined: 12-December 12

Re: Jquery's ajax function not being called

Posted 02 May 2013 - 03:41 PM

View PostDormilich, on 02 May 2013 - 10:38 PM, said:

Quote

This lead's me to believe the ajax function is never being called or run.

well, you do an AJAX request on a submit button, i.e. as soon as you start the AJAX, you load a new page unloading all code concerned with the previously started AJAX.

Doh! I missed that :whistling:
Was This Post Helpful? 0
  • +
  • -

#7 MannyG  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 26
  • Joined: 15-April 13

Re: Jquery's ajax function not being called

Posted 02 May 2013 - 09:44 PM

I want this code to execute when the submit button is pressed though, this ensures that the user has confirmed they would like to submit these changes so it may be updated in the database.
Was This Post Helpful? 0
  • +
  • -

#8 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 3541
  • View blog
  • Posts: 10,226
  • Joined: 08-June 10

Re: Jquery's ajax function not being called

Posted 02 May 2013 - 10:15 PM

you can run an AJAX request on a submit button, but you will never be able to see the returning response.
Was This Post Helpful? 0
  • +
  • -

#9 MannyG  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 26
  • Joined: 15-April 13

Re: Jquery's ajax function not being called

Posted 03 May 2013 - 06:50 AM

I don't want to see any returning response just want to post the data, i do however upon the success of thios post want to redirect the page to another simple html page. But it will nevber hit the success or error function...
Was This Post Helpful? 0
  • +
  • -

#10 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 3541
  • View blog
  • Posts: 10,226
  • Joined: 08-June 10

Re: Jquery's ajax function not being called

Posted 03 May 2013 - 08:24 AM

View PostMannyG, on 03 May 2013 - 03:50 PM, said:

I don't want to see any returning response just want to post the data, [Ö] But it will nevber hit the success or error function...

if youíre not interested in the response, why are you interested in the success or error function (which are based on the response)? that statement doesnít make sense.
Was This Post Helpful? 0
  • +
  • -

#11 MannyG  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 26
  • Joined: 15-April 13

Re: Jquery's ajax function not being called

Posted 03 May 2013 - 08:59 AM

Well, I wanted to use the success function to be used as a sort of "this post succeeded, now do this -> re-direct page" instead of dealing with any data. That was my primary use of the success function in this case.
Was This Post Helpful? 0
  • +
  • -

#12 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 3541
  • View blog
  • Posts: 10,226
  • Joined: 08-June 10

Re: Jquery's ajax function not being called

Posted 03 May 2013 - 09:01 AM

then you have to omit the submit type button. itís not that you canít do a redirect from within JS Ö
Was This Post Helpful? 0
  • +
  • -

#13 MannyG  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 26
  • Joined: 15-April 13

Re: Jquery's ajax function not being called

Posted 03 May 2013 - 11:56 AM

View PostDormilich, on 03 May 2013 - 09:01 AM, said:

then you have to omit the submit type button. it’s not that you can’t do a redirect from within JS …


Changing the input type from type='submit' to type='button' allowed this to work without refreshing and undoing all of these changes. Seem's this thread can indeed be closed :)

Thank you for your help!

This post has been edited by MannyG: 03 May 2013 - 11:57 AM

Was This Post Helpful? 0
  • +
  • -

Page 1 of 1