jCarousel , PageMethod and ASP.Net

Question

i was trying to fetch image from server through calling server side function by JQuery. my code is working fine. no bug is there but the problem is image is not showing.

here i am giving my aspx and cs full code. so please some one tell me what wrong is there in the code as a result image is not showing where image path is ok.

ASPX

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="JCarousel.aspx.cs" Inherits="Carousel.JCarousel.JCarousel" %>

mycarousel .jcarousel-item-placeholder {

background: transparent url(../images/JQNavBtn/loading-small.gif) 50% 50% no-repeat;

}

jQuery(document).ready(function () { jQuery('#mycarousel').jcarousel({ itemLoadCallback: mycarousel_itemLoadCallback }); }); function mycarousel_itemLoadCallback(carousel, state) { if (carousel.prevFirst != null) { // Remove the last visible items to keep the list small for (var i = carousel.prevFirst; i carousel.last ? carousel.last : l; if (carousel.has(f, l)) { continue; } mycarousel_makeRequest(carousel, f, l, per_page, page); } } }; function mycarousel_makeRequest(carousel, first, last, per_page, page) { // Lock carousel until request has been made carousel.lock(); // Call the server side method with pageIndex and pageSize parameters $.ajax({ type: "POST", url: "JCarousel.aspx/GetItems", data: "{'pageIndex':'" + page + "', 'pageSize':'" + per_page + "'}", contentType: "application/json; charset=utf-8", dataType: "json", success: function (data) { mycarousel_itemAddCallback(carousel, first, last, data.d, page); } }); } function mycarousel_itemAddCallback(carousel, first, last, data, page) { // Unlock carousel.unlock(); // Set size carousel.size(12); var per_page = carousel.last - carousel.first + 1; for (var i = first; i "; item += ""; item += ""; alert(item); return item; };

</form>

CS code

using System;

using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using System.Web.Services; using System.Web.Script.Services;

namespace Carousel.JCarousel { public partial class JCarousel : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) {

    }

    [WebMethod]
    [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
    public static List<Product> GetItems(int pageIndex, int pageSize)
    {

        List<Product> oProduct = new List<Product> {
       new Product("~/images/1.jpg"),
       new Product("~/images/2.jpg"),
       new Product("~/images/3.jpg"),
       new Product("~/images/4.jpg"),
       new Product("~/images/5.jpg"),
       new Product("~/images/6.jpg"),
       new Product("~/images/7.jpg"),
       new Product("~/images/8.jpg"),
       new Product("~/images/9.jpg"),
       new Product("~/images/10.jpg"),
       new Product("~/images/11.jpg"),
       new Product("~/images/12.jpg"),
       new Product("~/images/13.jpg"),
       new Product("~/images/14.jpg"),
       new Product("~/images/15.jpg")

       //new Product("~/images/1.jpg", "Sample Data~.1"),
       //new Product("~/images/2.jpg", "Sample Data~.2"),
       //new Product("~/images/3.jpg", "Sample Data~.3"),
       //new Product("~/images/4.jpg", "Sample Data~.4"),
       //new Product("~/images/5.jpg", "Sample Data~.5"),
       //new Product("~/images/6.jpg", "Sample Data~.6"),
       //new Product("~/images/7.jpg", "Sample Data~.7"),
       //new Product("~/images/8.jpg", "Sample Data~.8"),
       //new Product("~/images/9.jpg", "Sample Data~.9"),
       //new Product("~/images/10.jpg", "Sample Data~.10"),
       //new Product("~/images/11.jpg", "Sample Data~.11"),
       //new Product("~/images/12.jpg", "Sample Data~.12"),
       //new Product("~/images/13.jpg", "Sample Data~.13"),
       //new Product("~/images/14.jpg", "Sample Data~.14"),
       //new Product("~/images/15.jpg", "Sample Data~.15")

        };
        return oProduct.GetRange((pageIndex - 1) * pageSize, pageSize);

    }
}

public class Product
{
    //file:///D:/JQuery/jquery-carousel-sample%20pagemethod%20good.html
    //http://sorgalla.com/jcarousel/


    public Product(){}
    public Product(string Image)
    {
        this.Image = Image;
    }

    public Product(string Image, string Title)
    {
        this.Image = Image;
        this.Title = Title;
    }

    string _Image = "";
    public string Image
    {
        get { return _Image; }
        set { _Image = value; }
    }

    string _Title = "";
    public string Title
    {
        get { return _Title; }
        set { _Title = value; }
    }

}

}

very sorry for the long code. please help me to solve the problem...why image is not showing.......Thanks

Answer 1

It might be because the image urls are sent as

~/images/1.jpg

try Page.ResolveUrl("~/images/1.jpg") as imageurl