C# と VB.NET の質問掲示板

わんくま同盟

ASP.NET、C++/CLI、Java 何でもどうぞ

C# と VB.NET の入門サイト

ツリー一括表示

日付の計算 /はたさん (19/09/10(Tue) 16:43) #92323
Re[1]: 日付の計算 /WebSurfer (19/09/10(Tue) 18:13) #92326
│└ Re[2]: 日付の計算 /はたさん (19/09/11(Wed) 08:40) #92333
Re[1]: 日付の計算 /魔界の仮面弁士 (19/09/11(Wed) 02:32) #92332
  └ Re[2]: 日付の計算 /はたさん (19/09/11(Wed) 08:40) #92334 解決済み
    └ Re[3]: 日付の計算 /WebSurfer (19/09/11(Wed) 10:39) #92336
      ├ Re[4]: 日付の計算 /はたさん (19/09/11(Wed) 11:46) #92339
      │├ Re[5]: 日付の計算 /魔界の仮面弁士 (19/09/11(Wed) 12:36) #92341
      ││└ Re[6]: 日付の計算 /はたさん (19/09/11(Wed) 13:27) #92344
      │└ Re[5]: 日付の計算 /WebSurfer (19/09/11(Wed) 12:21) #92340
      │  └ Re[6]: 日付の計算 /はたさん (19/09/11(Wed) 13:22) #92343
      │    └ Re[7]: 日付の計算 /WebSurfer (19/09/11(Wed) 14:27) #92346
      │      └ Re[8]: 日付の計算 /はたさん (19/09/11(Wed) 15:59) #92350
      │        └ Re[9]: 日付の計算 /大谷刑部 (19/09/12(Thu) 09:48) #92353 解決済み
      │          └ Re[10]: 日付の計算 /はたさん (19/09/12(Thu) 16:09) #92359 解決済み
      └ Re[4]: 日付の計算 /HB (19/09/11(Wed) 15:15) #92348
        └ Re[5]: 日付の計算 /魔界の仮面弁士 (19/09/11(Wed) 15:51) #92349
          └ Re[6]: 日付の計算 /はたさん (19/09/11(Wed) 16:02) #92351
            └ Re[7]: 日付の計算 /魔界の仮面弁士 (19/09/11(Wed) 16:45) #92352


親記事 / ▼[ 92326 ] ▼[ 92332 ]
■92323 / 親階層)  日付の計算
□投稿者/ はたさん (1回)-(2019/09/10(Tue) 16:43:06)

分類:[JavaScript] 


Javascriptを最近始めたばかりの初心者です。
宜しくお願い致します。

データ例)
---------------------------------
@テキストボックス1→2 ドロップダウン→〜ヶ年または〜ヶ月
----------------------------------
Aテキストボックス2 →2019/09
----------------------------------
↓入力後

Bラベル1→2021/09(ヶ年の場合)

@とAを全て入力するとBに自動で年度または月が計算され表示されるようにしたいです。

私の検索の仕方が悪いとは思うのですが、調べてもなかなか実装したい例題が見つかりませんでした。
以上、宜しくお願い致します。

抜けがございましたらご指摘お願い致します。


[ □ Tree ] 返信 編集キー/

▲[ 92323 ] / ▼[ 92333 ]
■92326 / 1階層)  Re[1]: 日付の計算
□投稿者/ WebSurfer (1906回)-(2019/09/10(Tue) 18:13:57)
No92323 (はたさん さん) に返信

> データ例)
> ---------------------------------
> @テキストボックス1→2 ドロップダウン→〜ヶ年または〜ヶ月
> ----------------------------------
> Aテキストボックス2 →2019/09
> ----------------------------------
> ↓入力後
>
> Bラベル1→2021/09(ヶ年の場合)
>
> @とAを全て入力するとBに自動で年度または月が計算され表示されるようにしたいです。

意味が分かりません。

質問者さんが作った html +javascript のコードをアップして、どこでつまづいているか、
何が分かれば解決するかを詳しく書いてください。

ところで「テキストボックス」「ラベル」ってなんですか? ASP.NET Web Forms の TextBox,
Label コントロールのこと? とすると ASP.NET も関係する話ですか。そうであればそのあた
りも詳しく書いてください。

