Drop-down selection for city at search

[revelation]

Anyone figure out how to change 'ListAll' to something that will pull cities from select regions?

[serjuc11111]

in what file u want to do that?main...search page...or inc.search?thx

[kanum]

in what file u want to do that?main...search page...or inc.search?thx

On Main File (on sidebar search).

Thanks

[pinkfloyd69]

I have tehe same problem...

How Can I select only the cities when i select a region? When i select a region show all cities ;(

[lemike]

Bumping here... Has anybody figured out how to ::

1- Show dropdown menu for regions in the search sidebar
2- Show dropdown menu for cities dependent on the region dropdown selection

Just like the dropdowns for countries/regions/cities in item-post.php.

Thanks for your help!!

[geo78]

Interested too to find a solution for this 

[serjuc11111]

no solution for this?thx

[jimmyconway]

Hi, I am using a custom theme built on the modern default theme and was facing the same issue regarding displaying cities per region on the sidebar search engine.

Here is my solution:
All changes need to be done in search.php

First of all, add a region dropdown list in the "Location" section, you will end up with this code for that div:

Code: [Select]

                            <h3><strong><?php _e('Location', 'modern'); ?></strong></h3>
                            <div class="row one_input">
                                <h6><?php _e('Region', 'modern'); ?></h6>
                                <?php ItemForm::region_select(osc_get_regions(osc_user_country()), osc_user()); ?>
                                <h6><?php _e('City', 'modern'); ?></h6>
                                <select id="sCity" name="sCity">
                                    <option value="">Any City</option>
                                </select>
                                <input type="hidden" id="sRegion" name="sRegion" value="" />
                            </div>
Now, we are going to edit the javascript at the very bottom of the page:
Remove that autocomplete code:

Code: [Select]

                    $( "#sCity" ).autocomplete({
                        source: "<?php echo osc_base_url(true); ?>?page=ajax&action=location",
                        minLength: 2,
                        select: function( event, ui ) {
                            $("#sRegion").attr("value", ui.item.region);
                            log( ui.item ?
                                "<?php _e('Selected', 'modern'); ?>: " + ui.item.value + " aka " + ui.item.id :
                                "<?php _e('Nothing selected, input was', 'modern'); ?> " + this.value );
                        }
                    });
Replace it by the following:

Code: [Select]

                    $('#regionId').change(function updateCityList() {
                        var actualRegionId   = $(this).val();

                        if ( Math.floor(actualRegionId) == actualRegionId && $.isNumeric(actualRegionId)) {
                            /*Get cities per region*/
                            $.ajax({
                                url: "<?php echo osc_base_url(true); ?>?page=ajax&action=cities",
                                data: { regionId: actualRegionId },
                                success: function( cities, err){
                                    var $el = $("#sCity"),
                                        citiesOptions = {};
                                   
                                    $('#sCity option:gt(0)').remove();
                                    $el.val("");
                                    $el.prev("span").text("Any City");
                                    $.each(cities, function(key, value) {
                                      $el.append($("<option></option>")
                                         .attr("value", value.s_name).text(value.s_name));
                                    });
                                    $("#sRegion").attr("value", $("#regionId option[value='"+actualRegionId+"']").text());
                                },
                                dataType: "json"
                            });
                        }
                    });
Basically what it does, is an ajax request when the region is changed. We pass the regionId and we are returned with the different cities of the specified region. From there, we just need to replace everything in the dropdown with the new list of cities.

Hope that helps.

[shamim_biplob]

i used this code and worked. but dont kno why after one day it is not working. i change nothing.  in city only showing drop down but no city.
please take a look.

http://www.banglardokan.com

please help me.

[Nazar]

This customization needs to be added to http://doc.osclass.org/Changing_between_drop-down_and_autocomplete_for_locations wiki page.

[theklassifieds]

Hi, I am using a custom theme built on the modern default theme and was facing the same issue regarding displaying cities per region on the sidebar search engine.

Here is my solution:
All changes need to be done in search.php
.
.
.
Basically what it does, is an ajax request when the region is changed. We pass the regionId and we are returned with the different cities of the specified region. From there, we just need to replace everything in the dropdown with the new list of cities.

Hope that helps.

This is brilliant!! Any chance I can get some code to have the chosen Region/City remain for the user's next search? At the moment it is being cleared after every search. Thanks

[SmaRTeY]

What search menu? The one on top in your header or the advanced search sidebar on search result page?

[MissTS]

my page has this...  not sure where to change it or if that is right for this template


    // meta tag robots
    if( osc_count_items() == 0 || stripos($_SERVER['REQUEST_URI'], 'search') ) {
        osc_add_hook('header','bender_black_nofollow_construct');
    } else {
        osc_add_hook('header','bender_black_follow_construct');
    }

    bender_black_add_body_class('search');
    $listClass = '';
    $buttonClass = '';
    if(osc_search_show_as() == 'gallery'){
          $listClass = 'listing-grid';
          $buttonClass = 'active';
    }
    osc_add_hook('before-main','sidebar');
    function sidebar(){
        osc_current_web_theme_path('search-sidebar.php');
    }
    osc_add_hook('footer','autocompleteCity');
    function autocompleteCity(){ ?>
    <script type="text/javascript">
    $(function() {
                    function log( message ) {
                        $( "<div/>" ).text( message ).prependTo( "#log" );
                        $( "#log" ).attr( "scrollTop", 0 );
                    }

                    $( "#sCity" ).autocomplete({
                        source: "<?php echo osc_base_url(true); ?>?page=ajax&action=location",
                        minLength: 2,
                        select: function( event, ui ) {
                            $("#sRegion").attr("value", ui.item.region);
                            log( ui.item ?
                                "<?php echo osc_esc_html( __('Selected', 'bender_black') ); ?>: " + ui.item.value + " aka " + ui.item.id :
                                "<?php echo osc_esc_html( __('Nothing selected, input was', 'bender_black') ); ?> " + this.value );
                        }
                    });
                });
    </script>

now sure where, what line to change from and to

[Adyyda]

Hi, I am using a custom theme built on the modern default theme and was facing the same issue regarding displaying cities per region on the sidebar search engine.

Here is my solution:
All changes need to be done in search.php

First of all, add a region dropdown list in the "Location" section, you will end up with this code for that div:

Code: [Select]

                            <h3><strong><?php _e('Location', 'modern'); ?></strong></h3>
                            <div class="row one_input">
                                <h6><?php _e('Region', 'modern'); ?></h6>
                                <?php ItemForm::region_select(osc_get_regions(osc_user_country()), osc_user()); ?>
                                <h6><?php _e('City', 'modern'); ?></h6>
                                <select id="sCity" name="sCity">
                                    <option value="">Any City</option>
                                </select>
                                <input type="hidden" id="sRegion" name="sRegion" value="" />
                            </div>
Now, we are going to edit the javascript at the very bottom of the page:
Remove that autocomplete code:

Code: [Select]

                    $( "#sCity" ).autocomplete({
                        source: "<?php echo osc_base_url(true); ?>?page=ajax&action=location",
                        minLength: 2,
                        select: function( event, ui ) {
                            $("#sRegion").attr("value", ui.item.region);
                            log( ui.item ?
                                "<?php _e('Selected', 'modern'); ?>: " + ui.item.value + " aka " + ui.item.id :
                                "<?php _e('Nothing selected, input was', 'modern'); ?> " + this.value );
                        }
                    });
Replace it by the following:

Code: [Select]

                    $('#regionId').change(function updateCityList() {
                        var actualRegionId   = $(this).val();

                        if ( Math.floor(actualRegionId) == actualRegionId && $.isNumeric(actualRegionId)) {
                            /*Get cities per region*/
                            $.ajax({
                                url: "<?php echo osc_base_url(true); ?>?page=ajax&action=cities",
                                data: { regionId: actualRegionId },
                                success: function( cities, err){
                                    var $el = $("#sCity"),
                                        citiesOptions = {};
                                   
                                    $('#sCity option:gt(0)').remove();
                                    $el.val("");
                                    $el.prev("span").text("Any City");
                                    $.each(cities, function(key, value) {
                                      $el.append($("<option></option>")
                                         .attr("value", value.s_name).text(value.s_name));
                                    });
                                    $("#sRegion").attr("value", $("#regionId option[value='"+actualRegionId+"']").text());
                                },
                                dataType: "json"
                            });
                        }
                    });
Basically what it does, is an ajax request when the region is changed. We pass the regionId and we are returned with the different cities of the specified region. From there, we just need to replace everything in the dropdown with the new list of cities.

Hope that helps.

Hello. Your code works except 2 issues:
1. after you select region/city and you click on Apply, you get the proper results and olso, the selection you have made in sidebar (region/city) is gone. The values are not kept. How can we keep them until user resets the dropdowns?
2. when you perform a selection, the address of the new page looks like this /regionId,782154/city,Agrișu+Mare/region,Arad/ , so, we have the region twice, one time as id 782154 and once as region,Arad . It should show just 1 time, so how can we see just /city,Agrișu+Mare/region,Arad/ (lose regionId).
Thanks