Question

When my form is submitted, I want to, for example, get data from the server with $.getJson.

I wrote this:

$(function () {
    $('#websiteForm').submit(function (event) {
        $.getJSON('Home/checker', function (data) {
            alert(data);
        });
    });
})

My form:

<form action="" method="post" id="websiteForm">
    <input type="text" name="txtWebsite" id="txtWebsite" />
    <input type="submit" name="submit" />
</form>

But when I click to submit the form, nothing shows up. I tested my $.getJSON function on page load, and it works well, so I don’t know why this function is not working.

Answer 1

Replace type submit by buttom.

    $(function () {
        $('button').click(function (event) {
            $.getJSON('Home/checker', function (data) {
                alert(data);
            });
        });
    })

<form action="" method="post" id="websiteForm">
<input type="text" name="txtWebsite" id="txtWebsite" />
<input type="button" name="button" />
</form>

or

$(function () {
        $('#websiteForm').submit(function (event) {
            $.getJSON('Home/checker', function (data) {
                alert(data);
            });
            return false;
        });
    })

<form action="" method="post" id="websiteForm">
<input type="text" name="txtWebsite" id="txtWebsite" />
<input type="submit" name="submit" />
</form>