时间戳

首页 > 解决方案 > JQuery 自动完成不会在模态窗口中触发

jquery - JQuery 自动完成不会在模态窗口中触发

问题描述

我正在使用完美运行的 JQuery 自动完成功能。我有一个可以作为独立表单完美运行的表单（这意味着我可以通过 URL 访问它）但是当我将表单包含在 Bootstrap 模态框中时，JQuery 自动完成不会触发。

我正在渲染模态表单如下

 function cloneProposal(id) {
            $.ajax({
                type: 'GET',
                url: '@Url.Action("Clone", "Proposal")',
                data:
                {
                    id: id
                },
                cache: false,
                success: function (result) {
                    document.getElementById("modalbody").innerHTML = result;
                    var modalBox = $('#myModal');
                    modalBox.attr("proposalnumber", id);
                    $("#modalTitle").html('Clone Proposal');
                    modalBox.modal('show');
                },
                error: function (response) {
                    alert('Bad Request ' + response.responseText);
                }
            });
        }

表单正确呈现，但没有任何 JQuery 代码触发。有哪些可能的原因会导致这种情况发生？我什至编写了一个更改事件。当表单直接从 URL 执行时，它会正确触发，但在通过 Modal 呈现时不会。

$("input").change(function(){
  alert("The text has been changed.");
});

控制台中没有错误。我不知所措。有人可以指出我正确的方向以弄清楚发生了什么吗？

谢谢一堆。

--- 值

标签： jqueryasp.net-corebootstrap-modalasp.net-ajax

解决方案

我终于通过改变加载模式的方式解决了这个问题。我将代码更改为以下内容，现在 JQuery 可以正确触发。

showInPopup = (url, title) => {
    $.ajax({
        type: "GET",
        url: url,
        success: function (res) {
            $('#form-modal').modal('handleUpdate')
            $('#form-modal .modal-body').html(res);
            $('#form-modal .modal-title').html(title);
            $('#form-modal').modal('show');
        }
    })
}

推荐阅读