2017-06-13 89 views
0

我想在SharePoint 2013中使用Jquery中的自动完成选项。在Newform.aspx自定义中使用自动完成

我曾尝试下面的代码

 var autocomplete = $("input[title='Skill Required Field']").autocomplete({ 
minLength: 3, 
source: function(request, response) { 
$.ajax({ 
beforeSend: function (request) 
{ 
request.setRequestHeader("Accept", "application/json;odata=verbose;charset=utf-8"); 
}, 
url: site url, 
dataType: "json", 
success: function(data) { 
$.each(data.d.results , function (i, result) { 
if(result.Title){ 
titles.push(result.Title) 
}        
}); 
response(titles); 
}, 
error: function(data) { 
alert('search error'); 
} 
}); 
}, 
// Run this when the item is in focused (not selected) 
    focus: function(event, ui) { 
    return false; 
    }, 
// Run this when the item is selected 
    select: function(event, ui) { 
     location.href = ui.item.fields.Path; 
    }, 
appendTo: $('#menu-container') 
}).data("uiAutocomplete")._renderItem = function(ul, item) { 
return $("<li>").append('<div>' + item.label + '</div>').appendTo(ul); 
}; 

function getFields(results) { 
r = {}; 
for(var i = 0; i< results.length; i++) { 
if(results[i] != undefined && results[i].Key != undefined) { 
r[results[i].Key] = results[i].Value; 
       } 
      } 
      return r; 
     } 

我定制新form.aspx。我已经加入一个JSLink,其中,用于所述技术人员的数据被定义如下:

"<div id='menu-container' class = 'col-xs-3'>{{SkillCtrl}}</div>", 

formTable = formTable.replace("{{SkillCtrl}}", getSPFieldRender(ctx, "MySkill")); 

该列作为单个文本行创建。我使用的是jquery-ui-1.12.1,jquery-1.11.3.min。 目前我没有收到任何错误,但结果不显示在菜单容器框中。当使用F12时,我可以看到“result.Title”中的数据。但是,UI中没有显示数据。我错过了什么? ?如何解决这个感谢

+0

结果需要返回到'response()',我没有看到你的例子。我也没有看到示例代码中存在的位置。 – Twisty

回答

0

我会尝试以下success代码:

success: function(data) { 
    var titles = []; 
    $.each(data.d.results, function(i, result) { 
    if (result.Title) { 
     titles.push(result.Title); 
    } 
    }); 
    response(titles); 
} 

此外,当您renderItems,你必须正确地包起来:<li><div></div></li>。我会建议:

return $("<li>").append('<div><img style="margin-right:3px;top:3px;" src="/_layouts/15/images/' + img + '">' + item.label + '</div>').appendTo(ul); 
+0

感谢您的回复。我纠正了这些。但仍然没有在用户界面中显示数据。我尝试了一个项目,返回李的声明被击中了3次,但没有数据被反射回来。我已经更新了我的现有代码,并对我所做的更改 – venkat14

+0

@ venkat14进行了更新我将在“success”回调中添加'console.log(data)',然后检查您从AJAX调用中获得的数据是什么你的期望。你还可以编辑你的文章,并包括一个'data'看起来像什么的例子吗? – Twisty