jQueryUI в C # ASP.NET MVC, результаты возвращаются, но не отображаются в сгенерированном списке - PullRequest
Новая
       10

jQueryUI в C # ASP.NET MVC, результаты возвращаются, но не отображаются в сгенерированном списке

0 голосов
/ 31 августа 2018

Я работаю над приложением, в котором одна из функций заключается в том, чтобы щелкнуть ссылку, вызвать модальное всплывающее окно и иметь возможность напрямую ввести электронное письмо и отправить соответствующий PDF / изображения на это электронное письмо. Конечный пользователь сказал мне, что было бы неплохо, чтобы вам не приходилось каждый раз вводить повторную электронную почту. Поэтому я настроил XML-документ для хранения уникальных электронных писем, введенных во входные данные, а затем отправил им электронное письмо, и я хочу заполнить автозаполнение jQueryUI ранее сохраненными электронными письмами. Я дошел до того, что результаты возвращаются правильно, но не отображаются в автозаполнении, и я нахожусь в конце своей веревки. Возможно, это что-то очевидное, но я новичок в том, что касается JavaScript или jQuery, поэтому мне было интересно, может ли кто-нибудь помочь мне.

HTML: 

@using (Html.BeginForm("SendPDFEmail", "RoadLog", FormMethod.Post))
{
<div class="modal fade" id="emailpdf" tabindex="-1" role="dialog" aria-labelledby="popupLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="popupLabel">Enter Recipient</h5>
            </div>
            <div class="modal-body">
                <div class="ui-widget">
                    @Html.TextBox("popupTxt", null, new { @class = "ui-autocomplete-input", @id = "popuptxt", @type = "email" })
                </div>
                @Html.CheckBox("imageChk", false, new { @height = "16px", @id = "imageChk" })
                <label for="imageChk">Attach related images to this email?</label>
            </div>
            <div class="modal-footer" style="margin-top:0px">
                <button type="button" class="btn btn-secondary" data-dismiss="modal" id="cancel">Cancel</button>
                <button type="button" class="btn btn-primary" id="submitpdf">Send</button>
            </div>
        </div>
    </div>
</div>
}

JQuery: 

$("#popuptxt").autocomplete({
    source: function (request, response) {
        $.ajax({
            url: '/Roadlog/Autofill',
            dataType: "json",
            data: { term: request.term },
            success: function (data) {
                response($.map(data, function (item) {
                    return {
                        label: item.Address,
                        value: item.Address
                    };
                }));
            }
        });
    },
    minLength: 3
});

Контроллер: 

public JsonResult Autofill(string term)
    {
        XDocument emailDoc = XDocument.Load(Server.MapPath("../Assets/emails.xml"));

        var emailList = emailDoc.Descendants("Contact").Select(e =>
          new
          {
              Address = e.Element("Email").Value
          }).ToList();

        List<string> Email;
        Email = emailList.Where(e => e.Address.Contains(term.ToLower())).Select(e => e.Address).Take(10).ToList();

        return Json(Email, JsonRequestBehavior.AllowGet);
    }

Также вот несколько скриншотов, чтобы показать, что именно я имею в виду, список автозаполнения появляется, потому что он получает результаты, но не отображает эти результаты в сгенерированные элементы списка:

Автозаполнение в модальном всплывающем окне Visual

HTML, сгенерированный автозаполнением, показывает пустые div

...