How to show jqgrid columns as dropdown?

Question

enter image description here

 $(function () {
 "use strict";
 $("#grid1").jqGrid({
 
 colModel: 
 name: "name", label: "Client", width: 53, editable: true, ellediting: true },
 {
 name: "invdate", label: "Date", width: 75, align: "center", orttype: date",
 formatter: "date", formatoptions: { newformat: "d-M-Y" }
 },
 {
 name: "amount", label: "Amount", width: 65, editable: true, ormatter: 'currency',
 formatoptions: { prefix: '$' }
 },
 {
 name: "State", label: "State", width: 41, editable: true, ellediting: true, edittype: "select",
 formatter: 'select', editoptions: {
 value: {
 1: 'Approve',
 2: 'Reject'
 }
 }
 },

The code I've written creates a dropdown for the 'State' field with 'Approve' and 'Reject' values. However, the dropdown doesn't show up initially; it only appears when I click on the cell.

Answer 1

The way you use it is for cell editing, which is lunched when you click on cell.

To do what you want you will need to edit all cell after the data is loaded or provide your own html content and save the selection.

Just as idea you can look similar approach for inline edit here