Cross domain form submit does not work on Chrome and IE
- by Debiprasad
I am having an unexpected issue while submitting a from. The action of the form is a different domain. And the method is get. Here to the code of the from:
<div style="width: 100%; background-color: #09334D; margin: 0 0 15px 0; padding: 10px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;"
<form action="http://www.flipkart.com/search-book" method="get">
<a href="http://www.flipkart.com/?affid=debiprasad">
<img alt="Flipkart.com" style="vertical-align:middle" src="http://static.fkcdn.com/www/270/images/flipkart_india.png" />
</a>
<input type="hidden" name="affid" value="debiprasad">
<input type="text" name="query" style="height:25px; width: 400px; font-size: 16px;">
<select onchange="$(this).closest('form').attr('action', 'http://www.flipkart.com/search-' + $(this).val());" style="height:25px; width: 150px; font-size: 16px;">
<option value='book' selected>Books</option>
<option value='music'>Music</option>
<option value='movie'>Movies & TV</option>
<option value='game'>Games</option>
<option value='mobile'>Mobiles</option>
</select>
<input type="submit" value="Search" style="height:25px; width: 100px; font-size: 16px; background: url('http://static.fkcdn.com/www/270/images/fkart/search_button_bg.png') repeat-x scroll 0 0 transparent; border: 1px solid #915A13; color: #3C2911; cursor: pointer; font-family: 'lucida grande',tahoma,verdana,arial,sans-serif; font-weight: bold; padding: 0 17px 0 15px; margin: 0; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;">
</form>
The form is located at: http://wheretobuyonline.in/
When I click on the "Search" (submit) button, it does not submit. This problem happens in Chrome and IE (8). But works without any problem on Firefox.
