Column Title not showing as designed

Question

ShieldUI v 1.7.36 NP

URL: http://hccm.org/gala_signup_list.php

Code

HTML:

<div class="about-bottom">
    <div class="col-md-12 about-left">
        <div id="grid"></div>
    </div>
</div>

Javascript:

$(document).ready(function() {
    $('#return_btn').click(function() {
        window.location = 'gala.php';
    })
    plgrid = $("#grid").shieldGrid({
    dataSource: {
        remote: {
            read: {
                url: "api/GetGalaSignupList",
                dataType: "json",
                xhrFields: {
                    withCredentials: false
                }
            }
        },
        noRecordsText: "There are no Registrants",
        columns: [
            {field:'registrant_name', title: "Registrant Name", width: "30%"},
            {field: 'registrant_email', title: "Email", width: "30%"},
            {field: 'registrant_phone', title: "Phone"},
            {field: 'registrant_mail', title: "Address", width: "30%"},
            {field: 'table_name', title: "Table Name", width: "20%"},
            {field: 'numtix', title: "Num Tix", width: "20%"}
        ]
        }
    });
    plgrid.show();
});

Data, <snip> data can be seen at URL

[
   {
      "registrant_name":"Jeff Seiler",
      "registrant_email":"<snip>",
      "registrant_phone":"<snip>",
      "registrant_mail":"507 Las Colinas",
      "ticket_type":"Individual",
      "table_name":"Mr and Mrs Jeff Seiler",
      "numtix":"2"
   },
   {
      "registrant_name":"Jan Halstead",
      "registrant_email":"<snip>",
      "registrant_phone":"<snip>",
      "registrant_mail":"115 Mason Oaks",
      "ticket_type":"Individual",
      "table_name":"",
      "numtix":"1"
   }
]

But it isn't showing the title based on the title attributes, it shows only JSON column names. What am I doing wrong to cause this? I can change my JSON but am wondering why the title attribute isn't working.

Answer 1

I see you are reading data remotely from an url, I think you should define a schema of the fields used in the datasource. You can check here how they are defined. You should point the path and data type.

https://www.shieldui.com/documentation/datasource/javascript/api/settings/schema/fields

I suspect the cause of not showing the titles is that you have not defined field schema.