position:fixed; after serialize()?

Question

JavaScript

There was a small problem. There is a page where the form is submitted with the following code:

$(function(){<br/>
 $('.add-form &gt; form').submit(function(){<br/>
 var thisForm = $(this);<br/>
 var url = thisForm.attr('action');<br/>
 var url = url.substr(0,url.indexOf('#'));<br/>
 var data = thisForm.serialize()+'&add=1';<br/>
 $.post(url, data, function(content){<br/>
 $('body').html(content);<br/>
});<br/>
 return false;<br/>
 });<br/>
<br/>
});

there is an element on the page that gets position:fixed when scrolling; with the help

$(function() {<br/>
 var div = $('#fixed-top');<br/>
 var start = $(div).offset().top;<br/>
 $.event.add(window, &quot;scroll&quot;, function() {<br/>
 var p = $(window).scrollTop();<br/>
 $(div).css('position',((p)&gt;start) ? 'fixed' : 'static');<br/>
 $(div).css('top',((p)&gt;start) ? '0px' : '');<br/>
 });<br/>
 <br/>
});

Resp. when the form is submitted, the fixed element is hidden. Please tell me how this can be avoided? Thank you!

Answer 1

I could be wrong, but this line seems to be the problem:
$('body').html(content);
Try fixing it to
$('body').append(content);

Answer 2

Updating multiple blocks via Ajax can be implemented in the following way:

$.post(url, data, function(content)
{
  // данные от сервера должны приходить в формате JSON (т.е. {"header":"код внутри блока header", "section":"код внутри блока section"})
  $('header').html(content.header);
  $('section').html(content.section);
  
  // если переписать код на сервере не представляется возможным, то придется вытаскивать нужные данные из content с помощью регулярок
  // var header = /<header>(.+)<\/header>/gi.exec(content);
  // var section = /<section>(.+)<\/section>/gi.exec(content);
  // $('header').html(header[1]);
  // $('section').html(section[1]);
}, 'json');