How to pass dates as parameters in Ajax url get call?

Question

I have an Ajax call that tries to populate a highchart by calling an api . I am trying to access date values from ViewBag and passing them to the AJAX url, I end up getting an error

jQuery.Deferred exception: Jun is not defined ReferenceError: Jun is not defined

the value from the ViewBag looks like June-2022 . The ajax implementation looks like

  $.ajax({
             url: 'api/getProvinceData/'+ @ViewBag.reportinPeriod,
             type: 'GET',
             success: function (data) { }
        });

so the complete api with the values filled up should look like when it gets the value in the ViewBag

 url: 'api/getProvinceData/Jun-2022'

Why am I getting Jun is undefined in Ajax, while I am just accessing the value directly from the ViewBag? Any help is appreciated.

Answer 1

Because you are calling a view it will render it as 'api/getProvinceData/'+ Jun-2020, so the best way to access it is to just have it inside the quotes and not concatenate it so it will be

$.ajax({
             url:  'api/getProvinceData/@ViewBag.reportinPeriod',
             type: 'GET',
             success: function (data) { }
        });

and it will make the api correctly as

 'api/getProvinceData/June-2022