Invalid JSON Response due to custom wordpress shortcode

I’ve encountered a problem with a custom shortcode i created, which just outputs a table via PHP-Echo.

This shortcode just serves as a search form and posts the data to another site. Everytime i insert the shortcode in a wp-site and update it, i get “Invalid JSON-Response”.

I’ve tried some troubleshooting and found out that:

The problem just persists with that one shortcode, another custom created shortcode does not error at all. So i guess the problem really “just” lies within the shortcodes-function.

<?php

    function function_name() {
        require( WP_PLUGIN_DIR.'/<dir>/assets/runtime/shortcode/function_name/form.php' );
        global $wpdb;
        $filter = $_POST['filter'];
    
        $job_table_name = '<tableName>';
    
        // Check if the Job-Table has Entries
        if ( $wpdb->get_var( 'SELECT * FROM '.$job_table_name ) == null OR $filter == null ) {
            exit;
        }
    
        // Run The Query With Selected Filter
        $query = 'SELECT id, column1, column2, column3 FROM '.$job_table_name." WHERE column1 LIKE '%$filter%' OR id LIKE '$filter'";
        // echo $query;
        $results = $wpdb->get_results( $query, ARRAY_A );
        //echo var_dump( $results );
    
        // Display The Jobs From The Result Set
        echo '<table>';
        echo '<tr>';
        echo '<th> column1</th>';
        echo '<th> column2</th>';
        echo '<th> column3</th>';
        foreach ( $results as $result ) {
            echo '<tr>';
            // echo "<td><a href=.site_url().'/displayjobs?id=".$result['column1'].'>'.$result['column2'].'</a></td>';
            ?>
            <td>
            <a href = '<?php echo site_url()?>/displayjobs?id=<?php echo $result["id"]?>'><?php echo $result['column1']?></a></td>
            <?php
            echo '<td>'.$result['column2'].'</td>';
            echo '<td>'.$result['column3'].'</td>';
        }
        echo '</table>';
    }

?>

Here’s the form i’m rendering:

<form method='POST'>
  <input type='text' name='filter' placeholder='someval ...'/>
  <input type='submit' value='someval ...'/>
</form>

Any ideas on why it fails?

Answer

I think i’ve solved the problem myself:

1. I’ve removed the exit-PHP-Call, which ends the script when the condition is met.
2. I’ve added ob_start() and ob_get_clean() to the script

Since I’ve done that, there are no errors anymore and the plugin can be displayed just fine.

<?php

function function_name() {
    global $wpdb;
    $job_table_name = 'someval';
    $num_rows = $wpdb->get_results( 'SELECT COUNT(*) as num_rows FROM '.$job_table_name );
    $filter = $_POST['filter'];

    ob_start();
    require( WP_PLUGIN_DIR.'/someval/assets/runtime/shortcode/form.html' );
    // return ob_get_clean();

    if ( $filter == '' ) {
        $filter = '*';
    }

    // Check if the Job-Table has Entries
    // if ( $wpdb->get_var( 'SELECT * FROM '.$job_table_name ) ) {
    // }

    // Run The Query With Selected Filter
    $query = 'SELECT id, column1, column2, column3 FROM '.$job_table_name." WHERE column2 LIKE '%$filter%' OR id LIKE '$filter'";
    // echo $query;
    $results = $wpdb->get_results( $query, ARRAY_A );
    //echo var_dump( $results );

    // Display The Jobs From The Result Set
    if ( $filter != '' ) {
        // echo 'FILTER: '.$filter;

        echo '<table>';
        echo '<tr>';
        echo '<th> column1 </th>';
        echo '<th> column2 </th>';
        echo '<th> column3 </th>';

        foreach ( $results as $result ) {
            echo '<tr>';
            // echo "<td><a href=.site_url().'/somelink?id=".$result['column1'].'>'.$result['column2'].'</a></td>';
            ?>
            <td>
            <a href = '<?php echo site_url()?>/displayjobs?id=<?php echo $result["coilumn1"]?>'><?php echo $result['column2']?></a></td>
            <?php
            echo '<td>'.$result['column3'].'</td>';
            echo '<td>'.$result['column4'].'</td>';
        }
    }

    echo '</table>';
    return ob_get_clean();
}

?>