Question 69750 in Ajax Question posted in
You can find the official documentation here.

Cannot Display Data from getJson Call on Live Server ASP.NET Core MVC 5 – Jquery ajax

I have an issue with one particularly problematic Controller Method on my site. It is supposed to fetch the Price of an item based on the Product Id, Product Attribute i.e Length and the Product Attribute Value i.e. 1.5 mm. I am using a getJson request to achieve this. The method works perfectly within my local server, but when on the live server, it accesses the method, but does not serve up the price. The method looks something like this.

        [HttpGet]
        [ActionName("GetPriceFromSetAttributes")]
        public IActionResult GetPriceFromSetAttributes(int productId, string productAttributeName, string productAttributeValueName)
        {
            var price = _repository.GetProductPriceFromSetAttributes(productId, productAttributeName, productAttributeValueName);
            return new JsonResult(price);
        }

This is the getJson request.

                var controllerUrl = '@Url.Action("GetPriceFromSetAttributes", "Cart")';
                $.getJSON(controllerUrl, { productId: $("#productId").val(), productAttributeName: $(this).attr('id'), productAttributeValueName: $(this).val() }, function (data) {
                    if (data.attributePrice != null) {
                        $("#attributePrice").val("KES. " + data.attributePrice.toLocaleString() + "");
                        $("#attributePriceToPost").val("" + data.attributePrice + "");
                        $("#originalPriceAt").hide();
                        $("#attributePriceAt").show();
                    }
                    $('#addToCart').html('<i class="fas fa-cart-plus mr-2"></i> Add to Cart');
                    $('#addToCart').prop('disabled', false).removeClass('noHover');
                });

The site initially threw a cross origin exception, after enabling CORS using the code below,

            services.AddCors(options =>
            {
                options.AddPolicy("MyAllowSpecificOrigins",
                                  builder =>
                                  {
                                      builder.WithOrigins("https://localhost:44383",
                                                          "https://tendcorp.co.ke")
                                                          .AllowAnyHeader()
                                                          .AllowAnyMethod()
                                                          .AllowCredentials();
                                  });
            });
            
            
            

            app.UseCors("MyAllowSpecificOrigins");

there are no exceptions but the problem persists. I’ve even tried connecting to the SQL DB from my dev environment to no avail.

Screenshots for both the live server as well as my localhost are attached.

Live Environment

Localhost

Anyone with pointers? What could I be doing wrong?

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    I used Serge's ajax function (marked as the answer, above) and modified my own controller to serve up a string as opposed to a JSON object, since the live server kept sending back a text response to my JSON request.

    The controller now looks like this:

            [HttpGet]
        [ActionName("GetPriceFromSetAttributes")]
        public IActionResult GetPriceFromSetAttributes(int productId, string productAttributeName, string productAttributeValueName)
        {
            var price = _repository.GetProductPriceFromSetAttributes(productId, productAttributeName, productAttributeValueName).AttributePrice.ToString();
            return Content(price);
        }

    It fetches the required data faster than before too.


  2. 0

    getjson is not best choise in your case since it is converted to ajax afterword, try jquery ajax directly

     var controllerUrl = '@Url.Action("GetPriceFromSetAttributes", "Cart")'
+ '?productId='+ $("#productId").val() 
+'&productAttributeName=' + $(this).attr('id')
+'&productAttributeValueName='+ $(this).val();

  $.ajax({
            type: 'GET',
            dataType: 'json',
            url: controllerUrl,
            success: function (data) {
             if (data.attributePrice != null) {
                .... your code
             }             
          }
  });
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search