Perdida de información en Flujo MVC & ANGULARJS


#1

Buenas tardes,
Esperando alguien me pueda apoyar, estoy tratando de crear un formulario con un jqx-grid de angular en mvc, el detalle que tengo es que cuando doy clic en el botón para extraer la información los parámetros que toma de la vista que son de una caja de texto y un combo de pierden, esos dato los requiero para mandarlo a un web services, pero cuando llega la parte del web service se pierden los dato en el flujo del MVC,
la siguiente es mi vista:

@model AngularDemo.Models.xxx

@{
ViewBag.Title = “Index”;
}

@section scripts{

<!-- CSS -->
<link href="~/jqwidgets/styles/jqx.base.css" rel="stylesheet" />
<!-- JS -->
<script src="~/Scripts/angular.min.js"></script>
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/jqwidgets/jqxcore.js"></script>
<script src="~/jqwidgets/jqxdata.js"></script>
<script src="~/jqwidgets/jqxbuttons.js"></script>
<script src="~/jqwidgets/jqxcheckbox.js"></script>
<script src="~/jqwidgets/jqxgrid.js"></script>
<script src="~/jqwidgets/jqxgrid.selection.js"></script>
<script src="~/jqwidgets/jqxmenu.js"></script>
<script src="~/jqwidgets/jqxscrollbar.js"></script>
<script src="~/jqwidgets/jqxgrid.sort.js"></script>
<script src="~/jqwidgets/jqxgrid.columnsresize.js"></script>
<script src="~/jqwidgets/jqxangular.js"></script>
<script src="~/jqwidgets/jqxgrid.pager.js"></script>
<script src="~/jqwidgets/jqxdata.js"></script>
<script src="~/jqwidgets/jqxDropDownList.js"></script>
<script src="~/jqwidgets/jqxlistbox.js"></script>
<script src="~/Scripts/demos.js"></script>

<script type="text/javascript">

var app = angular.module('myApp', ['jqwidgets']);
  

app.controller('GridCtrl', function ($scope, $http) {
    //alert("PRUEBAS");
    $scope.createWidget = false;
    $http({

        method: 'GET',
        url: 'GetCustomers',
    }).success(function (data, status) {
        //alert("Entra-> ");
        // prepare the data
        var source = {
            datatype: "json",
            datafields: [
                { name: 'xx', type: 'decimal' },
                { name: 'xx', type: 'date' },
                { name: 'xx', type: 'date' },
                { name: 'xx', type: 'date' },
                { name: 'xxx', type: 'decimal' },
                { name: 'xxx', type: 'decimal' },
                { name: 'xxx', type: 'string' },
                { name: 'xxx', type: 'string' },
                {name: 'xx', type: 'decimal'}
            ],
            id: 'id',
            localdata: data
        };
   
        var dataAdapter = new $.jqx.dataAdapter(source);
        $scope.gridSettings =
        {
            width: 1150,
            source: dataAdapter,
            sortable: true,
            pagerheight: 50, //Sets the footer height.
            pagesize: 3,
            pagermode: 'simple',
            theme: theme,
            autoheight: true,
            pageable: true,
            columnsresize: true,
            columns: [
                { text: 'xxx', datafield: 'xx', width: 50 },
                { text: 'Nombre del Trabajador', datafield: 'nombre', width: 250 },
                { text: 'xxx', datafield: 'xx', width: 250  },
                { text: 'xxx', datafield: 'xx', width: 250 },
                { text: 'xxxxInicio de Vacaciones', datafield: 'fe_inivaca', width: 250 },
                { text: 'xxxTermino de Vacaciones', datafield: 'fe_termvaca', width: 250 },
                { text: 'xxx', datafield: 'xx', width: 250 },
                { text: 'xxx', datafield: 'xx', width: 250 },
                { text: 'xxx', datafield: 'xx', width: 250, }
            ]

        };
        //now create the widget.
        $scope.createWidget = true;

    }).error(function (data, status) {

        console.log('Something Wrong');
        alert("Error al traer los registros para el datagrid.");
    });
});
</script>

}

AngularJS Grid Binding To JSON

@using (Html.BeginForm()) {
TEST

RPE: @Html.TextBoxFor(x => x.rpe)

GERENCIA: @Html.DropDownListFor(x => x.gerencia, new[] { new SelectListItem() {Text = "xxx", Value = "1"}, new SelectListItem() {Text = "xxx", Value = "11"}, new SelectListItem() {Text = "xxx", Value = "3"} }, "Seleccionar Gerencia")

}

lo siguiente es mi controlador:
// GET: Customers
[HttpPost]
public JsonResult GetCustomers(VacationHistory vac)
{

        gerencia = Convert.ToInt32(vac.gerencia);
        xxx= vac.xxx;

        string error = "";
        ServiceReference1.Service1Client obj = new ServiceReference1.Service1Client();
        List<ServiceReference1.CVacationHistory> lst = new List<ServiceReference1.CVacationHistory>(obj.getInformationVacationHistory("xxx", "xxx", xxx, xxx, out error));
        var CustomersList = lst;

        return Json(CustomersList, JsonRequestBehavior.AllowGet);
    }

Y tengo mi modelo, el detalle como lo comento es que en la vista tengo una caja de texto donde pone su id el trabajador y después tengo un combo donde selecciona una opción, esos dos parámetro son los que tengo que recibir en el controlador y mandarlo al webservice que me regresa una lista con la cual lleno el Grid de Angular, no encuentro la forma de conservar lo parámetros en el controlador, tengo el modelo y los paso de primera instancia, lo puedo ver en el debug, pero ya después se vuelve a meter al controlador se pierden los parámetros y no me regresa nada los webservices, lo único que necesito en este momento es mostrar en el Grid la información que me devuelve el webservice, con los parámetros del combo y caja de texto.

De antemano agradezco mucho cualquier ayuda.