Searching jobs
-
Should I remove the loop as well? It keeps looping the job title and search.
Hi Mel,
try giving this a go:
<?php /* Template Name: Advanced Search */ ?> <?php $options = get_option( 'classy_theme_settings' ); ?> <?php get_header(''); ?> <?php //if post has thumbnail if( has_post_thumbnail() ) { ?> <div id="page-header"> <img src="<?php echo $featured_image[0]; ?>" alt ="<?php the_title(''); ?>" width="980" /> </div> <!-- END #page-header --> <?php } ?> <div id="post"> <h1 class="page-title"><?php the_title(); ?></h1> <?php the_content(); ?> <?php if(!isset($_GET['keyword'])){$_GET['keyword']="";} if(!isset($_GET['location'])){$_GET['location']=0;} ?> <form action="#" methond="get"> <ul> <li> <label for="keyword">Keyword</label> <input type="text" name="keyword" value="<?php echo strip_tags($_GET['keyword']); ?>" /> </li> <li> <label for="location">Location</label> <select name="location"> <option value="0"<?php if($_GET['location']==0){?> selected="selected"<?php } ?>>Any</option> <option value="1"<?php if($_GET['location']==1){?> selected="selected"<?php } ?>>Toledo, OH</option> <option value="2"<?php if($_GET['location']==2){?> selected="selected"<?php } ?>>Delta, OH</option> <option value="3"<?php if($_GET['location']==3){?> selected="selected"<?php } ?>>Findlay, OH</option> </select> </li> <input type="submit" value="Search" /> </ul> </form> <?php if($_GET['keyword']!=""||$_GET['location']!=0){ ?> <h2>Search Results</h2> <ul id="jobs-two"> <?php //query_posts('post_type=jobman_job&posts_per_page=10'); ?> <?php $_GET['keyword'] = trim($_GET['keyword']); if($_GET['keyword']==""){$_GET['keyword']=" ";} if($_GET['location']!=0){ switch($_GET['location']){ case 1: $location = 'Toledo, OH'; break; case 2: $location = 'Delta, OH'; break; case 3: $location = 'Findlay, OH'; break; } } if($_GET['location']!=0){ query_posts(array( 'post_title' => 'LIKE %'.$_GET['keyword'].'%', 'post_type' => 'jobman_job', 'meta_query' => array( array( 'key' => 'data4', 'value' => $location, ), ), 'posts_per_page' => '10', )); }else{ query_posts(array( 'post_title' => 'LIKE %'.$_GET['keyword'].'%', 'post_type' => 'jobman_job', 'posts_per_page' => '10', )); } ?> <?php $count = 0; ?> <?php while (have_posts()) : the_post(); ?> <?php if(strstr(get_the_title(),trim($_GET['keyword']))){ ?> <li> <strong><?php the_title(); ?></strong><br /> <strong>Location:</strong> <?php $location = get_post_custom_values('data4'); echo $location[0]; ?><br /> <a href="<?php the_permalink() ?>">More</a> </li> <?php $count++; ?> <?php } ?> <?php endwhile;?> <?php if(!$count){ ?> <p><strong>Sorry but your search returned no jobs. Please try again.</strong></p> <?php } ?> </ul> <?php } ?> </div> <?php get_sidebar('pages'); ?> <?php get_footer(''); ?>It doesn’t turn up any search results.
Maybe have it search upon looping?
I have a different solution that anybody interested in a search function might be interested in. It’s not really generic code, but it could be modified probably fairly easily to work for other setups.
https://eccotique.com/careers/listings/
Sorry the page probably loads really slow right now, there’s some kind of a performance problem I can’t seem to pinpoint just yet.
Basically I added the <select> elements to the “Before the Main Jobs List” box, along with the search jobs and reset buttons and used css to hide the job-table by default.
I then spent hours writing the jquery to search through the contents of the table for the selected items in the <select> elements. It also works with multiple selections which is nice.
Here’s the code:
$('.submit').click(function(){ locationVals = $('.location').val(); positionVals = $('.position').val(); $('.job-table').show('fast'); if (locationVals != "all") { x = 0; $(locationVals).each(function() { loc = $('.location').val()[x]; $('td.Location:contains('+loc+')').addClass('match'); x++; }); $('.jobrow').children('td.Location').not('.match').parent().hide('fast'); } if (positionVals != "all") { y = 0; $(positionVals).each(function() { pos = $('.position').val()[y]; $('td.Position:contains('+pos+')').addClass('match'); y++; }); $('.jobrow').children('td.Position').not('.match').parent().hide('fast'); }; }); $('.resetpage').click(function(){ $('.job-table').hide('fast'); $('.location').val('all'); $('.position').val('all'); $('.jobrow').children('td').removeClass('match'); $('.job-table').children('tbody').children('tr').each(function(){$(this).show()}); });all of this goes into:
jQuery(function($) { put code in here }I can try and explain things a bit more thoroughly if anybody is interested.
Which php page did you put the code in?
I like to create a site.js file and add a link to it in the head section of my theme using the functions.php file. It may not be the most elegant (or correct) way to do things but it works for me like this:
(in your themes functions.php)
function childtheme_scripts() {?> <script type="text/javascript" src="<?php bloginfo('stylesheet_directory') ?>/site.js"></script> <?php } add_action('wp_head','childtheme_scripts');the code in my previous post goes in a site.js file right in your theme directory.
Does it matter where I post this in the functions.php file?
So you made a separate .js file and that just goes in my specific theme folder that I’m using, right?I don’t think it matters where in the functions.php file you put that. (as long as you don’t stuff it into the middle of another function of course) I just put mine at the end. You can add other things into the header inside of that function as well if you want/need.
Yes I created the site.js file and put it into the theme’s root folder: “wp-content/themes/thematic-child/site.js”
you can add any other js you want to run on every/any page into the site.js file as well.
Ok, How do I post it on a page? Is “bloginfo” pointing to a specific page templete or what? I want to post the search before the job listings or have the search on another page.
bloginfo('stylesheet_directory')is pointing to the directory that contains the style.css that wordpress is currently using.If you poke around in my job listing page: https://eccotique.com/careers/listings/ you will see that it is the actual page with the table of jobs in it, but I used css to hide it initially:
.job-table { display: none;}once the user clicks the submit button, the table is shown:
$('.job-table').show('fast');then the value of the 2 <select> elements is checked and the table is shown with the requested results. Basically if either of the <select> elements don’t have “-all-” selected we go through the list of selected items and search the correct column for the selected items (I’ve added a class to help me discern the correct column to look at: <td class=”Position”> and <td class=”Location”>) if one of the selected words is found we add a new class “match” to the <td> containing the word and at the end of the loop all of the elements without a class of “match” have their row hidden:
$('.jobrow').children('td.Position').not('.match').parent().hide('fast');The reset button basically hides the table, unhides any table rows and removes all of the “match” classes, as well as setting the <select> elements back to their initial value of “-all-”
Hi siguy,
I have a question based on your tutorial. Caveat – I know absolutely no html or css. The website in question is here: https://evaintranet.site11.com/jobs/
So far I’ve been able to create the <select> elements, the buttons, and hide the table with the code below.
[Code moderated as per the Forum Rules. Please use the pastebin]
However, I can’t figure out how to get the buttons to work correctly and I do not know if I hide the table correctly.
I did upload the site.js file and added the link to it in the header so that should be fine.
If you have any suggestions that’d be great.
Hi Alicia,
The first thing I see is you are missing a ) at the end of your site.js file. (the last line should look like this:
});It also looks like your job-table(s) is/are set up much differently than mine which might be a bit of a problem. Here is the code that I have in the “Job List Template” field in job manager settings -> display settings:
[Code moderated as per the Forum Rules. Please use the pastebin]
The important part is
class="[job_field0_label]"which I have added so that the jquery script in site.js knows which td to look for content in.You might be alright with using one table per job if you make those 2 changes. Try it out and see how it goes.
The other thing I would suggest is using firefox and getting (and learning all you can about) firebug. I use it all the time to figure out why complex pages and/or scripts don’t work. It was essential in the development of this search script.
Let me know if you have any more questions and I’ll do whatever I can to help out.
I fixed the .js file but I can’t see your code because it was moderated.
And I’ll definitely check out firebug.
Here is the code I tried to put in my post:
You will probably want to change your value attributes. They are what is used for the search. Here is one of my <select>’s for example:
<select class="location" multiple="" size="8" name="location"> <option value="all" selected>- Any -</option> <option value="Burnaby">Burnaby</option> <option value="Coquitlam">Coquitlam</option> <option value="Langley">Langley</option> <option value="Pitt Meadows">Pitt Meadows</option> <option value="Richmond">Richmond</option> <option value="Surrey">Surrey</option> <option value="Vancouver">Vancouver</option> </select>using value=”all” for the Any option will also make it so that the reset page button will select “Any” in each <option>.
- The topic ‘Searching jobs’ is closed to new replies.
