KoolReport's Forum

Official Support Area, Q&As, Discussions, Suggestions and Bug reports.
Forum's Guidelines

How to use Visual query builder in laravel? #2501

Closed Anjali opened this topic on on Dec 17, 2021 - 7 comments

Anjali commented on Dec 17, 2021

I have added visual query builder same as shown in example but on submit it shows errror not query is displayed in same page. As we have define <form method="post" > but how we are going to handle that post? PLease suggest

The POST method is not supported for this route. Supported methods: GET, HEAD.

I have added route for display querybuilder.

Route::get('/querybuilder', [QueryBuilderController::class, 'index'])
    ->name('querybuilder');

In Controller File to run visual query builder:

 $queryBuilder = new MyReport();
        $queryBuilder->run();
        return view("querybuilder.index", ["queryBuilder" => $queryBuilder]);
Sebastian Morales commented on Dec 20, 2021

The error said that POST method is not added so pls add the following route command:

Route::post('/querybuilder', [QueryBuilderController::class, 'index']) // add support for post method beside get one
    ->name('querybuilder');

If there's still any eror let us know. Tks,

Anjali commented on Dec 20, 2021

Yes it is still not working. When i add same with different name it redirects to blank page and says Page expired. there is no action method handled in form.

Sebastian Morales commented on Dec 21, 2021

Pls replace your view page with a simple string like "Hello world" to see if it can show that correctly.

Anjali commented on Dec 21, 2021

THis is my view file. It is working so i can see query builder get rendered but while submit selected query it redirects to blank page

@section('content')
<div class="container">
    {!! $queryBuilder->render() !!}
</div>

@endsection
Anjali commented on Dec 21, 2021

Please check my whole code.

query.php

<?php

namespace App\visualquerysample;
//Step 1: Load KoolReport
class vquery extends \koolreport\KoolReport
{
    use \koolreport\visualquery\Bindable;

    use \koolreport\visualquery\Bindable;

    public function defineSchemas()
    {
        return [
            "salesSchema" => array(
                "tables" => [
                    "customers" => array(
                        "{meta}" => [
                            "alias" => "Table Customers"
                        ],
                        "customerNumber" => array(
                            "alias" => "Customer Number",
                        ),
                        "customerName" => array(
                            "alias" => "Customer Name",
                        ),
                    ),
                    "orders" => array(
                        "{meta}" => [
                            "alias" => "Table Orders"
                        ],
                        "orderNumber" => array(
                            "alias" => "Order Number"
                        ),
                        "orderDay" => array(
                            "alias" => "Order Day",
                            "expression" => "date(orderDate)",
                            "type" => "date",
                        ),
                        "orderDate" => array(
                            "alias" => "Order Date",
                            "type" => "datetime"
                        ),
                        "orderMonth" => [
                            "expression" => "month(orderDate)",
                        ]
                        // "customerNumber"=>array(
                        //    "alias"=>"Customer Number"
                        // )
                    ),
                    "orderdetails" => array(
                        "{meta}" => [
                            "alias" => "Order Details"
                        ],
                        // "orderNumber"=>array(
                        //     "alias"=>"Order Number"
                        // ),
                        "quantityOrdered" => array(
                            "alias" => "Quantity",
                            "type" => "number",
                        ),
                        "priceEach" => array(
                            "alias" => "Price Each",
                            "type" => "number",
                            "decimal" => 2,
                            "prefix" => "$",
                        ),
                        // "productCode"=>array(
                        //     "alias"=>"Product Code"
                        // ),
                        "cost" => [
                            // "expression" => "orderdetails.quantityOrdered * orderdetails.priceEach",
                            "expression" => "quantityOrdered * priceEach",
                            "alias" => "Cost",
                            "type" => "number",
                            "decimal" => 2,
                            "prefix" => "$",
                        ]
                    ),
                    "products" => array(
                        "{meta}" => [
                            "alias" => "Table Products"
                        ],
                        "productCode" => array(
                            "alias" => "Product Code"
                        ),
                        "productName" => array(
                            "alias" => "Product Name"
                        ),
                    )
                ],
                "relations" => [
                    ["orders.customerNumber", "leftjoin", "customers.customerNumber"],
                    ["orders.orderNumber", "join", "orderdetails.orderNumber"],
                    ["orderdetails.productCode", "leftjoin", "products.productCode"],
                ]
            ),
            "separator" => ".",
        ];
    }

