Search code examples
javascripthtmlformsiframe

Set input text inside iframe and submit

I'm trying to glue together two web services by passing a value from one to the other, unfortunately there's no API or clear way of hacking up the search query so I need to set the value of a input inside an iframe.

Here's the markup for the horrible iframe.

<form id="searchForm" method="post" action="/search/initialSearch">         
  <fieldset class="searchFields">
    <input type="text" name="searchTerm" value=""/>
    <input type="submit" value="Find stops"/>
  </fieldset>
</form>

I need to set the searchTerm text and then submit the form.

Note: This is going over mobile, so I would prefer a really lightweight solution

Solution

  • Isn't it as simple as:

    myframe.document.getElementById("searchForm").searchTerm.value = 'hello';
myframe.document.getElementById("searchForm").submit();

    Make sure your script runs AFTER the iframe is loaded. Your iframe tag has an onload event that you can use to determine when the page within the frame is loaded.

    <iframe src="formPage.html" onload="loaded()" name="myframe" />