In short I only want to show the table rows with a green ‘show’ button and I want to hide the other rows.
The problem is there’s a common class on the table rows because of a PHP for
loop. I tried to hide the row with jQuery by using an approach that if the green button id
is similar then hide other tr
rows, but it doesn’t work.
Any help would be appreciated
if (jQuery(".button").is("#john")) { jQuery("tr").addClass('john'); }
The above code is just to give a class to the tr
row with the green show button, but it gives a class to each tr
row.
<div class="notification notice margin-bottom-25"><p class=""><?php esc_html_e( 'Your listings are shown in the table below.', 'workscout' ); ?></p></div> <div class="job-div-fix-right"> <?php $submit_job_page = get_option('job_manager_submit_job_form_page_id'); if (!empty($submit_job_page)) { ?> <a href="<?php echo get_permalink($submit_job_page) ?>" class="button margin-top-30"><?php esc_html_e('Add Job','workscout'); ?></a> <?php } ?> </div> <div class="dashboard-list-box margin-top-30" id="job-manager-job-dashboard"> <div class="dashboard-list-box-content"> <table class="job-manager-jobs manage-table responsive-table" id="dude"> <thead> <tr class="dd"> <?php foreach ( $job_dashboard_columns as $key => $column ) : ?> <th class="<?php echo esc_attr( $key ); ?>"><?php echo workscout_manage_table_icons($key); echo esc_html( $column ); ?></th> <?php endforeach; ?> <th></th> </tr> </thead> <tbody> <?php if ( ! $jobs ) : ?> <tr> <td colspan="6"><?php esc_html_e( 'You do not have any active listings.', 'workscout' ); ?></td> </tr> <?php else : ?> <?php foreach ( $jobs as $job ) : ?> <tr> <?php foreach ( $job_dashboard_columns as $key => $column ) : ?> <td class="<?php echo esc_attr( $key ); ?>"> <?php if ('job_title' === $key ) : ?> <?php if ( $job->post_status == 'publish' ) : ?> <a href="<?php echo get_permalink( $job->ID ); ?>"><?php echo esc_html($job->post_title); ?></a> <?php else : ?> <?php echo esc_html($job->post_title); ?> <small>(<?php the_job_status( $job ); ?>)</small> <?php endif; ?> <?php elseif ('date' === $key ) : ?> <?php echo date_i18n( get_option( 'date_format' ), strtotime( $job->post_date ) ); ?> <?php elseif ('expires' === $key ) : ?> <?php echo $job->_job_expires ? date_i18n( get_option( 'date_format' ), strtotime( $job->_job_expires ) ) : '–'; ?> <?php elseif ('filled' === $key ) : ?> <?php echo is_position_filled( $job ) ? '✔' : '–'; ?> <?php elseif ('applications' === $key ) : ?> <?php global $post; echo ( $count = get_job_application_count( $job->ID ) ) ? '<a id="john" class="button" href="' . add_query_arg( array( 'action' => 'show_applications', 'job_id' => $job->ID ), get_permalink( $post->ID ) ) . '">'.__('Show','workscout').' (' . $count . ')</a>' : '–'; //echo $post->ID; //echo esc_html($job->ID); ?> <?php else : ?> <?php do_action( 'job_manager_job_dashboard_column_' . $key, $job ); ?> <?php endif; ?> </td> <?php endforeach; ?> <td class="action"> <?php $actions = array(); switch ( $job->post_status ) { case 'publish' : if ( wpjm_user_can_edit_published_submissions() ) { $actions[ 'edit' ] = array( 'label' => __( 'Edit', 'workscout' ), 'nonce' => false ); } if ( is_position_filled( $job ) ) { $actions['mark_not_filled'] = array( 'label' => esc_html__( 'Mark not filled', 'workscout' ), 'nonce' => true ); } else { $actions['mark_filled'] = array( 'label' => esc_html__( 'Mark filled', 'workscout' ), 'nonce' => true ); } $actions['duplicate'] = array( 'label' => __( 'Duplicate', 'wp-job-manager' ), 'nonce' => true ); break; case 'expired' : if ( job_manager_get_permalink( 'submit_job_form' ) ) { $actions['relist'] = array( 'label' => esc_html__( 'Relist', 'workscout' ), 'nonce' => true ); } break; case 'pending_payment' : case 'pending' : if ( job_manager_user_can_edit_pending_submissions() ) { $actions['edit'] = array( 'label' => esc_html__( 'Edit', 'workscout' ), 'nonce' => false ); } case 'draft' : case 'preview' : echo 'kkkkkk'.$actions['continue'] = array( 'label' => __( 'Continue Submission', 'workscout' ), 'nonce' => true ); break; break; } $actions['delete'] = array( 'label' => esc_html__( 'Delete', 'workscout' ), 'nonce' => true ); $actions = apply_filters( 'job_manager_my_job_actions', $actions, $job ); foreach ( $actions as $action => $value ) { $action_url = add_query_arg( array( 'action' => $action, 'job_id' => $job->ID ) ); if ( $value['nonce'] ) { $action_url = wp_nonce_url( $action_url, 'job_manager_my_job_actions' ); } echo '<a href="' . esc_url( $action_url ) . '" class="job-dashboard-action-' . esc_attr( $action ) . '">' .workscout_manage_action_icons($action) . esc_html( $value['label'] ) . '</a>'; } ?> </td> </tr> <?php endforeach; ?> <?php endif; ?> </tbody> </table> <?php get_job_manager_template( 'pagination.php', array( 'max_num_pages' => $max_num_pages ) ); ?> </div> </div> <script type="text/javascript"> if (jquery(#john).length){ alert("Hello! I am an alert box!!"); } </script>
Advertisement
Answer
To do this you can using the :not()
and :has()
selectors:
$('#yourTable tr:not(:has(.button))').hide();
Obviously you’ll need to amend the #yourTable
and .button
selectors to be relevant to the HTML in your project.