Question

i have a simple show/hide div and a form on the div, but when i submit the form the div hide again on the reload, how i stop this behavior?

Script:

$(function() {
  $('.Mbox').hide().click(function(e) {
    e.stopPropagation();
  });      
  $("#Mbutton").click(function(e) {
    $('.Mbox').animate({ opacity: "toggle" });
    e.preventDefault();
  });

});

Div:

<li><div class="Mbox"><input type="text" id="conversation_username" class="span5"  name="conversation_participant[nome]" placeholder="Para: Nome"/>
 <%= text_area :message, :body, :class => "span5", :rows => 5, :placeholder => "Mensagem" %>
 <%= f.button "Send", :class => "botao" %></div></li>

Answer 1

Sounds like when the page is initially loaded, the div is hidden, then you click to show the div and fill out the form. On form submission, the page reloads, and the div reloads as hidden, when you want it to still be shown.

(Assuming that the div initially being hidden is controlled in CSS as I do not see it elsewhere in the code provided)

If this is the case, I think you have two options..

1. Handle it on the server side, when building the response to the form submit, insure you are changing the div to be shown in the returned response

2. Handle it on the client side if possible, if, say, the form shows the filled in values after the reload, but never has values when the page is initially loaded, you could write some JS to show the div if there are values in the form.

I would also look at having the page not do a full reload on form submit if your coming back to the same page with the same data and want it to look just the same. Perhaps you should be submitting via AJAX and not reloading the page at all?