ASP.NET側のコントロールのプロパティに、JSで取得する値を採用する方法を知りたい

Question

皆様から今更　というツッこみが入りかねない問合せ、何卒ご容赦ください。

こちらの記事を参考に、Webフォームに仕込むJSから、画面サイズ（縦）を取得して、これをReportViewerというASP.NETのコントロール（heightプロパティ）に適用する対応を考えています。

（JSとの連携をキーワードにネット上へ検索すると、自分が対応しようとしているレベル、かつ自分が理解できるレベルを見つけられなかったので問合せ致しております）

【解決方法・考え方を確認したい】
1. aspxのコントロールに値を採用する = サーバ側で参照可能な値にあるべき認識ですが それは正しいですか？ まだクライアントの画面に表示されていないWebフォーム上のコントロールが対象です。

2. 上記が正しい場合、手段として私が思いつくのは　Cookieの利用か、type=hiddenのinput要素でサーバ側で参照する方法（クライアント側で書込む）方法です。妥当な判断でしょうか？別の方策はあるでしょうか？

3. 上記が正しい場合、遷移元Webフォーム（同一サイト内）のRegisterStartupScriptからのJSで値を取得、遷移先Webフォームへ引き継がせるのかな、と思いました。
遷移先WebフォームのPage_Loadの過程でRegisterClientScriptBlockで仕込むJSでは、たとえ画面サイズの値を取得できても、同Page_Loadの中で　その値をコントロールに採用するできないのでは（Page_Loadの合間合間にクライアントとやりとりする過程などない認識。ページのライフサイクルを習得せよとお叱りを受けそうですが...）と思った為です。

4. 参考になる記事があれば　ご紹介頂ければ本当に幸いです...。

Register～に関し当方は　送信ボタンクリックイベント内でRegisterStartupScriptから　サーバ検知のエラーメッセージを画面に返す程度のことしか対応したことがありません。解決に向けたアドバイス　お待ちしております。

Answer 1

> 1. aspxのコントロールに値を採用する = サーバ側で参照可能な値にあるべき認識ですが それは正しいですか？

やりたいことは ReportViewer.Height プロパティを JavaScript で設定したいということと理解していますが、それは不可能です。

JavaScript で可能なのは ReportViewer が html に変換されてブラウザに送信された後、html に設定されている css を書き換えることぐらいです。でも、それをトライしても期待する結果（ブラウザの表示高に合わせて ReportViewer の高さを変えることと理解）が得られることはないでしょう。

という訳で、質問の 2, 3 は考えるまでもない無駄な努力で、4 の答えもありません。

Answer 2

即答ありがとうごさいます。 HTMLに変換されていることは認識していたのですが・・・(ブラウザのソースの表示で認識していた) コントロールのプロパティをJSで設定することができないこと、再認識しました。 考えてみればそうかも知れないと、今理解に努めています。(どうりで参考になる記事が見当たらないわけだ)

Answer 3

Hoshinaです
こんにちは。

ユーザが使用しているブラウザの画面サイズを知りたいということでしたら、
以下のようなやり方で対処したことがあります。

