locked
Help with displaying a search results table after searching. AJAX and JQuery. RRS feed

  • Question

  • User124588617 posted

    Please! I need your help.

    I've followed the tutorial here: https://docs.microsoft.com/en-us/aspnet/core/data/ef-rp/intro?view=aspnetcore-2.2&tabs=visual-studio

    What I'm trying to do is hide the table with the results initially using a css class, then when the user searches, display the appropriate results. I'm trying to use AJAX but struggling. Could anyone point me in the right directions please?

    Table HTML:

    <table id="resultsTable" class="table d-none">

    JQuery:

    $(function () {
        $('#searchForm').on('submit', function (e) {
            e.preventDefault()
            const search = $('#search').val();
    
            $.ajax({
                type: 'GET',
                url: '/?SearchString=' + search,
                contentType: "application/json",
                dataType: "json",
                success: function () {
                $('#resultsTable').removeClass('d-none');
                }
            });
        });
    });


    Tuesday, March 26, 2019 8:51 AM

All replies

  • User-2054057000 posted

    You are making HTTP GET AJAX request using jQuery GET method and I think this is somewhere failing.

    First of all make sure you applied the jQuery link in your page head section:

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>

    If this does not works then add the error callback method to your code like this:

    $.ajax({
    type: 'GET',     url: '/?SearchString=' + search,     contentType: "application/json",     dataType: "json",
    success: function (result, status, xhr) {
    $('#resultsTable').removeClass('d-none');
    },
    error: function (xhr, status, error) {
    alert("Result: " + status + " " + error + " " + xhr.status + " " + xhr.statusText)
    }
    });

    The error method will give you the any alert message which you encountered in the alert box. Then you can easily debug your application.

    Tuesday, March 26, 2019 9:44 AM
  • User-474980206 posted

    unless the table was built before the user clicked search, there is nothing to show. the search url should pass back the data, then javascript needs to convert this to a table. or the ajax call could return the table as html.

    Tuesday, March 26, 2019 3:12 PM