Send Chart.js as HTML and then render via ajax

Question

I would like to know if it will be possible to send HTML (containing multiple charts) via an AJAX method and then render them. I don't seem to have much luck and I can't find much online doing it with this approach. I would appreciate any input.

Here is my AJAX function:

  $.ajax({
      url: "/admin/expensereport/getgraphs",
      type: 'GET',
      data: { dateFrom: $("#dateFrom").val(), dateTo:$("#dateTo").val(),
      expenseBuildingType: $("input[name='expenseBuildingType']:checked").val(),
      expenseScheduledType: $("input[name='expenseScheduledType']:checked").val()},
      cache: false,
      success: function(data) {
        $('#graphsDiv').html(data);
      },

Here is my PHP Laravel function with one of 3 graphs included:

$chartCategories = app()->chartjs
                  ->name('chartCategories')
                  ->type('pie')
                  ->size(['width' => 400, 'height' => 200])
                  ->labels(['Label x', 'Label y'])
                  ->datasets([
                      [
                          'backgroundColor' => ['#FF6384', '#36A2EB'],
                          'hoverBackgroundColor' => ['#FF6384', '#36A2EB'],
                          'data' => [69, 59]
                      ]
                  ])
                  ->options([]);


          $view = View::make('partials.CPM.expensereportgraphs', [
                'chartCategories' => $chartCategories,
            ]);

Here is an extract of my view:

<div class="col-md-6">
    <h4>Top 10 Categories</h4>
    {!! $chartCategories->render() !!}
  </div>

Charl van Staden · Accepted Answer · 2018-09-09 10:37:09Z

1

I managed to solve the problem by taking another route. I created the charts in the html page file and then sent the data via AJAX. I suppose this method is actually much better.

answered Sep 9, 2018 at 10:37

Charl van Staden

232 silver badges6 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Send Chart.js as HTML and then render via ajax

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related