Question

I just started using jQuery, but i can’t get it working.

On the index.php page I want a search form that posts to search.php. Following next, I want that the HTML of search.php (which will only be a table with the results), is inserted into the ‘results’ div in the index.php.

This is the code I’m using:

<script type="text/javascript">
  /* attach a submit handler to the form */
$(document).ready(function () {
    alert("Ok - 1");
    $("#zoeken").submit(function (event) {
        alert("Ok - 2");
        event.preventDefault();
        $.post("https://nodots.nl/labs/dd/search.php", $("#zoeken").serialize() {
            alert("Ok - 3");
            success: function (html) {
                $("#result").empty().html(html);
                alert("Ok - 4");
            }
        });
    });
});
</script>

The alerts are for debugging, but none of them shows up. Can anyone tell me what I’m doing wrong?

Answer 1

I believe that for $.post, the third argument is actually the success function, like so:

$.post("URL","ARGUMENTS","SUCCESS FUNCTION");

so for your needs:

$.post("https://nodots.nl/labs/dd/search.php", $("#zoeken").serialize(), 
    function(html)
    {
        $("#result").empty().html(html);
        alert("Ok - 4");
    }
});

Entire Code:

<script type="text/javascript"> 
$(document).ready(function () {
    alert("Ok - 1");
    $("#zoeken").submit(function (event) {
        alert("Ok - 2");
        event.preventDefault();
        alert("Ok - 3");
        $.post("https://nodots.nl/labs/dd/search.php", $("#zoeken").serialize(),
            function(html) {
                $("#result").empty().html(html);
                alert("Ok - 4");
            }
        });
    });
});
</script>