[ 親 92323 / □ Tree ] 返信 編集キー/

▲[ 92326 ] / 返信無し
■92333 / 2階層)  Re[2]: 日付の計算
□投稿者/ はたさん (2回)-(2019/09/11(Wed) 08:40:04)
No92326 (WebSurfer さん) に返信
> ■No92323 (はたさん さん) に返信
>

ご回答ありがとうございます。

> 質問者さんが作った html +javascript のコードをアップして、どこでつまづいているか、
> 何が分かれば解決するかを詳しく書いてください。
>
コードでつまづいているというよりそもそもhtmlで作成が終わっていたので
どういう風にコードを書いていいのかというところから分かりませんでした。

> ところで「テキストボックス」「ラベル」ってなんですか? ASP.NET Web Forms の TextBox,
> Label コントロールのこと? とすると ASP.NET も関係する話ですか。そうであればそのあた
> りも詳しく書いてください。

ASP.NET Web Forms の TextBoxとLabelでした。
抜けが多くすみませんすみませんでした。

[ 親 92323 / □ Tree ] 返信 編集キー/

▲[ 92323 ] / ▼[ 92334 ]
■92332 / 1階層)  Re[1]: 日付の計算
□投稿者/ 魔界の仮面弁士 (2375回)-(2019/09/11(Wed) 02:32:50)
No92323 (はたさん さん) に返信
> @とAを全て入力するとBに自動で年度または月が計算され表示されるようにしたいです。

対象ブラウザーや JavaScript ライブラリの使用可否といった前提条件が
分からないので、適当に 3 パターンほど作ってみました。

HTML5 対応ブラウザーが必要です。
https://benshi.github.io/Pubs/bbs.wankuma.com/replySamples/92323/

[ 親 92323 / □ Tree ] 返信 編集キー/

▲[ 92332 ] / ▼[ 92336 ]
■92334 / 2階層)  Re[2]: 日付の計算
□投稿者/ はたさん (3回)-(2019/09/11(Wed) 08:40:59)
No92332 (魔界の仮面弁士 さん) に返信
> ■No92323 (はたさん さん) に返信
>>@とAを全て入力するとBに自動で年度または月が計算され表示されるようにしたいです。
>
> 対象ブラウザーや JavaScript ライブラリの使用可否といった前提条件が
> 分からないので、適当に 3 パターンほど作ってみました。
>
> HTML5 対応ブラウザーが必要です。
> https://benshi.github.io/Pubs/bbs.wankuma.com/replySamples/92323/
>

ご回答ありがとうございます。例2の方で実装することができました。
ありがとうございました。
解決済み
[ 親 92323 / □ Tree ] 返信 編集キー/

▲[ 92334 ] / ▼[ 92339 ] ▼[ 92348 ]
■92336 / 3階層)  Re[3]: 日付の計算
□投稿者/ WebSurfer (1907回)-(2019/09/11(Wed) 10:39:55)
No92332 (魔界の仮面弁士 さん) に返信

質問と直接関係ないことですみませんが・・・

質問者さんと直接コンタクトが取れるのでしょうか?

> 対象ブラウザーや JavaScript ライブラリの使用可否といった前提条件が
> 分からないので、適当に 3 パターンほど作ってみました。

質問者さんの最初の質問にあった、

> データ例)
> ---------------------------------
> @テキストボックス1→2 ドロップダウン→〜ヶ年または〜ヶ月
> ----------------------------------
> Aテキストボックス2 →2019/09
> ----------------------------------
> ↓入力後
>
> Bラベル1→2021/09(ヶ年の場合)
>
> @とAを全て入力するとBに自動で年度または月が計算され表示されるようにしたいです。

を、以下の html ソースに変換できるというのが自分には驚異的です。しかもブラウザ依存の
type="month"、type="number" を指定して。

<input type="month" id="ym" value="2019-09">
<span>の</span>
<input type="number" min="1" max="999" id="num" value="2">
<select id="drop">
<option value="FullYear" selected>年後</option>
<option value="Month">ヶ月後</option>
</select>
<span>⇒</span>
<label id="label">(エラー)</label>



