asp.net mvc запрос загрузки с контроллера - PullRequest
0 голосов
/ 29 октября 2018

Я пытаюсь прочитать мой запрос с контроллера, и у меня уже есть вызов Ajax, чтобы получить его через мою кнопку. но моя проблема в том, что в моем представлении индекса не происходит никаких изменений, таблица не изменилась и не может понять, почему.

Вот мой взгляд:

@{
    ViewBag.Title = "LoadInfo";
}

@model IEnumerable<MyApp.Models.LoadInfo>
<html>
<body>
    <input style="text-align:left; width:250px" id="txtSearch" type="text" />
    <button type="button" id="search" onclick="search()" class="btn btn-primary">Search</button>

    <div class="tableFixHead" ; style="margin-top: 10px;">
            <table class="table">
                <thead>
                    <tr>
                        <th>ID</th>
                        <th>Name</th>
                        <th>Address</th>                    
                        <th></th>
                    </tr>
                </thead>
                <tbody>
                    @foreach (var item in Model)
                    {
                        <tr>
                            <td>@item.ID</td>
                            <td>@item.Name</td>
                            <td>@item.Address</td>                        
                        </tr>
                    }
                </tbody>
            </table>
        </div>
</body>
</html>

<script>
function search() {
    var search = document.getElementById("txtSearch").value    

    $.ajax({
        url: '/Home/LoadInfo',
        type: 'GET',
        data: {
            'name': search                
        },

        success: function (data) {
            alert("success")                

        },
        error: function (jqXhr, textStatus, errorThrown) {
            alert(errorThrown);
        }
    });
}
</script>

Контроллер:

public ActionResult LoadInfo(string name)
{            
    List<readDetails> userDetails = new List<readDetails>();
    string constr = ConfigurationManager.ConnectionStrings["ConString"].ConnectionString;
    using (MySqlConnection con = new MySqlConnection(constr))
    {                
        string query = "SELECT ID, Name, Address FROM EmpDetails WHERE Name like '%" + name + "%' LIMIT 500";
        using (MySqlCommand cmd = new MySqlCommand(query))
        {
            cmd.Connection = con;
            con.Open();
            using (MySqlDataReader sdr = cmd.ExecuteReader())
            {
                while (sdr.Read())
                {                   
                        userDetails.Add(new readDetails
                        {
                            op = sdr["ID"].ToString(),
                            op_desc = sdr["Name"].ToString(),
                            doc_id = sdr["Address"].ToString(),                            
                        });

                }
            }
            con.Close();
        }
    }
    return View(userDetails);    
}

Я также использую этот контроллер для загрузки моей стартовой страницы, не уверен, что это является причиной проблемы, нужно ли мне создавать отдельный контроллер и просматривать для начальной загрузки и для моей функциональности поиска.

Результат предупреждает меня об «успехе», но это странно, потому что моя таблица не меняется и не обновляется, как если бы вы выполняли простой запрос с фильтром из браузера запросов.

1 Ответ

0 голосов
/ 29 октября 2018

Вам необходимо добавить функцию html() для элемента таблицы <tbody>, чтобы переопределить существующие результаты новым:

$.ajax({
    url: '/Home/LoadInfo',
    type: 'GET',
    data: {
        'name': search                
    },

    success: function (data) {
        alert("success");
        $('.table tbody').html(data); // override previous results               
    },
    error: function (jqXhr, textStatus, errorThrown) {
        alert(errorThrown);
    }
});

Если ответ содержит весь элемент <table>, вы должны опустить tbody selector:

$('.table').html(data);

Также вы можете попытаться вернуть PartialView(), например, return PartialView(userDetails); вместо всей страницы просмотра, если результаты поиска представлены на той же странице поиска.

Обновление:

Поскольку data возвращает всю HTML-страницу, текущее действие контроллера должно быть изменено так, чтобы оно возвращало ответ JSON, как в этом примере:

public ActionResult LoadInfo(string name)
{            
    List<readDetails> userDetails = new List<readDetails>();
    string constr = ConfigurationManager.ConnectionStrings["ConString"].ConnectionString;
    using (MySqlConnection con = new MySqlConnection(constr))
    {                
        string query = "SELECT ID, Name, Address FROM EmpDetails WHERE Name like '%" + name + "%' LIMIT 500";
        using (MySqlCommand cmd = new MySqlCommand(query))
        {
            cmd.Connection = con;
            con.Open();
            using (MySqlDataReader sdr = cmd.ExecuteReader())
            {
                while (sdr.Read())
                {                   
                        userDetails.Add(new readDetails
                        {
                            op = sdr["ID"].ToString(),
                            op_desc = sdr["Name"].ToString(),
                            doc_id = sdr["Address"].ToString(),                            
                        });

                }
            }
            con.Close();
        }
    }
    return Json(userDetails, JsonRequestBehavior.AllowGet);    
}

Затем замените существующее содержимое <tbody> данными из ответа:

$.ajax({
    url: '/Home/LoadInfo',
    type: 'GET',
    data: {
        'name': search                
    },
    dataType: 'json',
    success: function (data) {
        alert("success");
        var tblbody = $('.table').find('tbody');
        tblbody.empty(); // remove existing rows
        var row = '';
        $.each(data, function(i, item) {
            row += $('<tr>').append($('<td>').text(item.ID), $('<td>').text(item.Name), $('<td>').text(item.Address));
            tblbody.append(row); // add new rows
        });              
    },
    error: function (jqXhr, textStatus, errorThrown) {
        alert(errorThrown);
    }
});

На этом этапе результаты поиска должны отображаться в той же таблице, а не возвращать весь контент HTML.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...