Achei um exemplo no stackoverflow em inglês e adaptei a minha necessidade e está funcinando.
var url = "/Representantes/Cliente/listapelodao";
$(document).ready(function () {
var representante = $("#sessaoRepresentante").val();
if ($("#sessaoRepresentante").val() != "0") {
$("#representante").prop("disabled", true);
CarregaVendedores(representante)
}
var vendedor = $("#sessaoVendedor").val();
var nome = $("#nome").val();
CarregaRepresentante(representante);
var $table = $("#jqGrid");
$table.jqGrid({
url: url,
datatype: 'json',
mtype: 'GET',
postData: {
representante: function () { return jQuery("#representante option:selected").val(); },
vendedor: function () { return jQuery("#vendedor option:selected").val(); },
nome: function () { return jQuery("#nome").val(); }
},
colModel: [
{ label: 'RECNO', name: 'RECNO', width: 80 },
{ label: 'Cliente', name: 'CLIENTE', width: 80 },
{ label: 'Loja', name: 'A1_LOJA', width: 80 },
{ label: 'Nome', name: 'A1_NOME', width: 350 },
{ label: 'CNPJ', name: 'A1_CGC', width: 120 },
{ label: 'Municipio', name: 'A1_MUN', width: 150 },
{ label: 'Telefone', name: 'A1_TEL', width: 80 },
],
viewrecords: true,
rowNum: 20,
rowList: [20, 40, 100],
//height: "auto",
height: 400,
emptyrecords: "Nenhum Recurso",
loadtext: "Buscando e carregando...",
rowNum: 20,
pager: "#jqGridPager",
loadonce: true
});
$('select#representante').on("change", function () {
var id = $("#representante").val();
$("#nome").val('');
CarregaVendedores(id)
//$table.trigger('reloadGrid');
$("#jqGrid").setGridParam({ datatype: 'json', page: 1 }).trigger('reloadGrid');
});
$('select#vendedor').on("change", function () {
//$table.trigger('reloadGrid');
$("#nome").val('');
$("#jqGrid").setGridParam({ datatype: 'json', page: 1 }).trigger('reloadGrid');
});
const inputEle = document.getElementById('nome');
inputEle.addEventListener('keyup', function (e) {
var key = e.which || e.keyCode;
if (key == 13) { // codigo da tecla enter
nome = this.value;
$("#jqGrid").setGridParam({ datatype: 'json', page: 1 }).trigger('reloadGrid');
}
});
function CarregaRepresentante(representante) {
$.ajax({
url: "/Gerenciamento/UsuarioExterno/SelecionarRepresentante",
async: false,
success: function (data) {
$("#representante").empty();
if (representante == 0) {
$("#representante").append('<option value="" disabled selected hidden>Selecione...</option>');
}
$.each(data, function (i, element) {
if (representante > 0) {
if (representante == element.codigoRepresentante) {
$("#representante").append('<option value=' + element.codigoRepresentante + ' selected >' + element.nome + '</option>');
}
}
$("#representante").append('<option value=' + element.codigoRepresentante + '>' + element.nome + '</option>');
});
}
});
}
function CarregaVendedores(representante) {
$.ajax({
url: "/Gerenciamento/UsuarioExterno/SelecionarVendedores",
data: { representante: representante },
async: false,
success: function (data) {
$("#vendedor").empty();
$("#vendedor").append('<option value="0" disabled selected hidden>Selecione...</option>');
$.each(data, function (i, element) {
$("#vendedor").append('<option value=' + element.codigoVendedor + '>' + element.nomeVendedor + '</option>');
});
}
});
}
});