在ajax调用之后,Jquery .autocomplete无法正常工作

时间:2013-05-15 08:52:10

标签: php jquery

嗨,大家好我正在尝试写一个标题匹配器,我得到了它的工作但是当ajax调用时它不再起作用,下面是我的代码:

 <script type="text/javascript" src="jquery.autocomplete.js"></script>
    <link rel="stylesheet" type="text/css" href="jquery.autocomplete.css" />
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

   $(document).ready(function() 
            {
                $(".course").autocomplete("look_me_up.php", 
                    {
                        width: 260,
                        matchContains: true,
                        mustMatch: true,
                        selectFirst: false
                    });

                $(".course").result(function(event, data, formatted)
                    {
                          $(this).next(".course_val").val(data[1]);
                    });
            });

我要更新的文本框是从首先发出的ajax请求中调用的:

<input type="text" name="course" id="text1" value="Find Title In DB" class="course">
<input type="hidden" id="val1" class="course_val">

ajax请求是:

function checks()
            {

            $.ajax({
                type : "POST",
                url : "get_data.php",
                data : "function="+"get_text",
                success : function(msg) 
                    {
                       $(update_me).html(msg);
                    }
                });
            }

我认为jquery正在起作用,因为它试图更新从ajax请求中提取的值?我正在努力让它发挥作用,所以任何帮助都会受到赞赏。

2 个答案:

答案 0 :(得分:0)

这似乎是动态元素创建的一个问题。

您已加载了一些course元素,并且已对其初始化自动完成,之后您似乎正在使用新元素替换这些元素。在这里,您没有初始化新元素的自动完成。

解决方案是初始化动态添加元素的自动完成

function createCourse(els){
    els.autocomplete("look_me_up.php", {
        width: 260,
        matchContains: true,
        mustMatch: true,
        selectFirst: false
    });

    els.result(function(event, data, formatted){
        $(this).next(".course_val").val(data[1]);
    });
}

$(document).ready(function() {
    createCourse($(".course"))
});

function checks() {
    $.ajax({
        type : "POST",
        url : "get_data.php",
        data : "function="+"get_text",
        success : function(msg)  {
            $(update_me).html(msg);
            createCourse($(".course", update_me))
        }
    });
}

答案 1 :(得分:0)

  

更改

$(document).ready(function()

  

$(document).ajaxComplete(function()

  

和宾果:)