    use \koolreport\laravel\Friendship;
    protected function setup()
    {
        $params = \koolreport\core\Utility::get($this->queryParams, 'visualquery1');
        $qb = $this->paramsToQueryBuilder($params);
        $this->queryStr = $params ? $qb->toMySQL() : "select * from customers where 1=0";
        $this->paramQuery = $params ? $qb->toMySQL(['useSQLParams' => "name"]) : "select * from customers where 1=0";
        $this->sqlParams = $qb->getSQLParams();

        $this
            ->src('mysql')
            ->query($this->paramQuery)
            ->params($this->sqlParams)
            ->pipe(new \koolreport\processes\ColumnMeta([
                "Order Number" => [
                    "type" => "string"
                ],
                "orderMonth" => [
                    "type" => "string"
                ],
            ]))
            ->pipe($this->dataStore('vqDS'));
    }
}

query.view.php

<?php

use \koolreport\visualQuery\VisualQuery;
use \koolreport\datagrid\DataTables;
?>
<form method="post" action="/querybuilder">
    <div class=" report-content">
        <div class="text-center">
            <h1>VisualQuery</h1>
            <p class="lead">
                The basic working of VisualQuery
            </p>
        </div>

        <?php

        \koolreport\visualquery\VisualQuery::create(array(
            "name" => "visualquery1",
            "themeBase" => "bs4",
            "schema" => "salesSchema",
            "defaultValue" => [
                "selectDistinct" => false,
                "selectTables" => [
                    "orders",
                    "orderdetails",
                    "products",
                ],
                "selectFields" => [
                    "products.productName",
                ],
                "filters" => [
                    "(",
                    [
                        "field" => "orders.orderDay",
                        "operator" => ">",
                        "value1" => "2001-01-01",
                        "value2" => "",
                        "logic" => "and",
                        "toggle" => true,
                    ],
                    [
                        "field" => "products.productCode",
                        "operator" => "nbtw",
                        "value1" => "2",
                        "value2" => "998",
                        "logic" => "or",
                        "toggle" => true,
                    ],
                    ["products.productName", "<>", "a", "", "or", "toggle" => false],
                    ["products.productName", "nin", "a,b,c", "", "or"],
                    ["products.productName", "ctn", "a", "", "or"],
                    ")",
                ],
                "groups" => [
                    [
                        "field" => "orderdetails.cost",
                        "aggregate" => "sum",
                        "toggle" => true
                    ]
                ],
                "havings" => [
                    "(",
                    [
                        "field" => "sum(orderdetails.cost)",
                        "operator" => ">",
                        "value1" => "10000",
                        "value2" => "",
                        "logic" => "and",
                        "toggle" => true,
                    ],
                    ["products.productName", "<>", "a", "", "or", "toggle" => false],
                    ")",
                ],
                "sorts" => [
                    [
                        "field" => "sum(orderdetails.cost)",
                        "direction" => "desc",
                        "toggle" => true
                    ],
                    ["products.productName", "desc", "toggle" => false]
                ],
                "limit" => [
                    "offset" => 5,
                    "limit" => 10,
                    "toggle" => false,
                ]
            ],
            "activeTab" => "filters",
        ));
        ?>

        <button type='submit' class='btn btn-light'>Submit</button>

        <style>
        pre {
            overflow-x: auto;
            white-space: pre-wrap;
            white-space: -moz-pre-wrap;
            white-space: -pre-wrap;
            white-space: -o-pre-wrap;
            word-wrap: break-word;
        }
        </style>
        <div style="margin: 30px; width:800px">
            <b>Select query:</b>
            <pre style="width:800px"><?php echo $this->queryStr; ?></pre>
            <b>Query with parameters:</b>
            <pre style="width:800px"><?php echo $this->paramQuery; ?></pre>
            <b>Parameters:</b>
            <?php \koolreport\core\Utility::prettyPrint($this->sqlParams); ?>
        </div>

        <?php
        // print_r($this->dataStore('vqDS')->meta());
        DataTables::create(array(
            "name" => "charttable1",
            "dataSource" => $this->dataStore('vqDS'),
            // "columns" => ["Quantity", "Product Name"],
            "options" => [
                "paging" => true
            ]
        ));
        ?>
    </div>
</form>

and from controller ` public function index()

{
    $queryBuilder = new vquery();
    $queryBuilder->run();
    return view("querybuilder.index", ["queryBuilder" => $queryBuilder]);
}

and route:

Route::get('/querybuilder', [QueryBuilderController::class, 'index'])
        ->name('querybuilder');
    Route::post('/querybuilder', [QueryBuilderController::class, 'index'])
        ->name('querybuilder1');
Sebastian Morales commented on Dec 21, 2021

Pls try adding csrf token to your form. Without it a page expired response could be returned by Laravel. Let us know the result. Tks,

Anjali commented on Dec 21, 2021

Yes it works.

Build Your Excellent Data Report

Let KoolReport help you to make great reports. It's free & open-source released under MIT license.

Download KoolReport View demo
help needed

VisualQuery