You can see that the entire view consists of the header, the jqg table and the jqg-pager block for displaying the navigation bar. The rest is occupied by the script for initiating the grid, the navigation bar and the dialog box for editing records.

    It is important to configure the model properties correctly in order to display the grid properly, position input items on the edit form, configure validation for input forms and configure the sorting and search options. This configuration is not simple and has a lot of parameters. In the comments I have tried to describe the parameters being used. The full description of the model parameters can be found in the documentation for the jqGrid library in the ColModel API section.

    1. case "edit":
    2. params.url = '@Url.Action("Edit")';
    3. break;
    4. case "del":
    5. postdata.CUSTOMER_ID = selectedRow;
    6. break;

    The working page with the list of customers will look like this:

    fbdevgd30 mvc 012 en

    Figure 40. A customer selected for editing