I could not send values to the jtable for asp.net mvc core 3.0

[malpertorun]

Hi everyone, i need help to about get values to the jtable. I'm using asp.net core mvc 3.0 I examined the samples in jtable sites, i have not any databases. I wanted to work without database this project. And my democontroller is like this.

           try{  List<Customers> load = new List<Customers>();

            load.Add(new Customers

            {
                CustomerID = 5,
                CompanyName = "sadsd",
                ContactName = "sffasfsa",
                Address = "falösddddddddddddd",
                City = "safex",
                ContactTitle = "faskoö3414",
                Country = "ökdfsf",
                Fax = "ölföelwga",
                Phone = "053034035034",
                PostalCode = "34534",
                Region = "eokrkt"
            }

         );

            return Json(new { Result = "OK", Records = load });
        }
        catch (Exception)
        {
            throw;
        }

i have customers model and i added all properties in index.cshtml. when i run the project and go table page, i seeining jtable without values but it give me error. i looked on browser for find the error, then i saw jquery error. Error is; "box = elem.getBoundingClientRect();" in jquery-1.10-2.js file. I could not get values in list. what can i do? please help.

<!--Adding Theme for jTable Grid-->
<!--You can choose any type of theme from the themes folder-->
<link href="~/Content/bootstrap.css" rel="stylesheet" />
<link href="~/Scripts/jtable/themes/metro/green/jtable.min.css" rel="stylesheet" />
<link href="~/jquery-ui-1.12.1.custom/jquery-ui-1.12.1.custom/jquery-ui.min.css" rel="stylesheet" />
<!--Adding jquery Plugin-->
<script src="~/Scripts/jquery-1.10.2.js"></script>
<script src="~/Scripts/jquery-ui-1.9.2.min.js"></script>
<!--Adding jTable Plugin-->
<script src="~/Scripts/jtable/jquery.jtable.min.js"></script>

<!-- Import CSS file for validation engine (in Head section of HTML) -->
<link href="~/Scripts/validationEngine/validationEngine.jquery.css" rel="stylesheet" type="text/css" />

<!-- Import Javascript files for validation engine (in Head section of HTML) -->
<script type="text/javascript" src="~/Scripts/validationEngine/jquery.validationEngine.js"></script>
<script type="text/javascript" src="~/Scripts/validationEngine/jquery.validationEngine-en.js"></script>
<style>

    div.content-container div.padded-content-container {
        padding: 6px;
    }

    div.filtering {
        border: 1px solid #999;
        margin-bottom: 5px;
        padding: 10px;
        background-color: #EEE;
    }
</style>

<script>
    $(document).ready(function () {
        $('#CustomerTableContainer').jtable({
            title: 'Customers',
            paging: false,

            actions:
            {
                listAction: '/Demo/GetCustomers',
                createAction: '/Demo/CreateCustomer',
                updateAction: '/Demo/EditCustomer',
                deleteAction: '/Demo/DeleteCustomer'
            },
            fields: {
                CustomerID: {
                    key: true,
                    list: false
                },
                CompanyName: {
                    title: 'Company Name',
                    width: '25%'
                },
                ContactName: {
                    title: 'ContactName',
                    width: '20%'
                },
                ContactTitle: {
                    title: 'ContactTitle',
                    width: '20%'
                },
                City: {
                    title: 'City',
                    width: '10%'
                },
                PostalCode: {
                    title: 'PostalCode',
                    width: '10%'
                },
                Country: {
                    title: 'Country',
                    width: '20%'
                },
                Phone: {
                    title: 'Phone',
                    width: '20%'
                }
            },
            //Initialize validation logic when a form is created
            formCreated: function (event, data) {
                data.form.find('input[name="CompanyName"]').addClass('validate[required]');
                data.form.find('input[name="ContactName"]').addClass('validate[required]');
                data.form.find('input[name="ContactTitle"]').addClass('validate[required]');
                data.form.find('input[name="City"]').addClass('validate[required]');
                data.form.find('input[name="PostalCode"]').addClass('validate[required]');
                data.form.find('input[name="Country"]').addClass('validate[required]');
                data.form.find('input[name="Phone"]').addClass('validate[required]');
                data.form.validationEngine();
            },
            //Validate form when it is being submitted
            formSubmitting: function (event, data) {
                return data.form.validationEngine('validate');
            },
            //Dispose validation logic when form is closed
            formClosed: function (event, data) {
                data.form.validationEngine('hide');
                data.form.validationEngine('detach');
            }
        });

        //Load Customer data from server
        $('#CustomerTableContainer').jtable('load');
    });

</script>

[malpertorun]

I solved this problem. if someone else encounters this error. Shold add serializer configure service in startup. (for asp.net core mvc 3.0) Firstly install "Microsoft.AspNetCore.Mvc.NewtonsoftJson" library on nuget packages.. add the code below.

services.AddControllers() .AddNewtonsoftJson(options => { options.SerializerSettings.ContractResolver = new DefaultContractResolver(); });

[misterparsons]

Glad you solved your Microsoft problem, I could never help with that. You do not need the formCreated event function as coded. The field option inputClass will apply the any validation classes you declare on the input field.