初心者です。
java(フレームワーク:struts2)とjavascriptを用いて、情報管理システムを作っています。
次のような特徴を持つ表に、下記のような機能を実装したいのですがうまくいきません。
表の特徴
1.表の列数は5列、行数はn(ユーザーが決めることができる)表です
2.表のそれぞれのセルはテキストボックスとなっており、数字(文字も可能)を入力することができ、submitボタンを押下するとサーバー側にデータを送信できます。
3.各セルごとにユーザーIDが4文字、枝番が1文字入るテキストボックスを持っています←要点です
イメージ図
// | 列1 | 列2 | 列3 | 列4 | 列5 |
行1|ID1| 枝番1 | ID2 | 枝番2 | ID3 |枝番3 | ID4 | 枝番4 | ID5 | 枝番5 |
行2|ID6| 枝番6 | ID7 | 枝番7 | ID8 |枝番8 | ID9 | 枝番9 | ID10 | 枝番10 |
実装したい機能
submitボタンを押下時に次の機能を実装したいです
1、入力内容に未入力があれば、そのセルのバックグラウンドカラーを赤に変更
2、入力内容にID及び枝番の両方が重複していた場合、そのセルのバックグラウンドカラーを赤に変更
3、DBに保存されているデータと入力内容に重複があれば、そのセルのバックグラウンドカラーを赤に変更
4、上記の処理のどれが一つでも行われた場合、上記の変更を施した後、処理を中止します
(例)
,,,, | 列1 | 列2 | 列3 | 列4 | 列5 |
行1 |1111| 1 | 2222 | 2 | | | 4444 | 4 | 5555 | 5 |
行2 |2222| 2 | 7777 | 7 | 8888 | 8 | 9999 | 9 | 1010 | 1 |
DB内
UserID BranchID
9999 9
この場合、行1列2と行2列2が重複、行1列3が未入力 行2列4がDBのデータと被ってるため、ボタン押下時にセルの背景色を赤色に変更し、本来行われる処理を中止します
アドバイスもしくは解決していただきたい内容
・それぞれの要素内容を取得する方法
・ユーザーIDと枝番両方を用いた重複チェックの仕方(一つのテキストボックスごとの重複チェックは可能のようですが、二つのテキストボックスを用いた重複チェックの仕方がわかりません)
jsp html
<table id="tbl"> <thead class="tablehead"> <tr> <th class="tablehead"></th> <th colspan="2" class="tablehead">A</th> <th colspan="2" class="tablehead">B</th> <th colspan="2" class="tablehead">C</th> <th colspan="2" class="tablehead">D</th> <th colspan="2" class="tablehead">E</th> </tr> </thead> <tbody> <% List<RegistBean> list = ((List<RegistBean>)con.getValueStack().findValue("list")); int tnum = bean == null ? 0 : bean.getNumberOfSheet(); int a = tnum/5; int b = tnum%5; %> <% for(int i=1; i<=a; i++){ %> <tr> <th class="padding10"><%=i%></th> <%for(int j=1; j<=5; j++){ %> <td class="padding0"><label><input type="text" name="userlist" placeholder="cell<%=5*i-5+j%>" value="<%=list.get(5*i-5+j-1).getTicketNo()%>" class="cellnum"></label></td> <td class="padding0"><label><input type="text" name="branchlist" placeholder="br<%=5*i-5+j%>" value="<%=list.get(5*i-5+j-1).getBranchNo()%>" class="brnum"></label></td> <input type="hidden" name="seqlist" value="<%=list.get(5*i-5+j-1).getSeq()%>"> <%}%> </tr> <% } %> <tr> <% if(b != 0){ %> <th class="padding10"><%=a+1%></th> <% } %> <% for(int k=1; k<=b; k++){ %> <td class="padding0"><label><input type="text" name="userlist" placeholder="cell<%=5*a+k%>" value="<%=list.get(5*a+k-1).getTicketNo()%>" class="cellnum"/></label></td> <td class="padding0"><label><input type="text" name="branchlist" placeholder="br<%=5*a+k%>" value="<%=list.get(5*a+k-1).getBranchNo()%>" class="brnum"/></label></td> <input type="hidden" name="seqlist" value="<%=list.get(5*a+k-1).getSeq()%>"> <%} for(int l=1; l<=5-b;l++){ %> <td class="padding0 darkgray"></td> <td class="padding0 darkgray"></td> <%}%> </tr> </tbody> </table>
試したこと
・一つのセルに二つのテキストボックスがあるため、次のような列と行で指定する方法で要素を取得できませんでした
// td内のtrをループ。rowsコレクションで,行位置取得。 for (var i=0, rowLen=tblTbody.rows.length; i<rowLen; i++) { // tr内のtdをループ。cellsコレクションで行内セル位置取得。 for (var j=0, colLen=tblTbody.rows[i].cells.length ; j<colLen; j++) { //i行目のj列目のセルを取得 var cells = tblTbody.rows[i].cells[j];
・一つのテキストボックスを持つセルの重複チェックの方法は調べてみていくつかありましたが、枝番を持つセルの重複チェック方法は見つかりませんでした。
以上から
・それぞれの要素内容を取得する方法
・ユーザーIDと枝番両方を用いた重複チェックの仕方
の方法をご教授お願いいたします。
java8
tomcat8
struts2
回答1件
あなたの回答
tips
プレビュー