2

I have a simple bookmarking app that I am developing to learn Google App Engine. At this point I copy and paste the url into http://ting-1.appspot.com/submit which has a form that has a url field. Since this is cumbersome I thought of adding a chrome extension. I just changed the hello world example so that now I get the url of the tab with this code (as explained here):

  <script>
    window.addEventListener("load", windowLoaded, false);
    function windowLoaded() {
      chrome.tabs.getSelected(null, function(tab) {
        document.getElementById('currentLink').innerHTML = tab.url;
        tabUrl = tab.url;
      });
    }
document.write(tabUrl)
  </script>

How do I pass tabUrl to http://ting-1.appspot.com/submit?

Thanks!

Update

background.html that I used as adapted from Mohamed Mansour's answer:

<script>
    //React when a browser action's icon is clicked.
    chrome.browserAction.onClicked.addListener(function(tab) {
        //this gets the url and the title
        chrome.tabs.getSelected(null, function(tab) {
            tabUrl = tab.url
            tabTitle = tab.title

        //this posts the data to the bookmarking app 
        var formData = new FormData();
        formData.append("url", tabUrl);
        formData.append("title", tabTitle);
        formData.append("pitch", "this is a note");
        formData.append("user_tag_list", "tag1, tag2");
        var xhr = new XMLHttpRequest();
        xhr.open("POST", "http://ting-1.appspot.com/submithandlertest");
        xhr.send(formData);
        });
    });
</script>

1 Answer 1

4

You use normal XHR (XMLHttpRequest) request. I would place that in your background page. Follow the example here, https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest. I believe you want to submit data as well, so don't forget that. I think you wanted a POST request too. From the example on MDC, you can relate it this way:

var formData = new FormData();
formData.append("username", "Groucho");
formData.append("accountnum", 123456);
var xhr = new XMLHttpRequest();
xhr.open("POST", "http://ting-1.appspot.com/submit");
xhr.send(formData);

Make sure you have the URL in your manifest for getting permissions to do that request.

"permissions": [
  "tabs",
  " http://ting-1.appspot.com/submit"
],
1
  • @ Mohamed Mansour: Thanks for your answer. This worked perfectly. Additional thanks for the link to the XMLHttpRequest tutorial. Now I want to add a callback function to indicate that the submit was successful. I am reading the Asynchronous request section developer.mozilla.org/En/XMLHttpRequest/… but if you have any practical advice about how to add a callback function in my situation, that would be helpful too, or I will post another question later if necessary. I updated the question with the code that I used. Thanks again.
    – Zeynel
    Oct 10, 2011 at 17:37

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.