Получение значения в таблице HTML путем поиска с использованием Jquery и AJAX в MVC - PullRequest
Новая
       24

Получение значения в таблице HTML путем поиска с использованием Jquery и AJAX в MVC

0 голосов
/ 11 декабря 2018

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

логика контроллера: 

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using WebApp.Controllers;
using WebApp.Models;
namespace WebApp.Controllers
{
    public class SearchByIdController : Controller
    {
        MvcTstEntities ob = new MvcTstEntities();
        // GET: SearchById
        public ActionResult Index()
        {
            return View();
        }
        public JsonResult Search(string mail)
        {
            var str = (from test in ob.Emp where test.EmailId == mail select test).FirstOrDefault();
            return Json(str, JsonRequestBehavior.AllowGet);
        }
    }
}

Просмотр логики 

<body>


      <form class="form-inline">

          <div class="form-group mx-sm-3 mb-2">
              <label for="exampleInputEmail1">Email</label>
              <input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter email">
          </div>
          <button type="button" id="btnsearch" class="btn btn-primary mb-2">Search</button>
      </form>
      <div>
          <div class="container" id="tbleshow">
              <table class="table table-striped">
                  <tr>
                      <th>ID</th>
                      <th>Name</th>

                  </tr>


                      <tr>
                          <td id="ide" ></td>
                          <td id="nm"></td>

                      </tr>

              </table>
          </div>
      </div>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#tbleshow").hide();

            $("#btnsearch").click(function (e) {
                debugger
                e.preventDefault();
                $("#tbleshow").show();
                return myfunction();

            });

            function myfunction() {

                var model = {

                    Email: $("#exampleInputEmail1").val(),



                }

                $.ajax({
                    type: 'GET',
                    url: "/SearchById/Search",
                    dataType: 'json',

                    data: {

                        Email: model.Email,


                    },


                    success: function (run) {

                        $("#ide").val(run.EmailId);
                        $("#nm").val(run.Name);


                        if (run) {

                            alert("This is the details");
                        }
                        else {
                            alert("Something wrong in success");
                        }

                    },

                    error: function () {
                        console.log('something went wrong - debug it!');
                    }
                });
            }





        });
    </script>


</body>

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

1 Ответ

0 голосов
/ 11 декабря 2018

Проблема в том, что вы используете этот метод действия с mail в качестве имени параметра: 

public JsonResult Search(string mail)

, но в свойстве data вашего AJAX-вызова содержится параметр Email, как показано ниже,не соответствует имени параметра, определенному в методе действия контроллера: 

$.ajax({
     type: 'GET',
     url: "/SearchById/Search",
     dataType: 'json',

     data: {
         Email: model.Email, // this is the wrong part
     },

     success: function (run) {
         // show the results
     },
     error: function () {
         console.log('something went wrong - debug it!');
     }
});

Чтобы соответствовать имени параметра AJAX, вы должны изменить имя параметра действия на Email: 

public JsonResult Search(string Email)
{
    var str = (from test in ob.Emp 
               where test.EmailId == Email 
               select test).FirstOrDefault();
    return Json(str, JsonRequestBehavior.AllowGet);
}

Иначесохранить действие контроллера как есть, но изменить имя параметра AJAX, чтобы оно совпадало с именем параметра действия контроллера: 

$.ajax({
     type: 'GET',
     url: "/SearchById/Search",
     dataType: 'json',

     data: {
         mail: $("#exampleInputEmail1").val() // this is correct
     },

     success: function (run) {
         // show the results
     },
     error: function () {
         console.log('something went wrong - debug it!');
     }
});

Обновление:

Если run содержит JSONстрока вместо объекта, вам нужно сначала проанализировать строку: 

var obj = JSON.parse(run);

, а затем использовать этот объект для отображения значений: 

$("#ide").val(obj.EmailId);
$("#nm").val(obj.Name);
...