2017-06-13 90 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