Trying to obtain value of visible filtered results and display hidden div(s) accordingly

ansible

Hello,

I have the following table:




Compatible Camera
Brand
Camera Model
Optical Zoom
Exposure Control
Focus Control
White Balance Control


.........The table.....


Compatible Camera
Brand
Camera Model
Optical Zoom
Exposure Control
Focus Control
White Balance Control




It is initialized using:

$j('.three input[type=submit]').addClass('submit-button');
var oTable = $j('#example').dataTable({
"bProcessing" : true,
"sAjaxSource" : '/cms/camera_source.txt',
"aoColumns" : [
/* camera Value */
{
"bVisible" : false
},
/* Brand */null,
/* Camera */null,
/* Optical */
{
"bSearchable" : false
},
/* Exposure */
{
"bSearchable" : false
},
/* Focus */
{
"bSearchable" : false
},
/* White Balance */
{
"bSearchable" : false
}]
});
/* Move the Search Field */
$j('.dataTables_filter').appendTo($j('.col-a'));
/* Filter camera Only */
$j('#cameraBtn').click(function() {
oTable.fnFilter('1', 0);
$j(".camera_for_list").show();
$j(".camera100_for_list, .camerapro_for_list").hide();
$j('.dataTables_filter input').val('').keyup();

return false;
});
/* Filter camera 100 Only */
$j('#camera100Btn').click(function() {
oTable.fnFilter('2', 0);
$j(".camera100_for_list").show();
$j(".camera_for_list, .camerapro_for_list").hide();
$j('.dataTables_filter input').val('').keyup();
return false;
});
/* Filter camera Pro Only */
$j('#cameraproBtn').click(function() {
oTable.fnFilter('3', 0);
$j(".camerapro_for_list").show();
$j(".camera_for_list, .camera100_for_list").hide();
$j('.dataTables_filter input').val('').keyup();
return false;
});
});



As you can see I have three buttons that filter the table and also display associated hidden divs onclick according to the values of Compatible Camera column. How would I go about displaying the hidden divs based on the results via the search box?

If a user types in a camera, I need to get the values of the Compatible Camera column and display the div or divs accordingly.

For example, if the rows contain 1 and 3 - the divs associated with those numbers show but 2 is hidden.

Thanks for the help.

fbas

I'm completely unsure what you're asking.

it would help to see the app on screen. I've set up the beginnings of a demo using your code, but it has no data and I didn't see any of the three buttons you mention.

can you edit this demo and add data (either change the sAjaxSource to a valid source, or add an array of data, or add some sample data to the HTML table) and anything else that's missing (buttons, hidden divs, etc)?

http://live.datatables.net/ezekoh/edit#javascript,html,live

ansible

I added the missing code. As you can see, the functionality is supposed to be that the button display the hidden divs.

All I want to do is display the hidden divs if the first columns numbers (1, 2, or 3) of the displayed results.

So, if someone types in some search item and 4 results display and maybe 1 or 2 in the column are a part of those results then the divs "camera_for_list" and "camerapro_for_list" will be displayed (camera100_for_list will still be hidden).

Note: The buttons work perfectly fine. I just can't figure out how to determine what numbers are being displayed so that I can show the divs I want, something like:

if column1 contains 1 then camera_for_list.show();
if column1 contains 2 then camera100_for_list.show();
if column1 contains 3 then camerapro_for_list.show();

Hope this helps and thanks.

ansible

Anyone have an idea?