No92334 (はたさん さん) に返信
上にも書きましたが、type="month"、type="number" はブラウザ依存です。特に type="month"
は以下の記事の「ブラウザーの対応の扱い」に書いてあるように問題ありです。そこは問題な
いのですか?

<input type="month">
https://developer.mozilla.org/ja/docs/Web/HTML/Element/Input/month

それから、ASP.NET Web Forms の話で、実際は TextBox, DropDownList, Labael コントロール
を使うのだと思いますが、それらを使った場合でも同様なことができるのですか?



[ 親 92323 / □ Tree ] 返信 編集キー/

▲[ 92336 ] / ▼[ 92341 ] ▼[ 92340 ]
■92339 / 4階層)  Re[4]: 日付の計算
□投稿者/ はたさん (4回)-(2019/09/11(Wed) 11:46:29)
No92336 (WebSurfer さん) に返信
> ■No92334 (はたさん さん) に返信

> 上にも書きましたが、type="month"、type="number" はブラウザ依存です。特に type="month"
> は以下の記事の「ブラウザーの対応の扱い」に書いてあるように問題ありです。そこは問題な
> いのですか?
> 
すみません、ちゃんと確認せずに回答してしまいました。
確認したところ例1の方でした。
ドロップダウンリストを使って値を取得することができなかったので、魔界の仮面弁士さんの回答
にあった通りリストボックスに変更したところ実装できました。

実際のコード
function fnChangeDate() {
    var num = parseInt(document.getElementById('テキスト1').value, 10);
    var ym = document.getElementById('テキスト2').value;
    var dt = new Date(ym + '-01');
    if (document.getElementById('リストボックス').selectedIndex == 0) {
        dt.setFullYear(dt.getFullYear() + num);
    } else {
        dt.setMonth(dt.getMonth() + num);
    }
    var y = dt.getFullYear();
    var m = dt.getMonth() + 1;
    var txt = y+'/'+(m < 10 ? '0' + m : m);

    document.getElementById('ラベル').innerText = txt;
}




[ 親 92323 / □ Tree ] 返信 編集キー/

▲[ 92339 ] / ▼[ 92344 ]
■92341 / 5階層)  Re[5]: 日付の計算
□投稿者/ 魔界の仮面弁士 (2376回)-(2019/09/11(Wed) 12:36:25)
No92323 (はたさん さん) に返信
> Aテキストボックス2 →2019/09

No92339 (はたさん さん) に返信
> var ym = document.getElementById('テキスト2').value;
> var dt = new Date(ym + '-01');

上記コードは、ym が "2019-09" 形式の文字列であることを前提としています。
他の形式の文字列(たとえば空文字とか、不正な年月など)が
返される可能性がある場合は、適宜対処してください。


type="month" をサポートしているブラウザ(Android Chrome とか、Edge/Canary とか)であれば、
'yyyy-MM' 形式の文字列が得られることが期待されますが、非サポートなブラウザの場合は、
別の文字列になることがあります。


場合によっては、"2019/09" と入力された文字列を自前で解析して、
「var dt = new Date(2019, 8, 1);」形式に置き換える必要があるかもしれません。

ただしタイムゾーンの扱いに注意。(今回は影響が無いかもしれませんが)

dt1 = new Date("2019-09-01"); // Sun Sep 01 2019 09:00:00 GMT+0900 (日本標準時)
dt2 = new Date(2019, 8, 1);  // Sun Sep 01 2019 00:00:00 GMT+0900 (日本標準時)
[ 親 92323 / □ Tree ] 返信 編集キー/

▲[ 92341 ] / 返信無し
■92344 / 6階層)  Re[6]: 日付の計算
□投稿者/ はたさん (6回)-(2019/09/11(Wed) 13:27:50)
No92341 (魔界の仮面弁士 さん) に返信
> ■No92323 (はたさん さん) に返信

> 上記コードは、ym が "2019-09" 形式の文字列であることを前提としています。
> 他の形式の文字列(たとえば空文字とか、不正な年月など)が
> 返される可能性がある場合は、適宜対処してください。
>
>
> type="month" をサポートしているブラウザ(Android Chrome とか、Edge/Canary とか)であれば、
> 'yyyy-MM' 形式の文字列が得られることが期待されますが、非サポートなブラウザの場合は、
> 別の文字列になることがあります。
>
>
> 場合によっては、"2019/09" と入力された文字列を自前で解析して、
> 「var dt = new Date(2019, 8, 1);」形式に置き換える必要があるかもしれません。
>
WebSurferさんに回答したhtmlで作成致しました。
最初の質問で、htmlコードが抜けていました...すみません。
今後の参考にさせて頂きます。

