プログラム初心者です。
jsp+jQueryにてチェックボックス付きのテーブルから、チェックの付いた行のみの値を取得したいのですが値が取得できず困っています。
どなたかお力を貸していただけないでしょうか?
------------------------
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.3.min.js"></sc …
<script type="text/javascript">
function getTableRecords(){
var chkRow=$("input[name=Target]:checked").parents("tr");
if (chkRow.length == 0){
alert('選択してください');return;
}
var val1=[];
var val2=[];
var val3=[];
for(i=0;i<chkRow.length;i++){
var row=chkRow[i];
val1[i]=$(row).children("td:nth-child(2)").val();
val2[i]=$(row).children("td:nth-child(3)").val();
val3[i]=$(row).children("td:nth-child(4)").val();
alert(val1[i]+','+val2[i]+','+val3[i]);
}
}
</script>
</head>
<body>
<form name="form1">
<TABLE border="1" width="100%">
<tr><th>チェック</th><th>項目1</th><th>項目2</th><th>項目3</th></tr>
<% for(int i=1; i<=10; i++){ %>
<tr>
<td><input type="checkbox" name="Target" value="2"></td>
<td><input type="text" name="val1"></td>
<td><input type="text" name="val2"></td>
<td><input type="text" name="val3"></td>
</tr>
<% } %>
</TABLE>
<INPUT type="button" onclick="getTableRecords()">確認</button>
</form>
</body>
------------------------
・やりたいこと
チェックボックス付きのテーブルから、チェックの付いた行のみの値を取得したい
- テーブルは「チェックボックス、項目1、項目2、項目3」の4列10行
- 項目1~3はテキストボックス
・困っていること
確認ボタンを押したときにjsのgetTableRecords()を呼び出し、チェックが付いた行の項目1~3の内容を表示したいが、値が取得できない。
よろしくお願いいたします。
A 回答 (2件)
- 最新から表示
- 回答順に表示
No.2
- 回答日時:
ちなみにこんな感じ
<script>
$(function(){
$('#kakunin').click(function(e){
$("input[name=Target]:checked").each(function(){
var str="";
var l=[2,3,4];
while(i=l.shift()){
if(str!=='') str+=",";
str+=$(this).parents('tr').children('td:nth-child('+i+')').children('input').val();
};
console.log(str);
});
e.preventDefault();//submitを止める
});
});
</script>
</head>
<body>
<form name="form1">
<TABLE border="1" width="100%">
<tr><th>チェック</th><th>項目1</th><th>項目2</th><th>項目3</th></tr>
<tr>
<td><input type="checkbox" name="Target"></td>
<td><input type="text" name="val1" value="100"></td>
<td><input type="text" name="val2" value="110"></td>
<td><input type="text" name="val3" value="120"></td>
</tr>
<tr>
<td><input type="checkbox" name="Target"></td>
<td><input type="text" name="val1" value="200"></td>
<td><input type="text" name="val2" value="210"></td>
<td><input type="text" name="val3" value="220"></td>
</tr>
<tr>
<td><input type="checkbox" name="Target"></td>
<td><input type="text" name="val1" value="300"></td>
<td><input type="text" name="val2" value="310"></td>
<td><input type="text" name="val3" value="320"></td>
</tr>
</TABLE>
<button id="kakunin">確認</button>
</form>
No.1
- 回答日時:
とりあえずtdのvalueではないのでinputから取得してください
$(row).children("td:nth-child(2)").val();
↓↓↓
$(row).children("td:nth-child(2)").find("input").val();
それと確認ボタンがへん
チェックボックスのvalueはスタティックに2でOK?
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- AJAX JavascriptからPHPへのAjax通信でnullが返ってくる 3 2022/08/03 22:00
- JavaScript javascript作成してます。ラジオボタンで判定するコードを書いてます。 1 2023/07/18 11:03
- JavaScript EasyUIのSubGrid(jquery)におけるObjectに入れた連想配列について 1 2022/05/02 11:21
- JavaScript javascriptでテーブルに追加した項目のid追加してローカルストレージを操作したい 5 2023/01/01 15:52
- Visual Basic(VBA) Selenium.ChromeDriverの使い方について 7 2022/09/22 06:43
- JavaScript ①入力フォーム→②確認表示画面→③送信完了画面のコードを書いているのです、 入力フォームから受け取っ 2 2022/05/10 16:45
- JavaScript javascriptのちょっとした動作不良(原因は突き止めたのですが) 1 2023/06/15 19:58
- JavaScript Javascript初心者|jQueryの.val()で値を取得し複数の要素を連結させる方法知りたい 2 2022/06/02 12:06
- JavaScript 入力フォームの javascript で メールアドレスの正規チェックをを行い、ボタンをクリックして 2 2022/04/27 16:06
- JavaScript 追加ボタンを押した際に ok ボタンを押した場合のみ入力値が追記されるようにしたいです 6 2022/05/29 09:57
このQ&Aを見た人はこんなQ&Aも見ています
-
10代と話して驚いたこと
先日10代の知り合いと話した際、フロッピーディスクの実物を見たことがない、と言われて驚きました。今後もこういうことが増えてくるのかと思うと不思議な気持ちです。
-
一回も披露したことのない豆知識
あなたの「一回も披露したことのない豆知識」を教えてください。 「そうなんだね」と「確かに披露する場所ないね」で評価します。
-
とっておきの手土産を教えて
お呼ばれの時や、ちょっとした頂き物のお礼にと何かと必要なのに 自分のセレクトだとついマンネリ化してしまう手土産。 ¥5,000以内で手土産を用意するとしたらあなたは何を用意しますか??
-
おすすめのモーニング・朝食メニューを教えて!
コメダ珈琲店のモーニング ロイヤルホストのモーニング 牛丼チェーン店の朝食などなど、おいしいモーニング・朝食メニューがたくさんありますよね。
-
ギリギリ行けるお一人様のライン
おひとり様需要が増えているというニュースも耳にしますが、 あなたが「ギリギリ一人でも行ける!」という場所や行為を教えてください
-
<JavaScript>tableタグを入力不可にしたい。
JavaScript
-
<input type=hidden" >で配列(複数の要素)を渡したいとき?"
PHP
-
TABLEのセルの中の文字を行単位、セル単位で色を変えたい
HTML・CSS
-
-
4
複数のsubmitボタンで押されたボタンを取得する方法
JavaScript
-
5
javascriptで作成されたテーブルの値を取得したい
JavaScript
-
6
特定<table>内の<td>の色を変える
JavaScript
-
7
テーブルの位置を細かく指定したい。
HTML・CSS
-
8
htmlでテーブル内にテキストボックスを作りたいのですが・・・
HTML・CSS
-
9
テーブル内のチェックボックスのvalue受け渡し
JavaScript
-
10
Javascript_submit()完了後に処理したい
JavaScript
関連するカテゴリからQ&Aを探す
おすすめ情報
- ・漫画をレンタルでお得に読める!
- ・【大喜利】【投稿~11/22】このサンタクロースは偽物だと気付いた理由とは?
- ・お風呂の温度、何℃にしてますか?
- ・とっておきの「まかない飯」を教えて下さい!
- ・2024年のうちにやっておきたいこと、ここで宣言しませんか?
- ・いけず言葉しりとり
- ・土曜の昼、学校帰りの昼メシの思い出
- ・忘れられない激○○料理
- ・あなたにとってのゴールデンタイムはいつですか?
- ・とっておきの「夜食」教えて下さい
- ・これまでで一番「情けなかったとき」はいつですか?
- ・プリン+醤油=ウニみたいな組み合わせメニューを教えて!
- ・タイムマシーンがあったら、過去と未来どちらに行く?
- ・遅刻の「言い訳」選手権
- ・好きな和訳タイトルを教えてください
- ・うちのカレーにはこれが入ってる!って食材ありますか?
- ・おすすめのモーニング・朝食メニューを教えて!
- ・「覚え間違い」を教えてください!
- ・とっておきの手土産を教えて
- ・「平成」を感じるもの
- ・秘密基地、どこに作った?
- ・【お題】NEW演歌
- ・カンパ〜イ!←最初の1杯目、なに頼む?
- ・一回も披露したことのない豆知識
- ・これ何て呼びますか
- ・初めて自分の家と他人の家が違う、と意識した時
- ・「これはヤバかったな」という遅刻エピソード
- ・これ何て呼びますか Part2
- ・許せない心理テスト
- ・この人頭いいなと思ったエピソード
- ・牛、豚、鶏、どれか一つ食べられなくなるとしたら?
- ・好きなおでんの具材ドラフト会議しましょう
- ・餃子を食べるとき、何をつけますか?
- ・あなたの「必」の書き順を教えてください
- ・ギリギリ行けるお一人様のライン
- ・10代と話して驚いたこと
- ・大人になっても苦手な食べ物、ありますか?
- ・14歳の自分に衝撃の事実を告げてください
- ・家・車以外で、人生で一番奮発した買い物
- ・人生最悪の忘れ物
- ・あなたの習慣について教えてください!!
- ・都道府県穴埋めゲーム
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
画面表示とともにtableの指定の...
-
チェックボックス付きのテーブ...
-
innerHTMLで自動生成された表を...
-
文字数を数える際に空白、改行...
-
テーブル内のチェックボックス...
-
ボタンクリックでフォーカス移動
-
tableの各セルに同じ関数を対応...
-
ラジオボタンが選択されたらテ...
-
複数のselect値で1つも選択され...
-
ラジオボタンを一括で操作する...
-
テキストから要素を抜き出して...
-
return trueとreturn falseの用...
-
【jQuery】input nameの文字列...
-
現在時刻を取得してフォームのs...
-
tableの任意行にfocusをあてる
-
Selectボックスの幅を自動で広...
-
セレクトを全て選択されていな...
-
value内に変数を入れたい
-
ハイパーリンクを別ウインドウ...
-
一覧から選択した行の行番号を...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
チェックボックス付きのテーブ...
-
JavaScriptの「.querySelectorA...
-
ラジオボタンとテキストボック...
-
画面表示とともにtableの指定の...
-
テーブル内のチェックボックス...
-
クリックしたラジオボタンの行...
-
ラジオボタンが選択されたらテ...
-
VBSでの自動ログイン
-
formで項目を連結したい
-
文字数を数える際に空白、改行...
-
Formのシリアライズができない
-
localStorageでのcheckbox制御
-
innerHTMLで自動生成された表を...
-
【緊急】リアルタイムでエラー...
-
DOM追加時に表示されるが自動削...
-
繰り返し処理途中にJavaScript...
-
チェックボックスのチェック結...
-
フォントをまとめて<h5>にでき...
-
Javascriptの電卓で最初の何も...
-
JavaScriptで、コピーボタンを...
おすすめ情報