Perfect Position in Career Module

/*************** HUBL Code *********************/

{% if dynamic_page_hubdb_row %}   
<div id="open-position">
  <div class="page-center">
    <h2 class="open-position-title">{{ dynamic_page_hubdb_row.job_title }}</h2>
    <div class="row details">
      <h2 class="open-position-subtitle">Job Description</h2>
      {{ dynamic_page_hubdb_row.job_description }}
    </div>
    <div class="row details">
      <h2 class="open-position-subtitle">Job Requirements</h2>
      {{ dynamic_page_hubdb_row.job_requirements }}
    </div> 
    <div class="row btn-block">
      <button type="button" id="btn-apply" data-toggle="modal" data-target="#question-popup">Apply</button>
    </div>
  </div>
</div>
{% elif module.hubdb_table %}
{% set queryparam = "" %}
{% if request.query_dict.department in ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12","13","14","15","16","17","18","19","20","21","22","23","24","25","26","27","28"] and request.query_dict.job_location =="" %}
{% set queryparam = queryparam ~ "&department__in="~request.query_dict.department|urlencode %}
{% elif request.query_dict.department in ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12","13","14","15","16","17","18","19","20","21","22","23","24","25","26","27","28"] and request.query_dict.job_location !="" %}
{% set queryparam = queryparam ~ "&department__in="~request.query_dict.department|urlencode ~ "&job_location__in="~request.query_dict.job_location|urlencode %}
{% elif request.query_dict.job_location in ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12","13","14","15","16","17","18","19","20","21","22","23","24","25","26","27","28"] and request.query_dict.department =="" %}
{% set queryparam = queryparam ~ "&job_location__in="~request.query_dict.job_location|urlencode %}
{% endif %}
{% set table = hubdb_table_rows(module.hubdb_table, queryparam) %}
<div id="find-position">
  <div class="page-center">
    <div id="search-filter" class="clearfix">
      <h2>Find Your Perfect Position</h2>
      <form id="form_id" method="get">
        <div class="filter clearfix">
          <div class="filter-col col-md-6 col-sm-6 col-xs-12">
            <div class="filter-col-inner">
              <label for="marketFilter">Choose a department</label>
              <button type="button" class="btn dropdown-toggle btn-default" id="marketFilter" title="All market segments" aria-expanded="false">
                <span class="filter-option pull-left">All departments</span>
                <span class="bs-caret"><span class="caret"></span></span>
              </button>
              <div class="filter-menu filter-menu1">
                <ul>
                  {% set types = hubdb_table_column(module.hubdb_table, "department").options %}
                    <li data-value="" >All departments</li>
                  {% for choice in types %}
                    <li data-value="{{ choice.id }}">{{ choice.name }}</li>
                  {% endfor %}
                </ul>
              </div> 
            </div>
          </div>
          <div class="filter-col filter-col1 col-md-6 col-sm-6 col-xs-12">
            <div class="filter-col-inner">
              <label for="typeFilter">Choose a location</label>
              <button type="button" class="btn dropdown-toggle btn-default" data-toggle="dropdown" id="typeFilter" title="All resources" aria-expanded="false">
                <span class="filter-option pull-left">All locations</span>&nbsp;<span class="bs-caret"><span class="caret"></span></span>
              </button>
              <div class="filter-menu filter-menu-location">
                <ul>
                  <li data-value="">All locations</li>
                  {% for row in table %}
                    <li data-value="{{ row.job_location.id }}">{{ row.job_location.name }}</li>
                  {% endfor %} 
                </ul>
              </div>
            </div>
          </div>
        </div>
      </form>
    </div>
    {% if table == [] %}
    <p class='align-center'>Sorry, no listings found for that Search. Try changing your filter and search again.</p>
    {% else %}
    <div id="search-result" class="clearfix">
      <div class="search-result-content">
        <h3 class="hot_pos">Hot Positions</h3>
        <div class="wrapper-all-result">
          {% for row in table %}
          {% if row.positions.name == "Hot Positions" %}
          <div class="row" data-index="{{ loop.index }}">
            <h4 class="department">{{ row.department.name }}</h4>
            <div class="row-result clearfix">
              <a href="{{ request.path }}/{{ row.hs_path }}">
                <div class="col-md-9 col-sm-9 col-xs-12">
                  <h5>{{ row.job_title }}</h5>
                  <p>{{ row.job_summary }}</p>
                </div>
                <div class="col-md-3 col-sm-3 col-xs-12">
                  <span class="hs-job_location">{{ row.job_location.name }}</span>
                  <i class="career-icon-more"></i>
                </div>
              </a>
            </div>
          </div> 
          {% endif %}
          {% endfor %}
        </div>
        <h3 class="search-all-results">Open Positions</h3>
        <div class="wrapper-all-result">
          {% for row in table %}
          {% if row.positions.name == "Open Positions" %}
          <h4>{{ row.department.name }}</h4>
          <div class="row " data-index="{{ loop.index }}" data-location="{{ row.job_location.name }}">
            <div class="hs-data-location-wrap">
              <li class="hs-data-location" data-value="{{ row.job_location.id }}" >{{ row.job_location.name }}</li>
            </div>
            <div class="row-result clearfix">
              <a href="{{ request.path }}/{{ row.hs_path }}">
                <div class="col-md-9 col-sm-9 col-xs-12">
                  <h5>{{ row.job_title }}</h5>
                  <p>{{ row.job_summary }}</p>
                </div>
                <div class="col-md-3 col-sm-3 col-xs-12">
                  <span>{{ row.job_location.name }}</span>
                  <i class="career-icon-more"></i>
                </div>
              </a>
            </div>
          </div>  
          {% endif %}
          {% endfor %}
        </div>
      </div>
    </div>
  </div>
</div>
{% endif %}
{% endif %}

/************************** Java Script *****************/

$('body').click(function(){
  $('.filter-col-inner').removeClass('dropup-open')
});
$('.filter .filter-col .btn.dropdown-toggle').click(function(e){
  e.stopPropagation();
  $(this).parents('.filter-col').siblings().find('.filter-col-inner').removeClass('dropup-open')
  $(this).parent('.filter-col-inner').toggleClass('dropup-open');
});
$('.filter-menu-location ul li').each(function(){
  var itsTxt = $(this).text();
  $(this).nextAll('li:contains('+itsTxt+')').remove();
});
// $('.filter-menu ul li a').each(function(){
// $('body').click('click',".filter-menu1 ul li a",function(){ 
$('body').on('click',".filter-menu ul li",function(){ 
  $('#typeFilter').attr('search-data',"");
  var dvl = $(this).attr('data-value');
  var textVl = $(this).text();
  $(this).closest('.filter-menu').prev('.dropdown-toggle').attr('search-data', dvl);
  $(this).closest('.filter-menu').prev('.dropdown-toggle').find('.filter-option').text(textVl);
  var a = $('#marketFilter').attr('search-data');
  var b = $('#typeFilter').attr('search-data');
  console.log(a);
  console.log(b);
  if (a == undefined) {
    a="";
  }
  if (b == undefined) {
    b="";
  }
  var ab = "/about-ceragon/careers?department="+ a + "&job_location=" + b
  console.log(ab);
  $( "#search-result" ).load(ab + " .search-result-content", function( response, status, xhr ) {
    $('#find-position h4').each(function(){
      var itsTxt = $(this).text();
      $(this).nextAll('h4:contains('+itsTxt+')').remove();
    });
    if ( $('.search-result-content').length < 1 ) {
      $( "#search-result" ).html('<div class="no-results">No matching results</div>');
    }
  });
});

$('body').on('click',".filter-menu1 ul li",function(){ 
  $('#typeFilter').attr('search-data',"");
  $('#typeFilter .filter-option').text('All locations');
  var dvl = $(this).attr('data-value');
  var textVl = $(this).text();
  $(this).closest('.filter-menu').prev('.dropdown-toggle').attr('search-data', dvl);
  $(this).closest('.filter-menu').prev('.dropdown-toggle').find('.filter-option').text(textVl);
  var a = $('#marketFilter').attr('search-data');
  var b = $('#typeFilter').attr('search-data');
  console.log(a);
  console.log(b);
  if (a == undefined) {
    a="";
  }
  if (b == undefined) {
    b="";
  }
  var ab = "/about-ceragon/careers?department="+ a + "&job_location=" + b
  console.log(ab);
  $( ".filter-menu-location ul" ).load(ab + " li.hs-data-location", function() {
    $('.filter-menu-location ul').prepend('<li data-value="">All locations</li>');
    $('.filter-menu-location ul li').each(function(){
      var itsTxt = $(this).text();
      $(this).nextAll('li:contains('+itsTxt+')').remove();
    });
  });
});

// });

Comments

Popular posts from this blog

Numbered Pagination in HubDB

Dynamic Pages Number Pagination in HubDB (Listing)

Tabber in Tabber