Need some help with select2 web method
alexw...@gmail.com
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="demo.aspx.cs" Inherits="demo" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src='http://code.jquery.com/jquery-latest.min.js' type='text/javascript'></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js" type='text/javascript'></script>
<link href="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.min.css" rel="stylesheet" />
<script src="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.min.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<select id="txtStart" style="width:300px"></select>
</div>
<script type="text/javascript">
$(document).ready(function () {
Select2();
});
function Select2() {
$('#txtStart').select2({
allowClear: true,
placeholder: "Where from",
minimumInputLength: 2,
ajax: {
type: "Post",
dataType: "json",
params: {
contentType: 'application/json; charset=utf-8'
},
url: '<%=ResolveUrl("~/demo.aspx/GetLocation") %>',
data: function (term, page) {
return JSON.stringify({ q: term, page_limit: 10 });
},
delay: 150,
processResults: function (data, page) {
return {
results: data.matches.map(function (item) {
return {
id: item.text,
text: item.text
};
}),
pagination: {
more: data.matches.length === 10
}
};
},
}
});
}
</script>
</form>
</body>
</html>
The web method does get called by other methods so I know it works. I am missing something can anyone spot my mistake?
What I would like to achieve (not sure its possible) is to load on page load a number of options into the select component these would be popular locations so the load very quickly there would be around 100 of these loaded at page load and they only consist of a place name so 1k-2k of data, I want those loaded client side, then if the user types something not in that list it uses ajax to do a lookup into the sql database to return matches (caching them on the client side if possible) and then if the user types something not in ether this I need to be able to then run another method to store that on the server side for processing.
Sorry for the longwinded message can anyone help please.
Thank you.
Alex