0

I have a DataTable on my website that uses server side processing which works as intended. However, I am adding additional search fields that draw from the DataTable and refine the search results for players. So for example, which hand they shoot with, their position, name, etc.

The filter search boxes work just fine for data that I did not alter via the columns settings. In this case, the player name was altered to create an anchor tag using both the first and last name. When I search that table column, the DataTable outputs the following error:

Error

datatables warning: table id=DataTables_Table_0 - exception message mb_strtolower() expects parameter 1 to be string, array given

I've researched the problem but there doesn't seem to be too much documentation on the error. If anyone has any suggestions on how to solve this, it would be greatly appreciated!

Search Box

<div class="form-group row">
    <label for="name" class="col-sm-2 col-form-label">Player</label>
    <div class="col-sm-10">
        {{ Form::text('name', null, array('id' => 'name', 'class' => 'form-control form-control-alternative', 'id' => 'name')) }}
     </div>
</div>

DataTable Controller

  public function playersFilter()
  {
    $cards = DB::table('cards')->leftJoin('players', 'cards.player_id', '=', 'players.id')->leftJoin('teams', 'cards.team_id', '=', 'teams.id')->select('cards.*', 'teams.league', 'teams.abbrv', 'players.first', 'players.last', 'players.handness', 'players.nationality')->where('cards.position', '!=', 'G')->orderBy('cards.overall', 'desc')->get();

    return Datatables::of($cards)->make(true);
  }

JQuery

  <script type="text/javascript">
    $(document).ready(function(){
      var table = $('.players-adv-search').DataTable({
        'processing'  : true,
        'language'    : {
          'loadingRecords': '&nbsp;',
          'processing': '<i class="fa fa-spinner fa-medium fa-fw"></i><span class="loading-text">Loading...</span>'
        },
        'serverSide'  : true,
        'info'        : false,
        'ajax'        : "{{ route('players.filter') }}",
        'columns'     : [
            { "data": null, render: function ( data, type, row ) {
                var type = data.card_type;
                var type_final = type.replace('-', ' ').replace('-', ' ').toLowerCase();

                return type_final.replace(/(^([a-zA-Z\p{M}]))|([ -][a-zA-Z\p{M}])/g,
                function($1){
                    return $1.toUpperCase();
                });
            }},
            { "data": "league", className: 'text-center' },
            { "data": "abbrv", className: 'text-center' },
            { "data": null, render: function ( data, type, row ) {
                // This is the column that corresponds with the search box
                if (type === 'display') {
                  data = '<a href="card/' + data.id + '" target="_blank">' + data.first + ' ' + data.last + '</a>';
                }
                return data;
            }},
            { "data": "position", className: 'text-center' },
            { "data": "player_type", className: 'text-center' },
            { "data": "handness", className: 'text-center' },
            { "data": null, className: 'search-syn text-center', render: function ( data, type, row ) {
                  var synergies = ['NP', 'BL', 'X', 'BM', 'TN', 'DK', 'AD', 'WK', 'WM', 'RS', 'M', '1T', 'TK', 'WC', 'SP', 'FB', '', 'HH'];
                  var syn_ids = data.synergy_ids.split(',');
                  var syn_pts = data.synergy_pts.split(',');
                  var data = '';

                  $.each(syn_ids,function(i){
                    data += synergies[syn_ids[i]-1] + '<span class="search-syn-pts"> [' + syn_pts[i] + ']</span> ';
                  });

                return data;
            }},
            { "data": "overall", className: 'text-center' },
            { "data": "deking", className: 'text-center' },
            { "data": "handeye", className: 'text-center' },
            // .. Additional statistics
        ],
        'lengthChange': false,
        'paging'      : true,
        'pageLength'  : 50,
        'ordering'    : false,
      });

      // Name Search
      // Giving an error
      $('#name').change(function() {
        table.columns(0).search(this.value).draw();
      });

      // League Search
      $('#league').change(function() {
        table.columns(1).search(this.value).draw();
      });

      // Handness Search
      $('#handness').change(function() {
        table.columns(6).search(this.value).draw();
      });
2
  • Can you post your controller for players filter Commented Nov 14, 2019 at 1:33
  • @Poldo I added my controller Commented Nov 14, 2019 at 3:02

1 Answer 1

1

You're getting error because you didn't specify name of your column.

Change this

$(document).ready(function(){
        ...
        'columns'     : [
            { "data": null, render: function ( data, type, row ) {

Add name to this column.

$(document).ready(function(){
            ...
            'columns'     : [
                { "data": null, name:"players.first", render: function ( data, type, row ) {
Sign up to request clarification or add additional context in comments.

4 Comments

I made the changes as you suggested but I'm still receiving the same error I posted above.
@BTW8892 try using players.first or field that corresponds to your search
That worked, I appreciate the help! I always seem to pass over the minor details like that haha
@BTW8892 glad to help

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.