Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>DMoses solution greatly inspired my solution but it there is a significant difference so I thought it would be a good idea to make my own solution, the bounty goes to DMoses though :P</p> <p>DMoses solution moves (or copies) the form to the iframe and then submits it. The reason you want to do this is so your 'parent' from doesn't reload. There is a simpler solution: <strong>have the form submit to the iframe</strong>. This works just the same and you don't have to copy any nodes.</p> <p>This step is entirely repeatable as well. The only downside is that you don't control when exactly an autocomplete entry is added. You might want to add only <em>valid</em> entries but at least this case mimics perfectly the way a normal form would behave if no ajax were involved. If you want to control what gets added to the autocomplete, use DMoses' solution, copy the form and submit it in the iframe.</p> <p>For me, this is enough:</p> <pre><code>&lt;form onsubmit="return ajaxit();" autocomplete="on" target="the_iframe"&gt; &lt;input id="foo" name="foo"/&gt; &lt;input type="submit" /&gt; &lt;/form&gt; &lt;iframe id="the_iframe" name="the_iframe" src="javascript:false"&gt;&lt;/iframe&gt; &lt;!-- you'll want this hidden --&gt; </code></pre> <p>The best part: <strong>no extra JavaScript is required to make this work!</strong> (other than generating a unique id/name for the form, but that's super trivial).</p> <p>jsFiddle: <a href="http://jsfiddle.net/KzF6s/13/" rel="nofollow">http://jsfiddle.net/KzF6s/13/</a></p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload