Jquery in combinatie met MVC3 C#

Status
Niet open voor verdere reacties.

InnerMe

Gebruiker
Lid geworden
10 nov 2009
Berichten
15
Hoi,

Ik ben bezig om een range slider te maken, die vervolgens data uit een database haalt en die dan toont onder range slider.

In de index.cshtml heb ik het volgende:


[JS]$(function () {
$("#slider-range").slider({
range: true,
min: 0,
max: 1000,
values: [0, 1000],
slide: function (event, ui) {
$("#amount").val("$" + ui.values[0] + " - $" + ui.values[1]);
},
change: function (event, ui) {
fetchCustomer(1);
}
});
$("#amount").val("$" + $("#slider-range").slider("values", 0) +
" - $" + $("#slider-range").slider("values", 1));
});

function fetchCustomer(skip) {
var $slide = $("#slider-range");
var min = ui.values[0];
var max = ui.values[1];
$.ajax({
type: "POST",
url: "Api.asmx/FetchCustomers",
data:({minPrice: min, maxPrice: max}),
contentType: "application/json; charset=utf-8",
dataType: "json",
async: true,
cache: false,
success: function (msg) {
var total = msg.d.TotalRecords;
if (total > 0) {
printCustomer(msg);
}
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert(textStatus);
}
});
}

function printCustomer(msg){
$ ("#result").text("");
var customers = msg.d.Customers;
for(var i = 0; i < customers.length; i++){
$("#result").append(customers.CompanyID + ", ");
$("#result").append(customers.CompanyName + ", ");
$("#result").append(customers.CompanyStreet + ", ");
$("#result").append(customers.CompanyPrice);
}
}
[/JS]

In mijn Api.asmx heb ik:
HTML:
[WebMethod]
        [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
        public string FetchCustomers()
        {
            var x = CustomerData.GetList();
            var js = new JavaScriptSerializer();
            return js.Serialize(x);
            
        }

En dan heb ik ook nog een andere classe genaamd: CustomerData.cs en daar heb ik het volgende:

HTML:
public class CustomerData
    {
        public string CompanyName { get; set; }
        public string CompanyStreet { get; set; }
        public int? CompanyPrice { get; set; }

        public static List<CustomerData> GetList()
        {
            var lList = new List<CustomerData>();

            using (var dc = new NorthwindDataContext())
            {
                var query = (from p in dc.Customers
                             select p);

                foreach (var x in query)
                {
                    lList.Add(new CustomerData()
                    {
                        CompanyName = x.CompanyName,
                        CompanyStreet = x.CompanyStreet,
                        CompanyPrice = x.CompanyPrice


                    });
                }

                return lList;
            }

In het bestandje Northwind staat dus de CustomerID, CustomerName enz.

Weet iemand hoe ik de slider kan koppelen aan lijst uit de database?

Alvast Bedankt
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan