CODEWITHSUNDEEP
jqueryasp.net-mvc-4
Phill Greggan
Phill Greggan

Reputation: 2394

why the hidden form not shown?

i have the following code that has button and click on it should display the hidden form. but it does not, why?

@model EmployeesTest.Models.EmployeeVM

@{
    ViewBag.Title = "Create";
}

<h2>Create</h2>

<input type="submit" name="name" value="New Entry" id="new"/>

@using (Html.BeginForm()) {
    <div id="frm" style="visibility:hidden">
    <table>
    <thead>
        <tr>
            <td></td>
            <td></td>
            <td></td>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>@Html.LabelFor(x=>x.emp.FirstName)</td>
            <td>@Html.TextBoxFor(x=>x.emp.FirstName)</td>
            <td>@Html.ValidationMessageFor(x => x.emp.FirstName)</td>
        </tr>
         <tr>
            <td>@Html.LabelFor(x=>x.emp.LastName)</td>
            <td>@Html.TextBoxFor(x=>x.emp.LastName)</td>
            <td>@Html.ValidationMessageFor(x => x.emp.LastName)</td>
        </tr>
         <tr>
            <td></td>
            <td></td>
            <td><input type="submit" value="Save"/></td>
        </tr>
    </tbody>
</table>
        </div>
}

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")

    <script>
        $(document).ready(function () {

            $('#new').click(function () {
                (this).preventDefault();

                $('#frm').css('visibility', 'visible');

            });
        });
    </script>
}

Upvotes: 0

Views: 42

Answers (2)

Jobelle
Jobelle

Reputation: 2834

 $(document).ready(function () {
    $('#new').click(function (e) {
        e.preventDefault();
        $('#frm').css('visibility', '');
    });
});

Upvotes: 1

Guruprasad J Rao
Guruprasad J Rao

Reputation: 29683

Remove (this).preventDefault and pass event as argument and prevent it as below:

$(document).ready(function () {
    $('#new').click(function (event) {
          event.preventDefault();
          $('#frm').css('visibility', 'visible');
    });
});

Since the type of button is just button there is no need to prevent its default action.

Upvotes: 1

Related Questions