Ajax loading results from another page [UPDATED]

[Leftfield]

Attached files are updated. Keep in mind that home.php and one search.php are in views/ folder.

Hi @All. I am making real estate website with map leaflet module. Please keep in mind that I do SEO and SEM and I am NOT an expert in PHP, so if you find anything that could be better or pit-a-pat, please, please fix and comment.

Many tricks learned throw @OLSA coding so thank You my great friend.

Explanation: I am using template/view folder for logic = separate code and design. Calls for my fields are included in files attached to the post. Hope you'll get the idea. what I have done  All of this is preliminary code which will be speeded up but it is working.

Not finished but must have: search button on the home if ajax is not working.

_main.php file has: include('views/' . $page->template->name . '.php'); but it doesnt have any influence on this code. Just saying if I update this.

So, here are parts

views/home.php

<?php $izdvojene = wire('pages')->find('template=property, state=featured|new, sort=-date, limit=6'); ?>
<div id="sadrzaj">
    <div id="rezultati">
    <?php foreach($izdvojene as $item) : ?>
       <div class="trecina nekretnina" data-link="<?= $item->url ?>">
            <div class="slika">
            <img src="<?= $item->images->eq(0)->size(346,220)->url; ?>" alt="<?= $item->images->eq(0)->description ?>" />
                <div class="stanje">
                    <?php
                    $state = $item->state;
                    if ($state->has("name=sold") == 1) {
                        ?><div class="prodato"><?= $state->sold->title ?></div><?php
                    } else {

                    if ($state->has("name=featured") == 1) :
                          ?><div class="izdvojeno"><?= $state->featured->title ?></div><?php
                      endif;

                    if ($state->has("name=new") == 1) :
                          ?><div class="novo"><?= $state->new->title ?></div><?php
                      endif;

                    // if ($state->has("name=hot") == 1) :
                    //  endif;

                    if ($state->has("name=gorgeus") == 1) :
                          ?><div class="prelijepo"><?= $state->gorgeus->title ?></div><?php
                      endif;

                    }; ?>
                </div>
                <div class="lokacija"><i class="fa fa-map-marker"></i><?php
                    $json = json_decode($item->map->raw);
                    if (isset($json->address->village)) :
                        echo $json->address->village;
                    else :
                        echo $json->address->county;
                    endif;
                    echo ", ";
                    echo $json->address->country;
                    ?>
                </div>
                <div class="displeji"><?= $item->images->count(); ?><i class="fa fa-picture-o"></i></div>                      
            </div>                   
           <h2 class="naslov"><a href="<?= $item->url ?>"><?= $item->title; ?></a></h2>
           <p class="cijena"><?php if($item->price) : ?><?php echo number_format($item->price,2,",",".");?> &euro;<?php else : ?><?php echo __('Call for price');?><?php endif; ?></p>
            <p class="uvod"><?= wordLimiter(ripTags($item->body), 120); ?> <?php echo __('Read More');?></p>
            <p class="sadrzaj">
            <?php if($item->surface) : ?><i class="fa fa-th"></i><?= $item->surface ?><?php endif; ?> m<sup>2</sup>
            <?php if($item->bedrooms) : ?><i class="fa fa-bed"></i><?= $item->bedrooms ?><?php endif; ?>
            <?php if($item->bathrooms) : ?><i class="fa fa-bath"></i><?= $item->bathrooms ?><?php endif; ?>
            </p>                    
        </div>
    <?php endforeach; ?>
    </div>
</div>

 

main-search.php which is called by ajax:

<?php namespace ProcessWire; ?>
<div id="rezultati">
    <?php foreach($items as $item) : ?>
       <div class="trecina nekretnina" data-link="<?= $item->url ?>">
        <div class="slika">
        <img src="<?= $item->images->eq(0)->size(346,220)->url; ?>" alt="<?= $item->images->eq(0)->description ?>" />
            <div class="stanje">
                <?php
                $state = $item->state;
                if ($state->has("name=sold") == 1) {
                    ?><div class="prodato"><?= $state->sold->title ?></div><?php
                } else {

                if ($state->has("name=featured") == 1) :
                      ?><div class="izdvojeno"><?= $state->featured->title ?></div><?php
                  endif;

                if ($state->has("name=new") == 1) :
                      ?><div class="novo"><?= $state->new->title ?></div><?php
                  endif;

                // if ($state->has("name=hot") == 1) :
                //  endif;

                if ($state->has("name=gorgeus") == 1) :
                      ?><div class="prelijepo"><?= $state->gorgeus->title ?></div><?php
                  endif;

                }; ?>
            </div>
            <div class="lokacija"><i class="fa fa-map-marker"></i><?php
                $json = json_decode($item->map->raw);
                if (isset($json->address->village)) :
                    echo $json->address->village;
                else :
                    echo $json->address->county;
                endif;
                echo ", ";
                echo $json->address->country;
                ?>
            </div>
            <div class="displeji"><?= $item->images->count(); ?><i class="fa fa-picture-o"></i></div>                      
        </div>                   
       <h2 class="naslov"><a href="<?= $item->url ?>"><?= $item->title; ?></a></h2>
       <p class="cijena"><?php if($item->price) : ?><?php echo number_format($item->price,2,",",".");?> €<?php else : ?><?php echo __('Call for price');?><?php endif; ?></p>
        <p class="uvod"><?= wordLimiter(ripTags($item->body), 120); ?> <?php echo __('Read More');?></p>
        <p class="sadrzaj">
        <?php if($item->surface) : ?><i class="fa fa-th"></i><?= $item->surface ?><?php endif; ?> m<sup>2</sup>
        <?php if($item->bedrooms) : ?><i class="fa fa-bed"></i><?= $item->bedrooms ?><?php endif; ?>
        <?php if($item->bathrooms) : ?><i class="fa fa-bath"></i><?= $item->bathrooms ?><?php endif; ?>
        </p>                    
    </div>
    <?php endforeach; ?>
