Update DIV without refreshing the JQUERY page

Asked

Viewed 9,570 times

2

Good afternoon Guys, I have an ajax that sends a post some information, in PHP I saved this information in Ssion, I would like to update the DIV where I have a foreach (PHP) to update so that I am not getting below the ajax. In case I would like to update only the div and nothing else is it just run the foreach again that will get the data from Session that now has one more item so that I am not getting anyone can help?

$(document).ready(function() {
                  $('.incluir_item').submit(function() {
                    var dados = $(this).serialize();
                    $.ajax({
                      type: "POST",
                      url: "calibracao_incluir_itens.php",
                      data: dados,
                      beforeSend: function() {
                        $('#incluir-item').fadeOut('fast').modal('toggle');
                        $('<div class="ajaxModal"><div class="ajaxModal-preload"><p>Incluindo cliente aguarde!</p></div></div>').insertAfter('body');
                        $('.ajaxModal').fadeIn('fast');
                      },
                      success: function(data) {
                        ajaxModal_Close();
                        $('#tabela_calibracaoes').html('#tabela_calibracaoes');

                      }



                    });
                    return false;
                  });
                });

Thanks in advance.

  • oq returns in "Success: Function(date)" ??

  • In case it returns data from my Session items($_SESSION['items']) what should I do with it?

  • Can you explain exactly what’s failing?

3 answers

1

The right one would be to "stop" the event of Ubmit. On the first line, put:

event.preventDefault();

This will not make Submit perform its function, and will continue with the rest of the code.

  • I prefer Try/catch and event.prevent not 100% ... case windows browser, linux and mac are different compatible.

0

I’m sending the example how to use ajax updates without updating the page.

Behold $('div#lista').html(texto); it’s really place (html), and want to insert more text $('div#lista').append(texto); (append)

$(document).ready(function() {
	$('input#refresh').bind('click', function() {
		$.getJSON('http://beta.json-generator.com/api/json/get/4yIDEw8S-', function(json) {
          var texto = JSON.stringify(json);
		  $('div#lista').html(texto);
        });
	});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="lista"></div>
<br><input type="button" id="refresh" value="Refresh">

see you around!

-2

To lock Submit use the return false; at the end of .submit (function (){}).

Browser other questions tagged

You are not signed in. Login or sign up in order to post.