お世話になっております。
前回、Springフレームワークなどを用いて勤怠情報をExcelフォーマットに書き込んでダウンロードを行う処理について質問をさせていただきました。
結果として、正しくダウンロード処理を行うことができたのですが
画面上に「ダウンロードを完了した」旨の表示がなされていないので実装したいと考えています。
ただ、どのタグを用いて実現すべきかWeb検索したり、書籍(HTML5&CSSデザインレシピ集)で調べても見つからず仕舞いなのでご教授いただきたいです。
下記にjspのソースを貼り付けます。
jsp
1 <div class="container-fluid"> 2 <h1>稼働一覧画面</h1> 3 <p> 4 <button type="button" class="btn btn-warning" 5 onclick="location.href='./EmployeeAndTraineeList'">一覧画面へ戻る</button> 6 </p> 7 <div 8 class="d-flex flex-wrap justify-content-around align-items-center"> 9 <form id="month" action="workList" method="GET"> 10 <div> 11 <input form="month" type="hidden" name="select" 12 value="${requestScope.userId}"> <input form="month" 13 type="month" name="month" value="${requestScope.month}"> 14 <button class="btn btn-info">表示</button> 15 </div> 16 </form> 17 <div> 18 <table id="workList" class="table table-bordered"> 19 <thead class="thead-job-color"> 20 <tr> 21 <th>総実働時間</th> 22 <th>総残業時間</th> 23 </tr> 24 </thead> 25 <tbody> 26 <tr> 27 <td class="right"><c:out 28 value="${requestScope.totalWorkingTime}" default="--:--:--"></c:out></td> 29 <td class="right"><c:out 30 value="${requestScope.totalOverTime}" default="--:--:--"></c:out></td> 31 </tr> 32 </tbody> 33 </table> 34 </div> 35 <form action="workList" method="GET"> 36 <div> 37 <input type="hidden" name="select" value="${requestScope.userId}"> 38 <input type="hidden" name="month" value="${requestScope.month}"> 39 <button class="btn btn-info" name="excelDownload" value="do"> Excelファイル出力</button> 40 </div> 41 </form> 42 </div> 43 </div> 44 45 <form id="listController" action="punchEdit" method="GET"> 46 <input type="hidden" name="select" value="${requestScope.userId}"> 47 <div class="container-fluid"> 48 <div class="row"> 49 50 <div class="col-12"> 51 <table id="workList" 52 class="table table-bordered table-hover vacation-hover"> 53 <thead class="thead-job-color"> 54 <tr> 55 <th class="right">月日</th> 56 <th class="center">曜<br>日 57 </th> 58 <th class="right">出勤時刻</th> 59 <th class="right">退勤時刻</th> 60 <th class="right">昼休憩</th> 61 </tr> 62 </thead> 63 <tbody> 64 65 <!-- 一部割愛--> 66 67 68 <div id="listController"> 69 <aside> 70 <div id="openButton">Menu</div> 71 <div class="container-fluid"> 72 <div class="d-flex flex-wrap justify-content-around"> 73 <div> 74 <button class="btn btn-info m-2">打刻編集</button> 75 </div> 76 </div> 77 </div> 78 </aside> 79 </div> 80 </form> 81</body> 82</html> 83
もし実現できるのであれば
「ダウンロードを完了しました」だけでなく、ダウンロード進捗状況みたいなものも
実装してみると面白いかな~と思ったりしています。(progress要素みたいな感じ)
何卒よろしくお願い申し上げます。
回答1件
あなたの回答
tips
プレビュー