</div>

 

main.js

    // Ajax search and scrolling to the form
        function goToByScroll() {
            $('html,body').animate({
                    scrollTop: $("#glavna-pretraga").offset().top-200
            }, 'slow');
        }
        function ajaxLoaderClass(){
                var container = document.getElementById( "sadrzaj" );
                container.classList.toggle("loading");
        }

        function ajaxSearch(){
                goToByScroll;
                ajaxLoaderClass();
                $.ajax({
                type: "GET",
                url: 'search\/',
                data: $('#glavna-pretraga').serialize(),
                success: function(data){
                    goToByScroll();
                    $("#sadrzaj").empty().append(data);
                    ajaxLoaderClass();
            }
            });
        }

 

search.php

<?php namespace ProcessWire;

// other params
$property_type = $sanitizer->text($input->get->property_type);
$bedrooms_min = $sanitizer->int($input->get->bedrooms_min);
$bedrooms_max = $sanitizer->int($input->get->bedrooms_max);
$price_min = $sanitizer->int($input->get->price_min);
$price_max = $sanitizer->int($input->get->price_max);
$sq_min = $sanitizer->int($input->get->sq_min);
$sq_max = $sanitizer->int($input->get->sq_max);
$pid = $sanitizer->text($input->get->pid);

$selector = array();

if($property_type){
	$input->whitelist('property_type', $property_type);
	$property_type = $sanitizer->selectorValue($property_type);
	$selector[]= "parent=$property_type";
}

if($bedrooms_min){
	$input->whitelist('bedrooms_min', $bedrooms_min);
	$sq_min = $sanitizer->selectorValue($bedrooms_min);
	$selector[]= "bedrooms>=$bedrooms_min";
}

if($bedrooms_max){
	$input->whitelist('bedrooms_max', $bedrooms_max);
	$rooms = $sanitizer->selectorValue($bedrooms_max);
	$selector[]= "bedrooms<=$bedrooms_max";
}

if($price_min){
	$input->whitelist('price_min', $price_min);
	$price_min = $sanitizer->selectorValue($price_min);
	$selector[] = "price>=$price_min";
}

if($price_max){
	$input->whitelist('price_max', $price_max);
	$price_max = $sanitizer->selectorValue($price_max);
	$selector[] = "price<=$price_max";
}

if($sq_min){
	$input->whitelist('sq_min', $sq_min);
	$sq_min = $sanitizer->selectorValue($sq_min);
	$selector[]= "surface>=$sq_min";
}

if($sq_max){
	$input->whitelist('sq_max', $sq_max);
	$rooms = $sanitizer->selectorValue($sq_max);
	$selector[]= "surface<=$sq_max";
}

if( $pid ){
	$selector = array(); // reset selector
	$input->whitelist('pid', $pid);
	$pid = $sanitizer->selectorValue($pid);
	$selector[] = "pid=$pid";
}

// search inside property items
$selector[] = "template=property";

// search processing
if( $config->ajax ){
	
    // Ajax call
	$query = implode(',', $selector);
	$items = $pages->find( $query );
	$items_count = $items->count;
    include('./main-search.php');?>
    

	<?php exit(0);

} else {

	// is not Ajax call
	$selector[] = "sort=price";
	$selector[] = "limit=10";
	$query = implode(',', $selector);	
	$items = $pages->find( $query );

	$pagination = $items->renderPager(array(
		'nextItemLabel' => "<span aria-hidden='true'>»</span>",
		'previousItemLabel' => "<span aria-hidden='true'>«</span>",
		'listMarkup' => "<ul class='pagination pagination-lg'>{out}</ul>",
		'itemMarkup' => "<li>{out}</li>",
		'linkMarkup' => "<a href='{url}' class='btn btn-raised ripple-effect btn-default'>{out}</a>",
		'currentItemClass' => "active"
	));

	// did we find any matches?
	if( $items->count ){
		$message = __("Showing results");
	}
}
?>

Complete files attached with function.php were some functions are. All this files are in root folder (except js) of template.

 

home.php main-search.php search.php main.js _func.php search.php

[Pitbull]

nice work, thank you!