質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JSON

JSON(JavaScript Object Notation)は軽量なデータ記述言語の1つである。構文はJavaScriptをベースとしていますが、JavaScriptに限定されたものではなく、様々なソフトウェアやプログラミング言語間におけるデータの受け渡しが行えるように設計されています。

Ruby on Rails

Ruby on Railsは、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Q&A

1回答

1080閲覧

《datepicker》予約できない日が設定できない

YousukeTanaka

総合スコア79

JSON

JSON(JavaScript Object Notation)は軽量なデータ記述言語の1つである。構文はJavaScriptをベースとしていますが、JavaScriptに限定されたものではなく、様々なソフトウェアやプログラミング言語間におけるデータの受け渡しが行えるように設計されています。

Ruby on Rails

Ruby on Railsは、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

0グッド

0クリップ

投稿2017/11/05 14:56

編集2022/01/12 10:55

railsで予約日が設定できるようにカレンダーを表示するpluginのdatepickerを導入しています。しかし、予約ができない日を設定して、それをカレンダーに反映させたいのですが、できずにおりますのでご相談したい次第です。よろしくお願いいたします。

環境

rails 5.0.2 ruby 2.3.0

やりたいこと

①1日だけ日付を選択できるようにしたい。 ②他に予約がある場合は、その日程は予約できないようにしたい。 ③カレンダーに、予約できない日を反映したい。 現状は、カレンダーは表示されるのですが、予約できない日がカレンダーに反映できないでおります。これを解決したいと考えております。

@@@.html.erb

ここをクリックしたら、カレンダーが表示される。 <div class='input-group date'> <%= f.text_field :start_date, class: 'form-control', id:"datetimepicker1", placeholder: "年/月/日" %> <span class="input-group-addon"> <span class="glyphicon glyphicon-calendar"> </span> </span> </div>

ruby/controller.rb

def setdate listing = Listing.find(params[:listing_id]) today = Date.today reservations = listing.reservations.where("start_date = ?", today) render json: reservations end

js

<script> $(function(){ // // ①データの参照 datepickerがクリックされた時点で、非同期通信を行い、reservationの予約情報が表示されるようにする。 var disabledDates = []; $.ajax({ url: "/setdate", data: {"listing_id": <%= @listing.id %>}, dataType: "json", success: function(data){ $.each(data, function(objID,objValue){ var d = new Date(objValue.start_date); disabledDates.push($.datepicker.formatDate('yy/m/d',d)); }); } }); // ②予約できない日の確認関数を作成 function disable(date){ var y = date.getFullYear(); var m = date.getMonth(); var d = date.getDate(); var ymd = y + "/" + m + "/" + d; if ($.inArray(ymd,disabledDates) == -1){ return [false]; } } // ③datepickerで表示する。 $("#datetimepicker1").datepicker({ dateFormat: "yy/mm/dd", maxDate: "+2m", minDate: 0, beforeshowday: disable }); //.datepicker }); </script>

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

こちらは試されましたか?

jQuery UI Datepicker(カレンダー)指定日の選択を無効
http://www.northwind.mydns.jp/samples/datepicker_sample7.php

念の為サーバー側でもチェックした方が良いですね。

投稿2017/11/07 01:33

yuki84web

総合スコア1857

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

YousukeTanaka

2017/11/07 11:50

コメントありがとうございます。いくつもサイトは参考にさせてもらっていましたが、このサイトは初めてでした。結果、予約できない日の表示はできました。ただ、条件付きです。いただいたサイトのように予め具体的な日程を変数に入れておけば、問題ありません。ただ、今回は、ajaxでmodelから既に予約されている日程を取りに行きます。この値の取得ができていないということがわかりました。ただ、これに気づいただけでも収穫でした。ありがとうございました。
YousukeTanaka

2017/11/07 11:52

もしお時間があれば、コードを見ていただけませんか?問題点が特定されてきたことは良かったのですが、以下のコードのどこが原因なのかがわからないでいます。 js //①予約できない日を配列で確保 var holidays = []; $.ajax({ type: 'GET', url: '/setdate', // this data is data for sending to url data: {'listing_id': <%= @listing.id %>}, dataType: 'json', success: function(data){ $.each(data,function(index,val){  var d = new Date(val.start_date);  holidays.push($.datepicker.formatDate("yy-mm-dd",d)); }); } }); controller.rb def setdate listing = Listing.find(params[:listing_id]) today = Date.today reservations = listing.reservations.where("start_date >= ?",today) respond_to do |format| format.json { render json: reservations } # jsonを指定した場合、jsonフォーマットで返す end end
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問