jquery - submit form and then show results in an existing div -
this don't work me. results show in action form page.
jquery:
<script type="text/javascript"> $(document).ready(function() { $("#em2").submit(function() { $.ajax({ data: $(this).serialize(), type: $(this).attr('method'), url: $(this).attr('action'), success: function(response) { $('#resultados').html(response); } }); $('html, body').animate({ scrolltop: $('#resultados').offset().top -292 }, 'slow'); return false; }); }); </script>
html:
<form id="em2" name="em2" action="resultados.php" method="post"> <input type="hidden" name="e" value="no" /> <input type="hidden" name="b" value="empleo" /> <input type="hidden" name="q" value="02" /> </form> <a href="javascript:void(0)" onclick="javascript:document.forms['em2'].submit();return false;">ver</a> . . . <div id="resultados"> </div>
by submitting form results show in new window (resultados.php).
i don't understand why.
your trigger problem; rather triggering submit
event, following line submitting form default action. trigger submit
event need submit
button or use jquery trigger event using of these forms: $('#em2').submit(), $('#em2').trigger('submit')
:
<a href="javascript:void(0)" onclick="javascript:document.forms['em2'].submit();return false;">ver</a>
either change following in this working example:
<a href="javascript:void(0)" onclick="javascript:$('#em2').submit();return false;">ver</a>
or try avoid inline js , following (recommended):
<a id='thetrigger' href='#'>ver</a> $(function() { $('#thetrigger').on( 'click', function() { $('#em2').submit(); }); });
which changes code to:
$(document).ready(function() { $('#thetrigger').on( 'click', function() { $('#em2').submit(); }); $("#em2").submit(function() { $.ajax({ data: $(this).serialize(), type: $(this).attr('method'), url: $(this).attr('action'), success: function(response) { $('#resultados').html(response); } }); $('html, body').animate({ scrolltop: $('#resultados').offset().top -292 }, 'slow'); return false; }); });
Comments
Post a Comment