4

I need a user to navigate to a certain page that has a certain div full of useful text. Then click my bookmarklet and send the text in that div back to my server, which is different from the current domain. I have successfully inserted jQuery on the bookmarklet click and selected the text. Now I need to figure out a way to send that text cross domain to my server. I tried JSONP with jQuery and my text is too long for the url. My second idea was to open up a new window and load a page from my domain, and then somehow insert the selected text into the new window, after which the user could click submit and POST that data to my server. This didn't work for javascript cross-site reasons. Anyone have any experience with this or ideas for doing this? Thanks.

agoessling
  • 69
  • 2
  • 8

3 Answers3

5

Generate a form (with DOM) and POST the data (you might want to target an iframe, but it will be fire and forget).

Quentin
  • 914,110
  • 126
  • 1,211
  • 1,335
  • Could you go into a bit more detail how you would be able to POST from a domain other than the server's? – agoessling Feb 03 '10 at 21:30
  • There are no restrictions on where a form can post to. Only on where you can read data from using JS. Just use the submit method of the form element. – Quentin Feb 03 '10 at 21:39
  • I am running into a problem where I try to set the value of an text input to a very long string. This makes the server return a 403 Forbidden error. If I shorten the string It works as expected. Is there anyway to send long text strings? – agoessling Feb 04 '10 at 03:28
  • Fix your server so it accepts very long strings in the POST data. – Quentin Feb 04 '10 at 07:17
  • Is it possible to prevent the page redirect to the php file that is processing the POST? and in that case, can you still get a response back from the server? How does one target an iframe? – agoessling Feb 04 '10 at 21:36
  • Yes - by targeting an iframe. No, you can only fire and forget. With the target attribute. – Quentin Feb 04 '10 at 23:10
  • @agoessling - so you need to not only send the data to the server, but you also want to get some kind of response back? – Aerik Mar 16 '12 at 20:02
4

Here is an example to post text to a remote server. And you can print javascript in the remote server if you want to change the page you have the Iframe on to say something like success. Or a popup saying it finished. On the remote server you can print this to make a popup: 

<script> parent.document.getElementById('postmessage').style.display='block'; parent.alert('Successfully posted');</script>

On the webpage you want to send information from make a form and Iframe like this.

<span id="postmessage" style="display:none">Success Message</span>
<form action="http://www.remoteserver.com/upload_test.php" method="post" target="post_to_iframe">
  <input type="hidden" value="the text to send to remote server" />
  <input type="submit" value="Submit" />
</form>

<!-- When you submit the form it will submit to this iFrame without refreshing the page and it will make the popup and display the message. -->
<iframe name="post_to_iframe" style="width: 600px; height: 500px;"></iframe>
PHPGuru
  • 398
  • 3
  • 9
3

Use javascript to create an iframe. Then add a form to the iframe and submit it. Once the form has been submitted, the onload callback will fire.

var i=document.createElement('iframe');
i.setAttribute('name', 'frame-id');
i.setAttribute('id', 'frame-id');
i.setAttribute('allowtransparency', 'true');
i.setAttribute('style', 'border: 0; width: 1px; height: 1px; position: absolute; left: 0; top: 0;');
i.setAttribute('onload', 'iframeFormSubmitted();');

document.body.appendChild(i);

var html = '<html><body>' +
'<form action="/post_url" method="post" id="iframe-form" accept-charset="utf-8">' +
'<input type="hidden" name="id" value="' + your_text + '"/>' +
'</form>' +
'<scr'+"ipt>var e=encodeURIComponent,w=window,d=document,f=d.getElementById('f');" +
"d.getElementById('iframe-form').submit();" +
'</scr'+"ipt></body></html>";

window.frames['frame-id'].document.write(html);
stevendaniels
  • 2,992
  • 1
  • 27
  • 31
  • fyi: the onload fires, but, even if the form targets the iframe, it is not possible to read the loaded response. Cross domain issues. (I just spent some time with that...) – user984003 Jul 17 '13 at 05:55