Question

<div class="well original3">
 <%= form_tag( { :controller => 'businesses', :action => 'create' }, { :id =>        'myform',:class  => 'form-inline offset3', :method => 'post'}) do %>
<%= text_field_tag('mnum' ,nil, :class => "input-xlarge", :style => "text-    align:center;height:28px;",:placeholder => "Enter Mobile Number") %> 
 <%= submit_tag "Get", :id => "da",:class =>     "btn btn-large btn-primary" %>
 <%end%>
</div>

JQUERY

$(document).ready(function () {
$("#da").click(function() {
  //$(".original3").fadeOut(300, function() {
        //$(".original3").css("display", "block");
        $(".checked3").css("display", "block");
        $(".checked3").show();
        //});
});

});

Basically another Div will be hide via css. when click this Get button that div should show, But here is the problem when i click the GET button the the other div will show and fadeout soon. But when i change the GET button type submit to button that will work properly..?
How to avoid this problem…?

Thank you

Answer 1

Use

<%= submit_tag "Get", :id => "da",:onclick => show_checked3();,:class =>"btn btn-large btn-primary" %>

function show_checked3(){
  $(".checked3").css("display", "block");
  $(".checked3").show();
}

Or Try with

$(document).ready(function () {
 $("#da").live('click',function() {
    $(".checked3").css("display", "block");
    $(".checked3").show();
    //});
});

Update

You can try with

$("#myform").submit(function(){
  $(".checked3").css("display", "block");
  $(".checked3").show();
  return true;
});