Working Through My First AJAX Call - Stuck As To Why My Results Aren't Displaying At All

Test it here - http://paulmatheson.net/webdev/wiki/wikipedia-viewer.html Basically, you enter a term and the results are supposed to display below. I had it working for a second bu

Solution 1:

It is because your button is form element & its type is submit. So basically what's wrong is the form is submitted via form. Your ajax call is being cancelled due to this & page is reloading. You can do two things

1. You need to stop this event by using preventDefault method on button click like this

   $('#submit-search-btn').click(function(e) { e.preventDefault() var searchTerm = $('#search-input').val(); //Further code

2. Change the button attribute to type="button" which will stop it from submitting in the first place