Reputation: 195
I need an array that stores only the selected values from the given options at contiguous locations. When I run the code below, all the values are stored at the same location(0) and the rest of the array is empty.
Following is my html:
<div>
<table id="myTable">
<tbody>
<tr>
<th>Robot By</th>
<th>Robot Name</th>
<th>Status</th>
<th>ADD</th>
<th>REMOVE</th>
</tr>
<tr id="col1">
<td>Google</td>
<td><em>googlebot</em></td>
<td>
<select class="myOption">
<option value="Same as Default">Same as Default</option>
<option value="Allowed">Allowed</option>
<option value="Refused">Refused</option>
</select></td>
<td>
<button type="button" class="addC">
Add
</button></td>
<td>
<button type="button" class="removeC">
Remove
</button></td>
</tr>
<tr id="col2">
<td>MSN Search</td>
<td><em>msnbot</em></td>
<td>
<select class="myOption">
<option value="Same as Default">Same as Default</option>
<option value="Allowed">Allowed</option>
<option value="Refused">Refused</option>
</select></td>
<td>
<button type="button" class="addC">
Add
</button></td>
<td>
<button type="button" class="removeC">
Remove
</button></td>
</tr>
<tr id="col3">
<td>Yahoo</td>
<td><em>yahoo-slurp</em></td>
<td>
<select class="myOption">
<option value="Same as Default">Same as Default</option>
<option value="Allowed">Allowed</option>
<option value="Refused">Refused</option>
</select></td>
<td>
<button type="button" class="addC">
Add
</button></td>
<td>
<button type="button" class="removeC">
Remove
</button></td>
</tr>
<tr id="col4">
<td>Ask/Teoma</td>
<td><em>teoma</em></td>
<td>
<select class="myOption">
<option value="Same as Default">Same as Default</option>
<option value="Allowed">Allowed</option>
<option value="Refused">Refused</option>
</select></td>
<td>
<button type="button" class="addC">
Add
</button></td>
<td>
<button type="button" class="removeC">
Remove
</button></td>
</tr>
</tbody>
</table>
</div>
<input type="button" value="Create Robots.txt" id="createFile">
<input type="reset" value="Clear All" id="clearAll">
Following is my jQuery:
$("#createFile").click(function() {
$('#myTable tr').find('td').each(function(index) {
$(this).find('.myOption').each(function(){
var myArray = [];
myArray.push($(".myOption option:selected").text());
});
Upvotes: 0
Views: 139
Reputation: 45121
Try this (demo):
$("#createFile").click(function() {
var values = [];
$('#myTable .myOption').each(function(){
values.push($(this).val());
});
console.log(values);
});
#myTable .myOption
selector is actually enough. .val
will return selected option value.
Upvotes: 2