Skip to content

Load info after save and select option #1437

@persianlionn

Description

@persianlionn

Hi
I am using jsgrid in wordpress. I have three problems.
1- The saving is done well, but after clicking on the save icon, the information is not loaded and the page must be refreshed.
2- I have a select tag named type that I don't know how to show it as selected. It means that what is stored in the database will be displayed in this selector.
3- The select tag does not display anything by default. Although I have used selectedIndex. It is clear in the picture below.
scrnli_5_6_2024_10-06-36 AM

<script>
    jQuery(document).ready(function ($) {
        var products = [
            
            ID); ?>
            {
                "ID": "ID ?>",
                "ProductName": "get_name(); ?>",
                "Price": "get_regular_price();?>",
                "Discount": "get_sale_price(); ?>",
            },
            
        ];
        var type = [{
            Id: id ?>,
            Name: "name ?>"
        },];
        $("#jsGrid").jsGrid({
            width: "100%",
            height: "400px",
            inserting: false,
            editing: true,
            sorting: true,
            paging: true,
            data: products,
            fields: [
                {
                    title: "",
                    name: "ID",
                    type: "number",
                    width: 80,
                    validate: "required",
                    sorter: "number",
                    align: "center",
                    readOnly: true
                },
                {
                    title: "",
                    name: "ProductName",
                    type: "text",
                    width: 400,
                    validate: "required"
                },
                {
                    title: "",
                    name: "Price",
                    type: "text",
                    width: 150,
                    validate: "required",
                    align: "center",
                },
                {
                    title: "",
                    name: "Type",
                    type: "select",
                    items: type,
                    width: 150,
                    valueField: "Id",
                    textField: "Name",
                    selectedIndex: 0,
                    valueType: "number|string",
                    validate: "required",
                },
                {
                    title: "",
                    name: "Discount",
                    type: "text",
                    width: 80,
                    validate: "required",
                    align: "center",
                },
                {type: 'control', deleteButton: false,}
            ],
            controller: {
                loadData: function (filter) {
                    return $.ajax({
                        type: "GET",
                        dataType: "json",
                        url: "",
                        data: filter,
                    });
                },

                //insertItem: function (item) {
                //    return $.ajax({
                //        type: "POST",
                //        dataType: "json",
                //        url: "//",
                //        data: item
                //    });
                //},

                updateItem: function (item) {
                    return $.ajax({
                        type: "POST",
                        url: "",
                        cache: false,
                        data: {
                            action: 'save_product_info',
                            ID: item['ID'],
                            ProductName: item['ProductName'],
                            Price: item['Price'],
                            Discount: item['Discount'],
                            Type: item['Type'],
                        },
                    });
                },
            }
        });
    });
</script>

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions