Help! Can someone take a look at my HTML code with a simple search by terms function?


#1

I am new to Twitter API and not an expert for webprogramming. Actually, I am trying to get the geocoordinates from tweets searched by some term like “earthquake”. So, here is HTML code. It always returns with an error of “bad request”. Could someone give me some advice? Thank you so much. Twitter API really freaks me out, why is there no any sample code about it online?

<!DOCTYPE html>
<html>
  <head>
    <title>Test page</title>
    <!-- jquery external include -->
    <script src="http://code.jquery.com/jquery-1.9.0.min.js"></script>

    <script type="text/javascript">
      /* document ready loop:
        - triggers anything inside once the HTML document
          is done loading
      */
      $(document).ready(function() {
        // console.log is used to send text data to the console
        console.log('doc ready!');
        

        // a function called when a click event is registered on 
        // an element with the id of 'submit'
        $('#submit').click(function(){
          // create a simple array with one member key 
          // this is the twitter search term, feel free to modify this
          var search_term = {
            q: 'bowery'
          };
          // pass the search term to the search function defined below
		  console.dir(search_term);
          search(search_term);
        });
      });

      /*
        the main search function

        this takes a search term defined by 'search_term' and then uses the 
        jquery ajax function to connect to the twitter search api as outlined here:
        - https://dev.twitter.com/docs/api/1/get/search 
        
        for more info on what you can do with the jquery ajax function see:
        - http://api.jquery.com/jQuery.ajax/
      */
      function search(search_term) {
        $.ajax({
          /* the 'param' function ensures that our search terms are properly encoded
             see: http://api.jquery.com/jQuery.param/ */
          //url: 'http://search.twitter.com/search.json?' + $.param(search_term),
		  url: 'https://api.twitter.com/1.1/search/tweets.json?' + $.param(search_term),
          

          /* the data type should be set to jsonp. for more info on that see:
             http://en.wikipedia.org/wiki/JSONP */
          dataType: 'jsonp',

          /* since the function runs asynchronously, we need to define what should happen
             when the twitter API sends back a successful response (i.e. HTTP code 200)
          */

          success: function(data) {
            // uncomment the below to see the data in the console
            //console.dir(data);

            /* loop through each item inside of data['results'] and
               extract the 'text' property.
               we then use that to create a list item tag (<li>) and append
               that to the HTML element with id 'tweets'
            */
            for (item in data['results']) {
              $('#tweets').append(
                '<li>' + data['results'][item]['text'] + '</li>');
            }
          }
        });
      }
  </script>
  </head>
  <body>
      <h1>NEW TWEETS</h1>
        <ol id="tweets"></ol>
        <a href="#" id="submit">get tweets</a>
  </body>
</html>