简体   繁体   中英

Javascript html grab from external iframe + calling a controller action with data

Preface: I consider myself "slightly effective" in ruby on rails, and a complete novice in javascript. Also, yes, I have installed jQuery and associated plugins instead of the default Prototype library.
I am in a situation where I am pulling in a table from off-site in an iframe (which is taking care of all internal JS for me) such that when a part of the table is clicked, a td will gain the class "active." What I would like to do is take this info (I'm assuming I can get it in a string format), and pass it to a method (in my controller, I'm assuming) which will parse the html, pull out the pertinent info, and then call a creation method in the same controller with the parsed info, the end result being a new item in that table.

What I have so far is javascript which I believe is correct:

<script type="text/javascript">
  var ImportInfo = function() {
  var info = $('td.active').html();
  // call controller action which parses the given string,
  //checks for existence in database, and adds new row if needed
}

$("#Import").click(ImportInfo);
</script>

and, of course, a button with id="Import."

I have looked at this question: Using jQuery To Call A Controller Action but am somewhat unsure as to how to call a controller action to pass the contents of the td as a string. Is this doable with the jQuery post method?

ADDED INFO: my iframe:

<iframe id='locator' src="http://hosted.where2getit.com/wafflehouse/indexnew.html" width="740" height="700" marginheight="0" marginwidth="0" scrolling="no" frameborder="0" align="bottom" name="plg_iframe">No Frames</iframe>

Too bad you dropped Prototype -- I could have helped you better ;-)

jQuery experts feel free to correct me but I believe you want something like:

<script type="text/javascript">
  var ImportInfo = function() {
  var info = $('td.active').html();
  // call controller action which parses the given string,
  //checks for existence in database, and adds new row if needed
  $.ajax({
    url: '/controller/action',
    data: { paramName: info }
  })
}

$("#Import").click(ImportInfo);
</script>

If you wanted to do it with Prototype, you would use:

<script type="text/javascript">
  var ImportInfo = function() {
  var info = $$('td.active')[0].innerHTML;
  // call controller action which parses the given string:
  new Ajax.Request('/controller/action',{
    method: 'post'
    parameters: { paramName: info }
  })
}

$("#Import").click(ImportInfo);
</script>

Now, ater re-reading your question, I see that the <td> you want to get data from is in an iFrame from a different site , is this correct? If so, JavaScript will have no access to that iFrame because of security restrictions. See this MSDN article or google for "Cross-domain iframe security". If this is your issue, please provide a lot more detail about the two domains in question... you may or may not be out of luck.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM