Custom blocks give jquery error, ajax filtering not working

Posted in: Newspaper
Post count: 15

Hello,

I have followed the tutorial here –

https://forum.tagdiv.com/practical-example-how-to-add-a-new-block-and-module/

To add new blocks and modules to the site. However on these new blocks the ajax filtering does not work and throws an error! It also stops images bellow the block from loading.

If I comment out this line in the code the lazy load works but no filtering –

$buffy .= $this->get_pull_down_filter();

I have tracked it down to this function always returning as zero –

get_td_pull_down_items

What can I do to get the ajax filtering to work on custom block modules?

This is my full block code –

<?php
// v3 - for wp_010

class td_block_27 extends td_block {

function render($atts, $content = null) {
parent::render($atts); // sets the live atts, $this->atts, $this->block_uid, $this->td_query (it runs the query)

$buffy = ''; //output buffer

//get the js for this block
$buffy .= $this->get_block_js();

$buffy .= '<div class="' . $this->get_block_classes() . '">';

//get the block title
$buffy .= $this->get_block_title();

//get the sub category filter for this block
//$buffy .= $this->get_pull_down_filter();

$buffy .= '<div id=' . $this->block_uid . ' class="td_block_inner">';
$buffy .= $this->inner($this->td_query->posts); //inner content of the block
$buffy .= '</div>';

//get the ajax pagination for this block
$buffy .= $this->get_block_pagination();
$buffy .= '</div> <!-- ./block -->';
return $buffy;
}

function inner($posts, $td_column_number = '') {

$buffy = '';

$td_block_layout = new td_block_layout();
if (empty($td_column_number)) {
$td_column_number = td_global::vc_get_column_number(); // get the column width of the block from the page builder API
}
$td_post_count = 0; // the number of posts rendered
$td_current_column = 1; //the current columng
$td_column_number = 1;
if (!empty($posts)) {
foreach ($posts as $post) {
$td_module_27 = new td_module_27($post);

switch ($td_column_number) {

case '1': //one column layout
$buffy .= $td_block_layout->open12(); //added in 010 theme - span 12 doesn't use rows
$buffy .= $td_module_27->render($post);
$buffy .= $td_block_layout->close12();
break;

case '2': //two column layout
$buffy .= $td_block_layout->open_row();

$buffy .= $td_block_layout->open6();
$buffy .= $td_module_27->render($post);
$buffy .= $td_block_layout->close6();

if ($td_current_column == 2) {
$buffy .= $td_block_layout->close_row();
}

break;

case '3': //three column layout
$buffy .= $td_block_layout->open_row();

$buffy .= $td_block_layout->open4();
$buffy .= $td_module_27->render($post);
$buffy .= $td_block_layout->close4();

if ($td_current_column == 3) {
$buffy .= $td_block_layout->close_row();
}

break;
}

//current column
if ($td_current_column == $td_column_number) {
$td_current_column = 1;
} else {
$td_current_column++;
}

$td_post_count++;
}
}
$buffy .= $td_block_layout->close_all_tags();
return $buffy;
}

/**
* renders the filter of the block
* @return string
*/
function get_pull_down_filter() {
$buffy = '';

$td_pull_down_items = $this->get_td_pull_down_items();
if (empty($td_pull_down_items)) {
return '';
}

//generate unique id for this pull down filter control
$pull_down_wrapper_id = "td_pulldown_" . $this->get_block_uid();

// wrapper
$buffy .= '<div class="td-pulldown-syle-default td-subcat-filter" id="' . $pull_down_wrapper_id . '">';

// subcategory list
$buffy .= '<ul class="td-subcat-list" id="' . $pull_down_wrapper_id . '_list">';
foreach ($td_pull_down_items as $item) {
$buffy .= '<li class="td-subcat-item">get_block_uid() . '" href="#">' . $item['name'] . '';
}
$buffy .= '';

// subcategory dropdown list
$buffy .= '<div class="td-subcat-dropdown">';
$buffy .= '<div class="td-subcat-more" aria-haspopup="true"><span>' . __td('More', TD_THEME_NAME) . '</span><i class="td-icon-read-down"></i></div>';

// the dropdown list
$buffy .= '<ul class="td-pulldown-filter-list">';

$buffy .= '';

$buffy .= '</div>';
$buffy .= '</div>';

return $buffy;
}

}

Thanks!

Post count: 20688

Hi,

Try entering this code like shown in the screenshot, in your custom block file
https://www.screencast.com/t/l0EPhsy5UHo

Thanks

Post count: 15

Hiya Simion,

Unfortunately this line of code still crashes the page –

$buffy .= $this->get_pull_down_filter();

Do you have any ideas?

Many thanks!

Post count: 15

I think it is because the module has no association with these functions –

get_td_pull_down_items
get_pull_down_filter

Which are part of the file in wp_booster

td_block_template.php

I see that some other modules have the association like –

class td_block_77 extends<strong> td_block_template</strong>

But when I use this is crashed the page too.

What do I do? 😀

Post count: 20688

Hi,

If you installed the example plugin provided in that tutorial, and made the modification like in the screenshot, it should work properly. Add the code exactly as shown, and do not make any other modifications in the block php file.
By default it looks like this
https://www.screencast.com/t/eooCHzeR
Enter the code as shown

$buffy .= '<div class="td-block-title-wrap">';
$buffy .= '</div>';

https://www.screencast.com/t/O4UFs8I7AW8
It should work if you add the code correctly
https://www.screencast.com/t/lbwI2sDGlL

Thanks

Post count: 15

But my friend is does not work for me, thebestprogrammerintheworld. I get this error –

Uncaught item.container_jquery_obj is more or less than one: 0
tagdiv_theme.min.js:301 Uncaught TypeError: Cannot read property 'length' of undefined
at Object._lazy_callback_resize_500 (tagdiv_theme.min.js:301)
at tagdiv_theme.min.js:305

Post count: 15

My friend it now works! I just did what you said two messages ago on a fresh install!

Thankyou,

Viewing 7 posts - 1 through 7 (of 7 total)
The forum ‘Newspaper’ is closed to new topics and replies.