0

I have created list of REST Web Services using MVC Web API 2.0, Entity Framework 6.0.

My problem is if i am making call to show list of images using jQuery then my request will automatically canceled see below image enter image description here and it will not showing any result at client side, but my server side code will return the correct result set. see below screen of my server side code: enter image description here

I am using following code: Model

public partial class MAItem
    {
        public MAItem()
        {
            this.MACartItems = new HashSet<MACartItem>();
            this.MAItemImages = new HashSet<MAItemImage>();
            this.MAOrderDetails = new HashSet<MAOrderDetail>();
        }

        public int ItemId { get; set; }
        public int CategoryId { get; set; }
        public string ItemName { get; set; }
        public string Code { get; set; }
        public string Brand { get; set; }
        public decimal Price { get; set; }
        public Nullable<decimal> Discount { get; set; }
        public Nullable<decimal> Points { get; set; }
        public string Description { get; set; }
        public int StoreId { get; set; }

        public virtual ICollection<MACartItem> MACartItems { get; set; }
        public virtual MACategory MACategory { get; set; }
        public virtual MAStore MAStore { get; set; }
        public virtual ICollection<MAItemImage> MAItemImages { get; set; }
        public virtual ICollection<MAOrderDetail> MAOrderDetails { get; set; }
    }

public partial class MACategory
    {
        public MACategory()
        {
            this.MAItems = new HashSet<MAItem>();
        }

        public int CategoryId { get; set; }
        public string CategoryName { get; set; }

        public virtual ICollection<MAItem> MAItems { get; set; }
    }



 public partial class MAStore
    {
        public MAStore()
        {
            this.MAItems = new HashSet<MAItem>();
            this.MAMembershipCards = new HashSet<MAMembershipCard>();
            this.MAOrders = new HashSet<MAOrder>();
        }

        public int StoreId { get; set; }
        public string StoreName { get; set; }
        public Nullable<double> Latitude { get; set; }
        public Nullable<double> Longitude { get; set; }
        public string Address { get; set; }
        public string Phone { get; set; }

        public virtual ICollection<MAItem> MAItems { get; set; }
        public virtual ICollection<MAMembershipCard> MAMembershipCards { get; set; }
        public virtual ICollection<MAOrder> MAOrders { get; set; }
    }

public partial class MAItemImage
    {
        public int ItemImageId { get; set; }
        public int ItemId { get; set; }
        public string ImagePath { get; set; }
        public string AlternateText { get; set; }

        public virtual MAItem MAItem { get; set; }
    }

Controller - MAItemController.cs

[HttpGet]
        [Route("items")]
        public IQueryable<MAItem> GetItems()
        {
            try
            {
                return _service.GetMAItems().AsQueryable<MAItem>();
            }
            catch (Exception e)
            {
                Console.WriteLine(e);
            }
            return null;
        }

Services - MAItemService.cs

 public List<MAItem> GetMAItems()
        {
            string[] Includes = new[] { "MAStore", "MACategory", "MAItemImages" }; 
            List<MAItem> items = new List<MAItem>();
            items = _repository.GetAll(Includes).ToList();
            return items;
        }

Java Script Code

function getAllItem() {
    var req = Object.create(ajax);
    req.parameters = { url: API + '/api/mobileapp/items' };
    req.callback.success = successGetAllItem;
    req.get();
}
function successGetAllItem(data) {
    $(".loading").hide();    
    $.each(data, function (idx, d) {
        alert(d);
    });
}

var ajax = {
    parameters: {
        url: '',
        dataType: 'json',
        data: {},
        contentType: 'application/json',
        loading: false,
        crossDomain: true,
        async: true,
        processData: true,
        timeout: 60000,
        otherData: {}
    },
    callback: {
        success: null,
        error: null
    },
    get: function () {
        this.send('GET');
    },
    post: function () {
        this.send('POST');
    },
    del: function () {
        this.send('DELETE');
    },
    send: function (type) {
        self = this;
        if (!navigator.userAgent.match(/iPad|iPhone|iPod|android|blackberry|IEMobile/i)) {
            this.loadingIcon.show();

            if (this.isUndefined(this.parameters.dataType)) this.parameters.dataType = 'json';
            if (this.isUndefined(this.parameters.contentType)) this.parameters.contentType = 'application/json';
            if (this.isUndefined(this.parameters.loading)) this.parameters.loading = false;
            if (this.isUndefined(this.parameters.crossDomain)) this.parameters.crossDomain = true;
            if (this.isUndefined(this.parameters.async)) this.parameters.async = true;
            if (this.isUndefined(this.parameters.processData)) this.parameters.processData = true;
            if (this.isUndefined(this.parameters.timeout)) this.parameters.timeout = 30000;
            if (this.isUndefined(this.callback.error)) this.callback.error = this.defaultError;

            return $.ajax({
                type: type,
                url: this.parameters.url,
                dataType: this.parameters.dataType,
                data: (this.parameters.processData) ? JSON.stringify(this.parameters.data) : this.parameters.data,
                processData: this.parameters.processData,
                contentType: this.parameters.contentType,
                crossDomain: this.parameters.crossDomain,
                async: this.parameters.async,
                timeout: this.parameters.timeout,
                success: function (data) {
                    var args = arguments[2];
                    if (!self.isUndefined(self.callback.success)) {
                        if (self.isUndefined(self.parameters.otherData))
                            self.callback.success.call(this, data, args.statusText, args);
                        else
                            self.callback.success.call(this, data, args.statusText, args, self.parameters.otherData);
                    }
                    self.loadingIcon.hide();
                },
                error: function (xhr, ajaxOptions, thrownError) {
                    xhrServerObj = xhr;
                    self.callback.error.call(xhr, ajaxOptions, thrownError);
                    self.loadingIcon.hide();
                }
            });
        }
    },
    isUndefined: function (param) {
        return (typeof param == 'undefined' || param == null);
    },
    defaultError: function (data, textStatus, jqXHR) {
    },
    loadingIcon: {
        show: function () {
            if (self.parameters.loading) {
                console.log('Show loading....');
            }
        },
        hide: function () {
            if (self.parameters.loading) {
                console.log('Hide loading....');
            }
        }
    }
}

Please Note: I am able to get the responses from the different methods like /category, /stores, /users but the only issue is with /items. This problem also persist in Firefox browser as well. Can anybody let me know the root cause of the issue.

imdadhusen
  • 2,493
  • 7
  • 40
  • 75
  • Can you post your script code? which is responsible for making this call? – Mox Shah Mar 30 '15 at 13:24
  • @MokshShah I have added javascript code as well. Please do let me know still you need any detail from me. – imdadhusen Mar 30 '15 at 13:33
  • Look at this answer, it may help :http://stackoverflow.com/a/13459106/1107638 – Mox Shah Mar 30 '15 at 13:41
  • Actually i was able to get the responses of other methods like `/stores` or `/category` from the same server, moreover it is also showing same message on Firefox browser for `/items` api – imdadhusen Mar 30 '15 at 14:00

0 Answers0