jquery ui自动完成选择函数disaplay在fancybox中

Question

这就是我的工作原理。

<script>
$(document).ready(function() {
        $("#search").autocomplete({
            source: function(request, response) {
                $.ajax({
                    url: '@Url.Action("SearchString")',
                    type: "POST",
                    dataType: "json",
                    data: request,
                    success: function(data) {
                        response($.map(data,
                            function(item) {
                                return { label: item.CustomerName, value: item.CustomerName, id: item.CustomerId };
                            }));
                    }
                });
            },
            select: function(event, ui) {
                $.fancybox.open({
                    src:'@Url.Action("Details")' + "/" + ui.item.id,
                });
            }            
    });
    });


</script>

<input id="search" />

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.min.css">
<script src="~/Scripts/jquery-ui-1.12.1.min.js"></script>
<link rel="stylesheet" href="~/Scripts/fancybox-3.0/dist/jquery.fancybox.min.css" />
<script src="~/Scripts/fancybox-3.0/dist/jquery.fancybox.min.js"></script>

  

在“url”中我调用了SearchString方法，返回label，value和id。   在选择事件中，我打开所选项目thrue a fancybox。