Fields Missing from jQuery Post – Serialize Data

Hey everyone,

I was using jquery’s serialize method to post completed form data only to find that a number of my fields were missing.

  1.  
  2.                 //Display loader and disable forms
  3. 		disable_form_fields(true);
  4.  
  5.                 //Post via ajax
  6. 		$.ajax({
  7. 			type: 'POST',
  8. 			url: 'uploads/add',
  9. 			data: $(form).serialize(),
  10. 			success: function(data, text_status, oHTTP){
  11. 				handle_form_response(data, text_status, oHTTP, $(form).data('file_id'))
  12. 			},
  13. 			error: function(){
  14.  
  15. 				//Hide loader etc
  16. 				set_form_loading(false);
  17.  
  18. 				//Unspecified error
  19. 				alert('An error has occurred.');
  20. 			},
  21. 			dataType: 'json'			
  22. 		});

Thanks to this stackoverflow post I realised that the data wasn’t being serialised because I’d disabled most of the fields beforehand. This was done in order to prevent the user from changing the values. To get around this I simply had to serialise the data BEFORE disabling anything.

  1.  
  2.                 //Post via ajax
  3. 		$.ajax({
  4. 			type: 'POST',
  5. 			url: 'uploads/add',
  6. 			data: $(form).serialize(),
  7. 			success: function(data, text_status, oHTTP){
  8. 				handle_form_response(data, text_status, oHTTP, $(form).data('file_id'))
  9. 			},
  10. 			error: function(){
  11.  
  12. 				//Hide loader etc
  13. 				set_form_loading(false);
  14.  
  15. 				//Unspecified error
  16. 				alert('An error has occurred.');
  17. 			},
  18. 			dataType: 'json'			
  19. 		});
  20.  
  21.                //Display loader and disable forms - DO THIS AFTER SERIALISING
  22. 		disable_form_fields(true);

Let me know if you have any issues.

2 thoughts on “Fields Missing from jQuery Post – Serialize Data

  1. Michael

    Hey! This post helped me with a problem that was introduced presumably by a jQuery update. My serialize() call was no longer picking up disabled options. Enabling them before sending the data solved my issue – thanks for posting!! :)

    Reply

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.