<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Autocomplete - Default functionality</title>
<link rel="stylesheet"
href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link rel="stylesheet"
href="/resources/demos/style.css">
<script type="text/javascript">
//We need to run our function only after sp.js file
loads
ExecuteOrDelayUntilScriptLoaded(ViewItem, "sp.js");
function ViewItem() {
var context = new
SP.ClientContext.get_current();
var web = context.get_web();
var list = web.get_lists().getByTitle('City');
//It will fetch all the items from the list
var myquery = new
SP.CamlQuery.createAllItemsQuery();
myItems = list.getItems(myquery);
context.load(myItems);
//If the
items load correctly then success function will be called
context.executeQueryAsync(Function.createDelegate(this, this.success),
Function.createDelegate(this, this.failed));
}
function success() {
var text = [];
var ListEnumerator = this.myItems.getEnumerator();
while (ListEnumerator.moveNext()) {
//Will get the current row from the SP
List
var currentItem =
ListEnumerator.get_current();
text.push(currentItem.get_item('Title'));
}
$("#tags").autocomplete({
source: text
});
}
function failed(sender, args) {
alert("failed. Message:" +
args.get_message());
}
</script>
</head>
<body>
<div class="ui-widget">
<label for="tags">
Tags:
</label>
<input id="tags">
</div>
</body>
</html>
No comments:
Post a Comment