We have a view, myview
, that has an exposed filter title
(text input). The view has Exposed form in block:Yes
and so we load it onto the page under admin/structure/block
. The block has a machine name of exposedform_myview_title
.
We want to remove it from display and only load the view block on click of an icon. How come my view block is not loading when using ajax?
View Setup:
- view_name = ‘myview`
- when creating view, view page setting -> “create a page” was set to true
- view machine name =
mypage
- view
use ajax
= Yes - view block (displayed using admin/structure/block) machine name
exposedform_myview
Error message
https://somesite/path/views/ajax?view_name=myview&view_block_id=mypage 404 (not found)
myjs.js
This will load the view itself and not the exposedform_myview_title
block. We want the exposedform_myview_title
to be displayed.
(function($) { 'use strict'; Drupal.behaviors.iconClick = { attach: function(context, setting) { $('#someid', context).once().each(function () { $(this).on('click', function(clickEvent) { // Use Ajax to load form. $.ajax({ url: drupalSettings.path.baseUrl + 'views/ajax', type: 'GET', // type: 'POST' not succesfull dataType: 'json', data: 'view_name=myview&view_display_id=mypage', //not successfull --> data: 'view_name=myview&view_block_id=exposedform_myview', success: function(response) { var output = response[1].data; $('.some-element').html(output); }, error: function(data) { alert('error'); console.log(data); } }); }); }); } }; })(jQuery);
page.html.twig
... <div id="someid">my icon goes here</div> <div class="some-element"> view block exposed form should go here </div> ...
we also tried to use Drupal.ajax
, but that did not load the View into the required <div class="some-element">
(function($) { 'use strict'; Drupal.behaviors.iconClick = { attach: function(context, setting) { $('#someid', context).once().each(function () { $(this).on('click', function(clickEvent) { // Use Ajax to load form. var ajaxPath = '/views/ajax'; var view_info = { view_name: 'myview', view_display_id: 'page' }; var ajax_settings = { submit: view_info, url: ajaxPath, event: 'click' }; Drupal.ajax(ajax_settings); }); }); } }; })(jQuery);