> ただしタイムゾーンの扱いに注意。(今回は影響が無いかもしれませんが)
>
> dt1 = new Date("2019-09-01"); // Sun Sep 01 2019 09:00:00 GMT+0900 (日本標準時)
> dt2 = new Date(2019, 8, 1);  // Sun Sep 01 2019 00:00:00 GMT+0900 (日本標準時)

ブレークポイントをおいてみたところSun Sep 01 2019 09:00:00 GMT+0900 (日本標準時)が確かに入っていました。ですが、特に影響はありませんでした。
今後のためにも自分で調べてみたいと思います。
[ 親 92323 / □ Tree ] 返信 編集キー/

▲[ 92339 ] / ▼[ 92343 ]
■92340 / 5階層)  Re[5]: 日付の計算
□投稿者/ WebSurfer (1909回)-(2019/09/11(Wed) 12:21:11)
No92339 (はたさん さん) に返信

>>上にも書きましたが、type="month"、type="number" はブラウザ依存です。特に type="month"
>>は以下の記事の「ブラウザーの対応の扱い」に書いてあるように問題ありです。そこは問題な
>>いのですか?
>>
> すみません、ちゃんと確認せずに回答してしまいました。
> 確認したところ例1の方でした。
> ドロップダウンリストを使って値を取得することができなかったので、魔界の仮面弁士さんの回答
> にあった通りリストボックスに変更したところ実装できました。

話が通じてないと思います。

type="month" がブラウザ依存というのは、紹介した記事にも書いてありますが以下のことを言
ってます。

"コントロールのユーザーインターフェイスは、一般にブラウザーによって異なります。現時点で
は対応が不安定であり、デスクトップ版の Chrome/Opera と Edge &#8212; および最新のバージョンの
モバイルブラウザー &#8212; のみに利用可能な実装があります。"

質問者さんの方で IE, Edge, Chrome, Firefox で試して、それぞれどうなるか確認して見てくだ
さい。

もう一つ、ASP.NET Web Forms のサーバーコントロールは使わないのですか? 使うのであれば
それらが ASP.NET によって html に変換された時の html コードに JavaScript を適用すること
を考える必要がありますが、そこは考えているのでしょうか?
[ 親 92323 / □ Tree ] 返信 編集キー/

▲[ 92340 ] / ▼[ 92346 ]
■92343 / 6階層)  Re[6]: 日付の計算
□投稿者/ はたさん (5回)-(2019/09/11(Wed) 13:22:18)
No92340 (WebSurfer さん) に返信
> ■No92339 (はたさん さん) に返信
>
> 話が通じてないと思います。

> もう一つ、ASP.NET Web Forms のサーバーコントロールは使わないのですか? 使うのであれば
> それらが ASP.NET によって html に変換された時の html コードに JavaScript を適用すること
> を考える必要がありますが、そこは考えているのでしょうか?

すみません、理解していませんでした。

「質問者さんが作った html +javascript のコードをアップして、どこでつまづいているか、
何が分かれば解決するかを詳しく書いてください。」

とご指摘いただいたときにHtmlまでは作成が終わっていると回答致しました。htmlはそのまま自分で
作成した、ASP.NET Web Forms のサーバーコントロールのテキストボックス、リストボックス、ラベルを使いました。

実際のhtml↓
<asp:TextBox ID="テキスト1" runat="server" ClientIDMode="Static"></asp:TextBox>
<asp:ListBox ID="リストボックス" runat="server" ClientIDMode="Static"Rows="1">
<asp:ListItem Value="Month">ヶ月</asp:ListItem>
<asp:ListItem Value="Year">年</asp:ListItem>
</asp:ListBox>
<asp:TextBox ID="テキスト2" runat="server" ClientIDMode="Static"></asp:TextBox>
<asp:Label ID="ラベル" runat="server" ClientIDMode="Static"></asp:Label>

