I want to extract three non-consecutive values, of which one of each column of any row. The values are shown in a list that come from a query made to a database with the POST attribute. The selection I want to make with onClick using the mouse and not using a button (per row or generic). I think I used the response of one of the experts in this blog who used javascript code and it worked, but the values are shown in an alert and from there I could not get those values to make the next query.
Next I show the code in Javascript:
var toma; $toma="";
$(document).ready(function()
{ $(".alfa").click(function()
{ var toma; $(this).parents("tr").find('#a2,#a4,#a6').each(function()
{ toma+=$(this).html()+"\n"; }); alert(toma); });
});
As shown above, the three values a2, a4 and a6 (of a total of six) are within the variable, take, which perfectly shows the value of each one with the alert, but I have not been able to discretely rescue each value to use as input for another query without form.
NOTE: I wish to use is the mouse with onClick. I do not want buttons or forms.
Please, an expert can help resolve this situation.
***************** COMMENTS ON THE CODE REVISED 16-09-2017 ******************
Greetings, especially to Mr. Aaron Romero who very cleverly solved part of the problem I proposed about 21 hours ago. Mr. Romero's code effectively extracts the three (non-consecutive) values one from each column
as I required them; However, when there are several rows (be aware of
that come from a database and can be hundreds of rows) and click on any row the result is that all the values of these are selected
three columns and really what I need is that with the mouse onClick select the three values of those columns, as it is doing, but only from that row that has been "clicked".
I enclose the HTML code that I elaborated based on Mr.Romero's to show the result that he throws with two rows:
............... HTML ........................
<!DOCTYPE html>
<html>
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>peluca</title>
<script src="jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#dataGrid tr").on('click', function() {
var toma1 = "", toma2 = "", toma3 = "";
$("#dataGrid").find("tr").each(function() {
toma1 += $(this).find('td:eq(1)').html();
toma2 += $(this).find('td:eq(3)').html();
toma3 += $(this).find('td:eq(4)').html();
});
// $("#respuesta").text(toma1 + toma2 + toma3);
$("#respuesta1").text(toma1);
$("#respuesta2").text(toma2);
$("#respuesta3").text(toma3);
});
});
</script>
</head>
<body>
<table id="dataGrid">
<tr id="f1">
<td>aaa</td>
<td>bbb</td>
<td>ccc</td>
<td>ddd</td>
<td>eee</td>
<td>fff</td>
</tr>
<tr id="f2">
<td>000</td>
<td>111</td>
<td>222</td>
<td>333</td>
<td>444</td>
<td>555</td>
</tr>
</table>
<!-- <label id="respuesta"></label> -->
<label id="respuesta1"></label><br>
<label id="respuesta2"></label><br>
<label id="respuesta3"></label>
</body>
</html>
................ RESULT (any row is selected ....................
aaa bbb ccc ddd eee fff 000 111 222 333 444 555
bbb111 ddd333 eee444
..................... WHAT I HOPE AS A RESULT .................
// Select row f2
111 333 444
Note:
// Select row f1
bbb ddd eee
I would appreciate if you could adapt the code to what was proposed.