CODEWITHSUNDEEP
javascriptjqueryhtmlasp.net-mvc-4
ssingh
ssingh

Reputation: 334

jQuery not hiding divs (mvc 4)

I have 2 divs:

 <div class="lobsummary">
    <input type="submit" name ="sbmtbtn">
    <input type="submit" name ="sbmtbtn">
 </div>
 <div class="applicationsummary">
 </div>

I want to show applicationsummary when sbmtbtn is submitted so I used the below script:

  $('.lobsummary input:submit').submit(function (event) {
        $('.applicationsummary').show();
        $('.lobsummary').hide();
    });

But its not working.

EDIT: The divs are enclosed in <% Html.BeginForm("Index", "Home"); %> which I am using to pass values to my controller from the view.

Upvotes: 1

Views: 653

Answers (3)

ssingh
ssingh

Reputation: 334

When the form was submitted, it reloaded the whole page and that's why it was not hiding because it was going back to its default view. So I used if statements in my view to hide the forms.

Upvotes: 0

meeming
meeming

Reputation: 88

@Rajaprabhu Aravindasamy is right,use submit() over a form:

$("form").submit( function () {
  return false;
} );

HTML on the client side will be like:

<div class="lobsummary">
    <form action="/"method="post">
        <input type="submit" name ="sbmtbtn">
    </form>
    <form action="/"method="post">
        <input type="submit" name ="sbmtbtn">
    </form>
 </div>
 <div class="applicationsummary">
 </div>

Just use click() to test your jquery selection:

    $('.applicationsummary').hide();
$(".lobsummary form:eq(0)").click(function () {
    alert(1)
        $('.applicationsummary').show();
    });
$(".lobsummary form:eq(1)").click(function () {
    alert(2)
        $('.applicationsummary').hide();
    });

Then replace the click to submit.

Upvotes: 0

Sudharsan S
Sudharsan S

Reputation: 15393

Use event.preventDefault() it stops the default action 

$('.lobsummary input[type=submit]').click(function (event) {
        event.preventDefault();
         alert($(this).index() + 1);
        $('.applicationsummary').show();
        $('.lobsummary').hide();
    });

Upvotes: 2

Related Questions