また、htmlコードではなくjavascriptにコードを書いて実装いたしました。
[ 親 92323 / □ Tree ] 返信 編集キー/

▲[ 92343 ] / ▼[ 92350 ]
■92346 / 7階層)  Re[7]: 日付の計算
□投稿者/ WebSurfer (1911回)-(2019/09/11(Wed) 14:27:07)
No92343 (はたさん さん) に返信

そもそもの話が通じてないようです。

> 実際のhtml↓
> <asp:TextBox ID="テキスト1" runat="server" ClientIDMode="Static"></asp:TextBox>
> <asp:ListBox ID="リストボックス" runat="server" ClientIDMode="Static"Rows="1">
>     <asp:ListItem Value="Month">ヶ月</asp:ListItem>
>     <asp:ListItem Value="Year">年</asp:ListItem>
> </asp:ListBox>
> <asp:TextBox ID="テキスト2" runat="server" ClientIDMode="Static"></asp:TextBox>
>  <asp:Label ID="ラベル" runat="server" ClientIDMode="Static"></asp:Label>

それを最初の質問の一番最初に書いてほしかったのですよ。

JavaScript は html ソースに対して適用するものということは分かりますよね?

ということは、html シース(またはその基になる .aspx ファイルのソース)を提示した
上でないと、それに適用する JavaScript の話はできないということは分かりますか?

例えて言うと、.aspx ファイルのコードを提示しないで、.aspx.cs または .aspx.vb の 
C# または VB.NET のコードをどう書いたらいいのかという質問をしているのと同じと言
ったら分かってもらえますか?

もし次に質問される機会がありましたら、上記のことをよく考えて、最初の質問に十分な
情報を提供していただくようお願いします。

[ 親 92323 / □ Tree ] 返信 編集キー/

▲[ 92346 ] / ▼[ 92353 ]
■92350 / 8階層)  Re[8]: 日付の計算
□投稿者/ はたさん (7回)-(2019/09/11(Wed) 15:59:10)
No92346 (WebSurfer さん) に返信
> ■No92343 (はたさん さん) に返信

> 最初の質問に十分な情報を提供していただくようお願いします。

すみませんでした。
次回質問させて頂くときは気をつけたいと思います。
[ 親 92323 / □ Tree ] 返信 編集キー/

▲[ 92350 ] / ▼[ 92359 ]
■92353 / 9階層)  Re[9]: 日付の計算
□投稿者/ 大谷刑部 (13回)-(2019/09/12(Thu) 09:48:16)
No92350 (はたさん さん) に返信
> ■No92346 (WebSurfer さん) に返信
>>■No92343 (はたさん さん) に返信
>
>>最初の質問に十分な情報を提供していただくようお願いします。
>
> すみませんでした。
> 次回質問させて頂くときは気をつけたいと思います。

誰かさんの理解力が乏しいだけだから謝る必要ないと思うけど。

javaスクリプトでと言っているのだから、クライアントサイドで解決したいのは容易に想像つく。
なので、ASP.netかどうかを確認すること自体が無意味。

JSPだろうがASP.netだろうが、どうせjavaスクリプトでの解決策に大差はないはず。
それが証拠に弁さんの一回目の回答で、本人が解決済みにしてる。

ここはあくまで質問板であって、教育の場でも、お説教する場所でもない。
といってもウザい言動をしている本人に反省の色がないのだから、言っても無駄なんだけどね。

ということでこれ以上は不毛と思うので解決済でいいかと。
解決済み
[ 親 92323 / □ Tree ] 返信 編集キー/

▲[ 92353 ] / 返信無し
■92359 / 10階層)  Re[10]: 日付の計算
□投稿者/ はたさん (9回)-(2019/09/12(Thu) 16:09:50)

皆さんありがとうございました。
また、宜しくお願い致します。
解決済み
[ 親 92323 / □ Tree ] 返信 編集キー/

▲[ 92336 ] / ▼[ 92349 ]
■92348 / 4階層)  Re[4]: 日付の計算
□投稿者/ HB (1回)-(2019/09/11(Wed) 15:15:56)
> を、以下の html ソースに変換できるというのが自分には驚異的です。しかもブラウザ依存の
> type="month"、type="number" を指定して。

