How to change in view ajax according to requirement in drupal 8?

It's easy to handle this core changes of views. One thing we have to sure that Views Advanced feature "Use AJAX:" should be yes.

"Use AJAX: Yes"

After that we can check our views/ajax request by Inspect and Check with Network Tab. We are giving an example to easy to use this.

Example: Suppose we have to start any view/ajax request on click on any "id" in html then our code in jquery file will be:

jQuery(document).on("click", "#prodresources", function (e) {                
    var arr = base_fullurl.split('/');
    var page_nid = arr[2]; 
    Drupal.attachBehaviors();
    getInfo('application_resources',['block_3','block_13'], page_nid);    // we are creating a function on click on "prodresources" id.
});

Parameters:
view_name : "application_resources"       // that is view machine name
view_display_id : ['block_3','block_13']  // we can use multiple views block on same view.
view_args: page_nid                       // this is argument for view


We just have to pass these three parameters view_name:machine name and view_display_id: blocks in array in multiple case and last one is view_args: if arguments pass.

function getInfo(view_name, blocks, args) {
    var base_url = window.location.origin;       
    $.ajax({
      url: base_url+'/views/ajax',
      type: 'post',
      data: {
        view_name: view_name, 
        view_display_id: blocks,
        view_args: args,
      },
      dataTypeview_display_id: 'json',
      success: function (response) {
          if (response[3] !== undefined) {
          var viewHtml = response[3].data;
          $('#destination_id').html(viewHtml);
          Drupal.attachBehaviors();
        }           
      },
          error: function(data) {
           alert('An error occured!');
          }
    });
}

Note: How to apply changes on views ajax according to requirement in Drupal 8?

How to Create Custom Block and Render on template in drupal 8?

Here we are discussing simple concept for create custom Block and render on template. Just simple Steps, Please follow this.

1. We have to create folder under "/modules/custom/herobanner".
2. Inside this 'myblock' folder have to create 'info.yml' file like..

Example:
herobanner.info.yml
name: Hero Banner
type: module
description: Homepage hero banner.
core: '8.x'
package: Custom
dependencies:
  - block

 
3. Then we have to create one more folder like "/modules/herobanner/src/Plugin/Block" and create file in this folder with name of "HerobannerBlock.php".

There we will mention "Annotation meta data", that will allow us to identify the Block.
Here "HerobannerBlock" class will contain 4 methods:
build(), blockAccess(), blockForm(), blockSubmit()

4. Now we will start code in "HerobannerBlock.php" file.

<?php

namespace Drupal\herobanner\Plugin\Block;

use Drupal\Core\Access\AccessResult;
use Drupal\Core\Block\BlockBase;
use Drupal\Core\Form\FormStateInterface;
use Drupal\Core\Session\AccountInterface;
use Drupal\Core\Link;

/**
 * Provides a 'Banner' Block
 *
 * @Block(
 *   id = "banner_block",
 *   admin_label = @Translation("Banner block"),
 * )
 */

class HerobannerBlock extends BlockBase {
  /**
   * {@inheritdoc}
   */
  public function build() {
    return [
      '#markup' => $this->t('This is a custom block example.'),
    ];
  }

  /**
   * {@inheritdoc}
   */
  protected function blockAccess(AccountInterface $account) {
    return AccessResult::allowedIfHasPermission($account, 'access content');
  }

  /**
   * {@inheritdoc}
   */
  public function blockForm($form, FormStateInterface $form_state) {
    $config = $this->getConfiguration();

    return $form;
  }

  /**
   * {@inheritdoc}
   */
  public function blockSubmit($form, FormStateInterface $form_state) {
    $this->configuration['herobanner_settings'] = $form_state->getValue('herobanner_settings');
  }
}


Example:
namespace Drupal\herobanner\Plugin\Block;

use Drupal\Core\Access\AccessResult;
use Drupal\Core\Block\BlockBase;
use Drupal\Core\Form\FormStateInterface;
use Drupal\Core\Session\AccountInterface;
use Drupal\Core\Link;

/**
 * Provides a 'Banner' Block
 *
 * @Block(
 *   id = "banner_block",
 *   admin_label = @Translation("Banner block"),
 * )
 */

class HerobannerBlock extends BlockBase {
  /**
   * {@inheritdoc}
   */
  public function build() {
  /**
   * Read homepage_banner_products homepage_hero_banner
   */
    $query = \Drupal::entityQuery('taxonomy_term');
    $query->condition('vid', "homepage_banner_products");   
    $query->sort('weight','ASC');
    $tids = $query->execute();
       
    $homepage_banner_products_terms = \Drupal\taxonomy\Entity\Term::loadMultiple($tids);
    $i=0;
    $product_slider = '';
    foreach ($homepage_banner_products_terms as $term) {   
                
        $product_image_path = $term->field_image->entity->getFileUri();   
        $img_url = file_create_url($product_image_path);
        $product_image = $term->get('field_image')->getValue();
        $prdct_alt = $product_image[0]['alt'];
        $new_window = $term->get('field_open_in_new_window')->getValue();
        $target = (isset($new_window[0]) && $new_window[0]['value'] == 1)?'target="_blank"':'';               
       
        $enddate = $term->get('field_end_date')->getValue();       
       
        $curdate = date('Y-m-d');
        if($enddate >= $curdate){
        $active_class = ($i == 0)?'active':'';       
          
            $product_slider.='<div class="item '.$active_class.'">
                                <div class="item-inner">
                                    <h2>'.$term->name->value.'</h2>
                                    <div class="productthumb"><img src="'.$img_url.'" alt="'.$prdct_alt.'"></div>
                                    '.$term->description->value.'
                                    <a href="'.$term->field_title->value.'" '.$target.' class="linkBtn mdhbanner">'.$term->field_support_option_title->value.'<span class="icon-icon_link"></span></a>
                                </div>
                            </div>';       
       
            $i++;   
           
        }
    }
   
    $html = '<div class="arc-container layer-3 layer" data-depth=".5" data-type="parallax">
            <div class="arc-circle">
                <div class="featuredproduct">
                    <div class="pop-scroll-outer">
                        <div class="pop-scroll">
                            <div class="slidercontrol">
                                <a type="button" class="slick-prev slickbutton carousel-control" href="javascript:void(0)">
                                    <span class="icon-icon_link icon-flip" href="#myCarousel" data-slide="prev"></span>
                                </a>
                                <strong>Featured Products</strong> <span class="num"></span>
                                <a type="button" class="slick-next slickbutton carousel-control" href="javascript:void(0)">
                                    <span class="icon-icon_link" href="#myCarousel" data-slide="next"></span>
                                </a>

                            </div>

                            <div id="myCarousel" class="carousel slide" data-ride="carousel" data-interval="false">
                                <div class="carousel-inner">
                                    '.$product_slider.'
                                </div>
                            </div>
                        </div>

                    </div>
                    <!--Featured Product-->
                </div>
            </div>
        </div>
    </div>';
   
    return array(
      '#markup' => $this->t($html),
    );
  }
}

?>

Now we have to install and Enable our module and then clear the cache.

Place Block

Choose Block

And Pass the 'id' of your Block in this function..

Syntax: {{ drupal_block('myblock_id') }}

Example: {{ drupal_block('banner_block') }}

After this clear the cache and get the result.


Note: If have any suggestions or issue regarding 'How to Create Custom Block and Render on template in drupal 8?' then you can ask by comments.