インクリメンタルサーチのURLを指定してもコンソール上で失敗と表示される

Question

前提・実現したいこと

DBで保存した内容をインクリメンタルサーチを使い表示したいのですが、インクリメンタルサーチ実装時のajaxでurlを指定する際、rails routesで確認し該当するパスを打ち込んでも404のエラーがコンソール上で表記されるのでこの問題を解決したい。

発生している問題・エラーメッセージ

jquery.self-bd7ddd393353a8d2480a622e80342adf488fb6006d667e8b42e4c0073393abee.js?
body=1:10255 GET http://localhost:3000/groups/1/prices/api/prices?keyword= 404 (Not Found)
body=1:18 失敗です
と検証のコンソール上に表記される。

該当のソースコード

assets/javascripts/module/prices.js

$(function(){
  $(function() {
    $(".search__field").on("keyup", function() {
      let input = $(".search__field").val();
      $.ajax({
        type: "GET",
        url: "api/prices",
        data: { keyword: input },
        dataType: "json"
      })
      .done(function(prices) {
        console.log("成功です");
      })
      .fail(function() {
        console.log("失敗です");
      });
    });
  });
});

app/views/prices/new.html.haml

.price
  = form_with model: [@group, @price], local: true do |f|
    .price__form
      = f.label :品名
      = f.text_field :name
      = f.label :値段（税込み、半角英数字）
      = f.text_field :number
      円
    = f.submit "登録"
.sarch
  %input.search__field{placeholder: "検索したい品物", type: "text"}
    #search__result

コントローラー（controllers/api/prices_controller.rb）

class Api::PricesController < ApplicationController
  def index
    respond_to do |format|
      format.html
      format.json
  end
end

ルーティング

Rails.application.routes.draw do
  devise_for :users
  root "groups#index"
  resources :users, only: [:index, :edit, :update]
  resources :groups, only: [:new, :create, :edit, :update] do
    resources :prices, only: [:index, :new, :create]
    namespace :api do
      resources :prices, only: :index, defaults: { format: 'json' }
    end
    resources :messages, only: [:index, :create]
    namespace :api do
      resources :messages, only: :index, defaults: { format: 'json' }
    end
  end
end

試したこと

urlの表記の仕方をいろいろ試したんですが同じ結果でした。またajax前のイベント発火の際はうまく読み取れていました。

rails routesの結果
group_api_prices GET /groups/:group_id/api/prices(.:format) 　　　　　api/prices#index {:format=>"json"}

補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。

Answer 1

url: "api/prices"　としたのに
http://localhost:3000/api/prices　とならず
http://localhost:3000/groups/1/prices/api/prices
となったとすると、
http://localhost:3000/prices/new.html　で無く、http://localhost:3000/groups/1/prices　でやってません？

url: "/api/prices"　としてみてください

Comments

[suguru060305]

コメントありがとうございます！！
実際に試してみたのですが、同じエラーが出てしまいました...。

検索欄があるurlは
http://localhost:3000/groups/1/prices/newでグループごとのidを持たせています。
ここに検索結果を表示したいのですが、idを持っているのがうまくいかない要因でしょうか？？

またpriceに関わるrails routesは、以下のようになっています。
```
group_prices GET /groups/:group_id/prices(.:format) 　　　prices#index
POST /groups/:group_id/prices(.:format) 　　　prices#create
new_group_price GET /groups/:group_id/prices/new(.:format) 　　　prices#new
group_api_prices GET /groups/:group_id/api/prices(.:format) 　　　api/prices#index {:format=>"json"}
```
また必要な情報があれば返信しますので、
もしご検討頂けるのであればお力をもう少し貸して頂きたいです。

[winterboum]

同じとは　GET http://localhost:3000/groups/1/prices/api/prices?　で失敗と出ていますか？
JSを書き直した後、画面をreloadしていますか？

[suguru060305]

失礼しました。
今はgroups/1/pricesのパスだけなくなり、以下のように表示されます。
jquery.self-bd7ddd393353a8d2480a622e80342adf488fb6006d667e8b42e4c0073393abee.js?body=1:10255 GET http://localhost:3000/api/prices?keyword=o 404 (Not Found)

[winterboum]

ああ。routes見てください。
url: "/groups/api/prices"
ですね。

[suguru060305]

変更したのですが以下のように表示されました。
もう全体の設計自体に問題があるんですかね...。
jquery.self-bd7ddd393353a8d2480a622e80342adf488fb6006d667e8b42e4c0073393abee.js?body=1:10255 GET http://localhost:3000/groups/api/prices?keyword=%E3%81%8A 404 (Not Found)

[suguru060305]

ご協力いただいたおかげで全体を見直したところ、複数の箇所で記述ミスがあり、修正したところ無事成功に変わりました。
ご協力いただいたおかげで、エラー解決に繋がりました。
本当にありがとうございます！！