jQuery Grid Plugin - jqGrid

I have the following grid, with the search option enabled, but when I open the search dialog, and click on search button, nothing happens. What and Where should I modify it to work?

    <script type = "text/javascript">
        jQuery(document).ready(function() {
            $("#grid").jqGrid(
        {
            datatype: function() {
                $.ajax(
                {
                    url: "OrdenDeProduccion.aspx/GetOrdenDeProduccion", //PageMethod

                    data: "{'pPageSize':'" + $('#grid').getGridParam("rowNum") +
                    "','pCurrentPage':'" + $('#grid').getGridParam("page") +
                    "','pSortColumn':'" + $('#grid').getGridParam("sortname") +
                    "','pSortOrder':'" + $('#grid').getGridParam("sortorder") + "'}", //PageMethod Parametros de entrada

                    dataType: "json",
                    type: "post",
                    contentType: "application/json; charset=utf-8",
                    complete: function(jsondata, stat) {
                        if (stat == "success")
                            jQuery("#grid")[0].addJSONData(JSON.parse(jsondata.responseText).d);
                        else
                            alert("Error al traer los datos desde json");
                    }
                });
            },
            jsonReader: //Set the jsonReader to the JQGridJSonResponse squema to bind the data.
            {
            root: "Items",
            page: "CurrentPage",
            total: "PageCount",
            records: "RecordCount",
            repeatitems: true,
            cell: "Row",
            id: "Id"
        },
        colModel: //Columns
        [
            { index: 'Id', name: 'Id', width: 10, align: 'Left', label: 'Id', hidden: true },
            { index: 'Fechaentrada', name: 'Fechaentrada', align: 'Center', label: 'Fecha', width: 200},
            { index: 'Horaentrada', name: 'Horaentrada', align: 'Center', label: 'Hora', width: 200 },
            { index: 'Razonsocial', name: 'Razonsocial', align: 'Center', label: 'Cliente', width:200 },
            { index: 'Producto', name: 'Producto', align: 'Center', label: 'Producto', width:200 },
            { index: 'Cantidad', name: 'Cantidad', align: 'Center', label: 'Cantidad', width: 200 },
            { index: 'Simbolo', name: 'Simbolo', align: 'Center', label: 'Simbolo', width:200 },
            { index: 'Precio', name: 'Precio', align: 'Center', label: 'Precio', width: 200 },
            { index: 'Ancho', name: 'Ancho', align: 'Center', label: 'Ancho m.', width: 200 },
            { index: 'Largo', name: 'Largo', align: 'Center', label: 'Largo m.', width: 200 },
            { index: 'Superficie', name: 'Superficie', align: 'Center', label: 'mt2', width: 200 },
        ],
        viewsortcols: true,
        caption: "Tabla de Orden de Producción",
        loadtext: 'Cargando datos...',
        emptyrecords: 'No hay resultados',
        rowNum: 10, // PageSize.
        rownumbers: true,
        rownumWidth: 15,
        gridview: true,
        pager: "#pager", //Pager.
        //sortname: 'Razonsocial',
        viewrecords: true,
        sortorder: "asc",
        width: "760",
        height: "260"
    }).navGrid("#pager", { edit: false, add: false, search: true, del: false });
});

Regards!