・WEBサーバに、画面サイズを通知する専用の WEB サービスを作成しておく
・ブラウザに返すトップページの HTML に以下のような Ajax (Javascript でも可）を仕込んでおく
　画面サイズを調べて、前記の WEB サービスにその値を通知する
・通知された WEB サービスはその値をセッションに保存しておく
・ReportViewer が必要なページを WEBサーバが要求された場合に、前記のセッションから読み出して利用する

たぶん、このような手順で可能と予想しますが、
例え可能だとしても、不親切な私は SuferOnWww さん同等の対応は取りかねると思います。
何かのヒントになれば幸いです。

それでは

Answer 4

質問者さんが JavaScript を使っていろいろやっている理由は、ブラウザの表示サイズはユーザーが自由に変更できるので、今まさに ReportViewer が表示されようとしている画面の高さを取得して、それに合わせて ReportViewer の高さを調整したいということであろうと想像しています。

違いますか？　その想像は間違いで、ユーザーはブラウザの表示サイズを変更しないという条件で良いなら、一番最初の初期画面で JavaScript で表示サイズを取得してそれを隠しフィールドに保存しておいて、初期画面がポストバックうされた際に、Hoshina さんの案にもあるように Session に保存してそれを使えば良い話です。

想像が合っているとすると、ReportViewer の画面の応答が返されたときにしか正しくブラウザの表示サイズは取得できないので、ReportViewer.Height を設定するというサーバー側でしかできないことは逆立ちしてもできません。

可能なのは ReportViewer が html に変換されてブラウザに送信された後、html に設定されている css を JavaScript で書き換えることぐらいです。

div 要素とか、サーバーコントロールでも Image など簡単なものならそれで可能でしょうが、ReportViewer の場合は簡単ではありません。と言うより、不可能ではないにせよ無理だと思います。

なぜなら、何が ReportViewer の高さを決めているか html, css ソースから探すのが難しい、それを書き換える JavaScript コードを書くのが難しい、そこまでできてもページングなどで元に戻ってしまうことへの対応が難しいから。

それでもやってみたいということならどうぞ。ただし、その先は自分はお付き合いできないのでこのスレッドからは撤退します。

それ以外の策としては、

(1) 質問者さんが参考にしていた以下の記事の「ReportViewer コントロールで 100% の高さを設定する方法」のセクションに書いてあるようにする。

ReportViewer コントロールを使用した Reporting Services の統合 - 概要
https://docs.microsoft.com/ja-jp/sql/reporting-services/application-integration/integrating-reporting-services-using-reportviewer-controls-get-started?view=sql-server-2017

(2) ReportViewer はあるページから遷移して表示するそうですが、遷移元で遷移する直前にブラウザの表示サイズを取得してその情報を遷移先に渡す。

・・・ぐらいでしょうか。

Answer 5

SuferOnWwwさん、Hoshinaさん　ご協力ありがとうございます。理解力乏しくお二方のやりとりについていけるか少々不安ですが、当方の希望は　SuferOnWwwさんが記載された

>一番最初の初期画面で JavaScript で表示サイズを取得してそれを隠しフィールドに保存しておいて、初期画面がポストバックされた際に、Hoshina さんの案にもあるように Session に保存してそれを使えば良い話です。

で十分と思いました。正しく理解できているか多少不安ですが。利用者がブラウザのサイズを替える云々は気にしません...。欲をいうと"一番最初"という部分を、遷移元としたい。

本件問い合わせの発端はこの記事 内の「 ReportViewer コントロールで 100% の高さを設定する方法 」に由来しての対応です。ASP.NET4.0で動作させていたVer11.0のReportVeiwer付きWebフォームをASP.NET4.6へ移行してきた結果、実行結果が真っ白になってしまいました。調べたところ　height=""がになっていることが問題と解釈し、対応着手を決断しました。

「どうせなら、固定値を埋め込むのではなく、ユーザの画面サイズに合わせたいな」と思ったのです。ブラウザの画面サイズを自由に変更されてしまいますが、それに応じて...というレベルまでは期待していません。

最初に「今更？」と記載した理由は、JSで取得する値を、Sessionに転記する手立てさえ分からないためでした。もし、できるとなると...、あらかじめWebフォームに、ツールボックスはHTML分類からhiddenのINPUT要素を貼り付け、そちらになんとかしてJSの値を転記して送り込む、ということでしょうか.....ClientIDとかで当該INPUT要素をVB内でつかんで、JS内の取得結果をどうにか転記する、ということと想像しますが　当方alert以外は　JSで取得した結果を出力したことがないもので

引き続き達成可能であれば　アドバイスをよろしくお願いします。

Answer 6

Hoshina です
こんにちは。

>一番最初の初期画面で JavaScript で表示サイズを取得してそれを隠しフィールドに保存しておいて、初期画面がポストバックされた際に、Hoshina さんの案にもあるように Session に保存してそれを使えば良い話です。

これでよければ、難しい話ではないように思います。

・私が書いたように、非同期で情報を直ちに WEB サーバに通知するか（こっちの方がやや面倒）
・SuferOnWwwさんが書かれたように、次のポストバックまで待って、WEB サーバに通知する

のどちらかを実装してはどうですか？
ヒントは、「Session」です。

SuferOnWwwさんへ。
そもそもできないことは、私の頭ではフィルターがかかっており、そのフィルターは質問者さんと共有できていると思い込んでいました。
SuferOnWwwさんの危惧されていることが現実の要望になったとすると、「撤退」に同意いたします。

Answer 7

結局どうしたいのか書いてください。遷移するときのみ、すなわち私のレスの (2) の案でいいのですか？

Answer 8

お疲れ様でございます。伝え方が悪く申し訳ありません。

SuferOnWwwさんが仰られる(2)を達成したいです。

引き続きご見解をよろしくお願いします。　

Answer 9

> SuferOnWwwさんが仰られる(2)を達成したいです。

以下のようにしてできるはずです。

(1) 遷移元のページに HiddenField を追加。

(2) ブラウザの表示高を取得して HiddenField に設定する JavaScript メソッドを遷移元のページに定義。

(3) 遷移するトリガとなるコントロール（Button か LinkButton と理解）の OnClientClick プロパティに (2) の JavaScript メソッドを設定。

(4) トリガとなるコントロールをクリックしたときにポストバックされ、そのイベントハンドラで Resposse.Redirect によって ReportViewer のページに遷移するようにし、その時クエリ文字列で HiddenField に設定された文字列を渡す。

(5) ReportViewer のページでは、Page_Load でクエリ文字列を取得し、ReportViewer.Height プロパティに設定する。

以上を自力で実装してみてください。その上で問題があれば、どこまで実装できていて、どこでつまづいていて、何が分かれば解決するかを書いて質問してください。

ただし、このスレッドの表題と最初の質問はすでに回答済で、できなという結論も出ていますのでクローズして、上の話に質問があれば新たに別スレッドを立てて質問するようお願いします。

Answer 10

SuferOnWwwさん、ご見解をありがとうございます。
達成したい手続きは　今しがた伝えられた手順そのものです。当方の質問の仕方が悪いばかりに　手をやかせてしまったようで申し訳ないです。

チャレンジしてみます。やはりhiddenのINPUT要素で送るという考え方は間違っていなかったのかぁ...

Answer 11

問題・課題を解決する順番としては、

> 実行結果が真っ白になってしまいました。

という問題を解決する方が優先順位が高そうな気がします。

Answer 12

SuferOnWwwさん アドバイスありがとうございます。 ReportViewer のheight に固定値を設定して実行すると、表は画面に現れてくるので、当面の課題を今話題のテーマにしました。ハズしてたらたしかに元も子もないんですが

Answer 13

v15 も、それ以前のバージョンもデフォルトで 400px です。質問者さんが設定を変えたりしなければ、"" になるようなことはありません。何か変ですよ。そこを確認する方が先だと思いますが。

Answer 14

ご心配ありがとうございます。
伝え方悪く混乱を与えましてすみません、従来までheight=""と記載していたReportViewerが自動的に100%が達成されていたものが達成されなくなった～
という事案です。「消せば　Defaultは400px」が　適用されるはず、了解致しました。一応試します。

Answer 15

> 従来までheight=""と記載していたReportViewerが自動的に100%が達成されていたものが達成されなくなった～

何故 Microsoft の記事に書いてあることを無視して質問者さんの独自判断で height="" にしているのですか？　フォーラムでのアドバイスも聞いてないとか、そういうことが多すぎです。だから迷走するのだと思いますよ。

記事の「ReportViewer コントロールで 100% の高さを設定する方法」のセクションに書いてある通りにすれば、自動的に 100% になりますし、表示後ユーザーがブラウザの表示サイズを変えても自動的に ReportViewer の高さもそれに追随してブラウザの表示範囲に収まるようになります。

ここに書いてあるようなことに悩む必要はなかったのでは？

Answer 16

SuferOnWwwさん

一先ず　heightプロパティの記述を除去したら　想像どおり、表が現れました。

早速ですが、ご指摘には返す言葉がありません。「迷走」がキーワードな私、遠回りが多いのです。自分だけ困っているならまだしも、周囲に助けを求めるので、周囲が迷惑していまいますよね。本当に申し訳ございません。

記事の

>ビューア― コントロールの高さが 100% に設定されている場合、親要素は定義済みの高さであるか、すべての祖先はパーセントによって定義される高さである必要があります。

を見て、MasterPageも利用しているので他Webフォームにも影響しかねない、当該Webフォームのデザインも編集する必要があるなら　小手先=ReportViewerの対応が無難かなぁ　と思ってしまった次第です。

落着いて工数を比較すれば、どちらが適作であったか判断できましたね。また私の好奇心というのが邪魔をしてしまうのです。

記事をもう一度確認し、適作を再検討します。