We can start with the database table. It could look like
CREATE TABLE dbo.OrderStatus (
Id int IDENTITY NOT NULL,
Name nvarchar(100) NOT NULL,
CONSTRAINT PK_LT_OrderStatus PRIMARY KEY CLUSTERED (Id),
CONSTRAINT UC_LT_OrderStatus_Name UNIQUE NONCLUSTERED (Name)
)
It allows to address any Item of such OrderStatus table by Id or by Name. The UNIQUE CONSTRAINT don't permit to add name duplicates. Another table Order can have column
CREATE TABLE dbo.Order (
Id int IDENTITY NOT NULL,
OrderStatusId int NOT NULL,
...
)
ALTER TABLE dbo.Order WITH CHECK ADD CONSTRAINT FK_Order_OrderStatus
FOREIGN KEY(OrderStatusId) REFERENCES dbo.OrderStatus (Id)
During filling the grid with the data you have two main options: using OrderStatusId in the data or the usage of the corresponding Name from dbo.OrderStatus:
SELECT Id,OrderStatusId, ... FROM dbo.Order
or
SELECT Id,os.Name AS OrderStatus, ...
FROM dbo.Order AS o
INNER JOIN dbo.OrderStatus AS os ON os.Id=o.OrderStatusId
If you decide to fill the grid with ids (OrderStatusId values) then you will have to use formatter: "select" to display the text in the corresponding column (see here). It required that you would have to have editoptions.value filled with all different values from dbo.OrderStatus. The best way to implement this would be to extend the response from the server for filling the grid with your custom data and to use beforeProcessing to set editoptions.value. I described the scenario in the answer. I'll remind you it below.
Let us the response from the server looks like
{
"rows": [{...}, {...}]
}
If the returned data looks just like
[{...}, {...}]
then you should include the wrapping. I suggest that you made
SELECT Id,Name FROM dbo.OrderStatus
additionally to making the main select from dbo.Order (SELECT * FROM dbo.Order) and you place both results in the server response:
{
"orderStatus": [{"id":1, "name":"Pending"}, ...],
"rows": [{...}, {...}]
}
To process orderStatus you need to add the following beforeProcessing, which read orderStatus and set editoptions.value of the orderStatus column of the grid:
beforeProcessing: function (response) {
var $self = $(this), orderStatus = response.orderStatus, i, values = "";
if (orderStatus != null && orderStatus.length > 0) {
for (i = 0; i < orderStatus.length; i++) {
if (values.length > 0) {
values += ";";
}
values += orderStatus[i].id + ":" + orderStatus[i].name;
}
$self.jqGrid("setColProp", "orderStatus", {
editoptions {
value: values
}
});
if (this.ftoolbar) { // filter toolbar exist
$self.jqGrid("destroyFilterToolbar");
$self.jqGrid("filterToolbar");
}
}
}
The above code is not tested, but I hope that the main idea should be clear from it.