Jqgrid how to get selected value from a dropdown cell on save click

See more:

jQuery

JQGrid

I configure JQGrid and configure dropdown list in the JQGrid but while saving i am not able to find selected value not text but iam getting only selected text i am not able to find selected value.
this is jq Grid's colModel:

name: 'InvoiceFormatID', width: 10, search: false, label: 'Invoice Format', align: "center", editable: true, edittype: "select",
editoptions: {value: getAllSelectOptions()}

function getAllSelectOptions() {
var states = {
'3': 'PDF', '4': 'Excel'
};
return states;
}


on Save click i am calling below function

this.buildInvoiceFormatAndTemplateModel = function (invoiceFormatAndTemplate) {

var rows = invoiceFormatAndTemplate.jqGrid('getDataIDs');
var viewModel = "[";
for (i = 0; i < rows.length; i++) {
var rowData = invoiceFormatAndTemplate.jqGrid('getRowData', rows[i]);
var val = rowData;
if (i > 0)
viewModel += ",";
//This is the unlucky one
var vm = "{\"InvoiceFormatID\": \"" + val["InvoiceFormatID"] + "\",\"InvoiceTemplateID\":\"" + val["InvoiceTemplateID"] + "\" }";
viewModel += vm;
}

viewModel += "]";
return viewModel;
};

What I have tried:

I tried to capture selected value as {formatId:3,InvoiceTemplateID:5}