Блог

Я пытаюсь создать динамическую таблицу, которая использует AJAX для получения расчетных цен со стороны Rails для единиц аренды. У каждой единицы аренды есть информация о ценах в формате JSON (/companies/:id/locations/:id/units/:id/price.json), которую я извлекаю.

Моя проблема заключается в функции, которая устанавливает значение text для каждой единицы. Похоже, что он извлекает JSON только для первого блока, и все следующие цены после этого устанавливаются на первый блок

 Request URL: /storage_companies/2/storage_locations/4/storage_units/10/price
{id: 10, monthly_cost: 7.25, total_price: 87}
  

В UnitController я настроил метод price для вывода информации о ценах в формате JSON:

 def price
    respond_to do |format|
      format.json { render json: @storage_unit, methods: [:total_price], only: [:id, :monthly_cost, :total_price]}
    end
  end
  

и маршрут:

 resources :companies do
   resources :locations do
     resources :units do
       member do
         get :price
       end
     end
   end
end
  

Как я могу реорганизовать это, чтобы перебрать все units и установить text ?

 $(function(){
  var CompanyId = $('.storage_company').data('params-id');
  var LocationId = $('.select_location').data('params-id');
  var UnitId = $('.select_unit').data('params-id');

  $.getJSON(`/companies/${CompanyId}/locations/${LocationId}/units/${UnitId}/price`, callbackFuncWithData);

  function callbackFuncWithData(data){
    $(".monthly_estimated_price").text("$"   data.monthly_cost.toFixed(2));
    $(".total_estimated_price").text("$"   data.total_price.toFixed(2));
  };
});
  

Обновить

 $.getJSON("/prices", function(data){
    $.each(data, function (index, value) {
      var price = value;
      $(`.select_unit[data-params-id="${price.id}"]`).each(function(){
        $(".monthly_estimated_price").text("$"   price.monthly_cost);
        console.log(price)
      });
    });
  });
  

Я думаю, что я почти на месте, но все еще не до конца понимаю, как выполнять итерации и устанавливать их динамически.