推測して、質問内容に合いそうな例を提示しているのさ。
質問者が何を聞きたいのか分かろうとしない人には無理な芸当だね。
これくらいでビックリしているようでは鈍すぎる。

あと、type="month"、type="number"については、
「HTML5 対応ブラウザーが必要」と但し書きがあるよね?
話が通じない理由がこういうところにもあるんだなw
[ 親 92323 / □ Tree ] 返信 編集キー/

▲[ 92348 ] / ▼[ 92351 ]
■92349 / 5階層)  Re[5]: 日付の計算
□投稿者/ 魔界の仮面弁士 (2377回)-(2019/09/11(Wed) 15:51:17)
#元質問の本題からは外れますが:

No92348 (HB さん) に返信
>>を、以下の html ソースに変換できるというのが自分には驚異的です。しかもブラウザ依存の
>>type="month"、type="number" を指定して。
> 推測して、質問内容に合いそうな例を提示しているのさ。

どう回答しても、質問内容に合うかどうかは、あの時点では分からないんですよね。

質問者のプラットフォームが HTA + JScript や JSP + JavaScript という可能性も
あったわけですが、とりあえず単純化したサンプルを出すのが手っ取り早いのかな、と。
まぁ、回答がすべて的外れに終わる可能性もあったわけですが。


質問時の分類が [JavaScript] ではなく、[ASP.NET] が選択されていたとしたら、
あの段階ではサンプルは書かず、WebSurfer さんのように状況確認で逆質問してたかも。

仮に ASP.NET だとしても、そもそも MVC なのか WebForm なのかも分かりませんし、
WebForm と仮定するにしても、HTML コントロールなのかサーバーコントロールなのかも不明瞭で、
PostBack の有無とか、AJAX Extensions の利用といった前提条件が絡んでくるので、
サンプルが書き難い…。


> あと、type="month"、type="number"については、
> 「HTML5 対応ブラウザーが必要」と但し書きがあるよね?

これを利用したのは、「処理を単純化」するためですね。

背景が不明瞭な段階では、本題から外れそうな入力検証機構については、
あまりコードに含めない方が分かりやすいだろうとの判断です。

JQuery UI や、ASP.NET 検証コントロールや ASP.NET MVC の ModelState 等を
使っているかもしれないし、仮に、追加のチェック機構が必要となるのなら、
後から追加説明すれば良いだろうと。
[ 親 92323 / □ Tree ] 返信 編集キー/

▲[ 92349 ] / ▼[ 92352 ]
■92351 / 6階層)  Re[6]: 日付の計算
□投稿者/ はたさん (8回)-(2019/09/11(Wed) 16:02:13)

解決はしたのですが、閉じてもよろしいでしょうか?
[ 親 92323 / □ Tree ] 返信 編集キー/

▲[ 92351 ] / 返信無し
■92352 / 7階層)  Re[7]: 日付の計算
□投稿者/ 魔界の仮面弁士 (2378回)-(2019/09/11(Wed) 16:45:14)
No92351 (はたさん さん) に返信
> 解決はしたのですが、閉じてもよろしいでしょうか?

どちらでも良いと思いますよ。

元々は既に[解決済み]をつけていたわけですし、
スレッドを閉じても閉じなくても、お好きなように。


そもそも [解決済み]を付けるかどうかや、どうやって解決したかを
投稿するか否かの判断は個人に任されており、管理人グループにおいても、
それをルール化したりはしていなかったはず。
(この辺のローカルルールは、どぼん!さんの所の掲示板とは異なっていますね)
http://bbs.wankuma.com/index.cgi?mode=one&namber=89538&KLOG=156


また、解決済みのスレッドを他者が再オープンする事を許容することについては、
過去にも何度か論点となってはいますが(例: No89528 から始まるスレッドなど)
ルール的には否定も肯定もされていなかったはず。


自分の場合は、解決済みのスレッドに補足情報を追記するような場合には、
原則として「チェックしたまま」で投稿するようにしていますが、元の解決策に
重篤な問題があるような場合は、意図的に再オープンすることもあります。
[ 親 92323 / □ Tree ] 返信 編集キー/


管理者用

- Child Tree -