chat-spaceの応用実装


はじめに

この記事は、某プログラミングスクールに登場する、通称chat-spaceの応用実装についてまとめたものです。スクールを卒業した際に、応用実装があったことを思い出したので記事にしてみました。

早速ですが、応用実装とはどんなものかというと、グループに追加したユーザーを検索してもでないようにするというものです。

この機能の動作の流れといたしましては。

① キーワード(input)を入力する。

② イベントが発生した際に、チャットメンバーに表示されているユーザーのidを配列(ids)で取得

③ あとは、Ajax通信の際にinputとidsを渡し、idsを含まないユーザを検索するだけです。

以上のことをソースコードで記述すると、次の通りになります(変更した部分だけ表示)。

 let input = $("#user-search-field").val();
    let ids = [];
    $.each( $(".chat-group-user").find("input"), function(key,value){
      ids.push(  $(value).attr("value") );
    })
    $.ajax({
      type: "GET",
      url: "/users",
      data: { keyword: input,ids: ids },
      dataType: "json"
    })
 def index
    @users = User.search(params[:keyword], params[:ids])
    respond_to do |format|
      format.html
      format.json
    end
end
  def self.search(input, ids)
    return nil if input == ""
    User.where(['name LIKE ?', "%#{input}%"] ).where.not(id: ids).limit(10)
  end