Search code examples
c#webasp.net-mvc-4devexpresspivot-grid

DevExpress PivotGrid controls on modal don't work, loading bar pops up all the time and doesn't disappear at ASP.NET MVC


I need to open a button triggered popup in a project with asp.net mvc. I send a parameter with Ajax and set the partial view to the body of the modal. Data comes in, pivot grid is created, but pivot grid events do not work. When I click on pagination or sorting on the pivot grid on the popup, the text "Loading" and it never disappears. Am I doing something missing somewhere. I called the AdjustControl method when it showed the popup, but it didn't work. It ate a lot of my time and I still couldn't find a solution. I request your support.

enter image description here

Button

<button type="button" class="btn btn-sm btn-block btn-primary" data-toggle="modal" data-target="#modalView" onclick="RetrieveStokMiktari('@Url.Action("RetrieveStokMiktari", "AnaBayi")')">
                        <i class="fas fa-list"></i> Stok Miktarını Getir
</button>

Ajax call with param

  function RetrieveStokMiktari(url) {
        debugger;
        var token = $('input[name="__RequestVerificationToken"]').val();
        var kaliteId = $('#kaliteDropdown').val();
        var kaliteAdi = $('#kaliteDropdown').find(':selected').text();
        var obj = { kaliteId: kaliteId, kaliteAdi: kaliteAdi };
        AjaxCall(url,
                obj,
                "GET")
            .done(
                function (data) {
                    $("#modalView .modal-body").html(data);
                    $("#modalView .modal-dialog");
                    $("#modalView .modal-title").text('Shipment Files');
                    $("#modalView").modal("show");
                    $("#modalView").on("shown.bs.modal", function () { PivotGrid1.AdjustControl(); });
                }).fail(function (error) {
                    alert(error.StatusText);
                    toastr.error("Hata : " + error.StatusText, "Hata");
                });
    }

Customised ajax method

 function AjaxCall(url, data, type) {
        return $.ajax({
            url: url,
            type: type ? type : 'GET',
            data: data,
            contentType: 'application/json'
        });
    }

ASP.NET MVC Controller and Action

public ActionResult RetrieveStokMiktari(int kaliteId, string kaliteAdi)
    {
        try
        {
            IEnumerable<HrkHaliStok> list = new List<HrkHaliStok>();
            if (Session["Username"] != null)
            {
                UserTnmKullaniciViewModel user = (UserTnmKullaniciViewModel)Session["Username"];
                string filtre = FiltreOku(kaliteId, Convert.ToInt32(user.FIR_ID));
                using (MrnSiparisEntities mrnSiparisEntities = new MrnSiparisEntities())
                {
                    string sql = " SELECT KALITE, EBAT, DESEN, RENK, ISNULL(SUM(MIKTAR), 0) AS MIKTAR " +
                                 " FROM HRK_HALI_STOK " +
                                 " WHERE (KALITE = @kaliteAdi) " + filtre +
                                 " GROUP BY KALITE, EBAT, DESEN, RENK ";

                    list = mrnSiparisEntities.Database.SqlQuery<HrkHaliStok>(sql, new SqlParameter("@kaliteAdi", kaliteAdi)).ToList();
                }
            }

            return PartialView("StokMiktarBilgisi", list);
        }
        catch (Exception e)
        {
            Console.WriteLine(e);
            throw;
        }
    }

PartialView

@using System.Web.UI.WebControls
@model IEnumerable<MerinosWebSiparis.Models.HrkHaliStok>

@{
 Layout = null;
}

@Html.DevExpress().PivotGrid(settings =>
{
settings.Name = "PivotGrid1";


settings.OptionsCustomization.AllowDrag = true;
settings.OptionsView.ShowFilterHeaders = true;
settings.Width = Unit.Percentage(100);
settings.Fields.Add(field =>
{
    field.Area = PivotArea.RowArea;
    field.FieldName = "KALITE";
    field.Caption = "KALITE";
});
settings.Fields.Add(field =>
{
    field.Area = PivotArea.RowArea;
    field.FieldName = "DESEN";
    field.Caption = "DESEN";
});
settings.Fields.Add(field =>
{
    field.Area = PivotArea.RowArea;
    field.FieldName = "RENK";
    field.Caption = "RENK";
});
settings.Fields.Add(field =>
{
    field.Area = PivotArea.DataArea;
    field.FieldName = "MIKTAR";
    field.Caption = "MIKTAR";
});
settings.Fields.Add(field =>
{
    field.Area = PivotArea.ColumnArea;
    field.FieldName = "EBAT";
    field.Caption = "EBAT";
});
}).Bind(Model).GetHtml()

@Html.DevExpress().GetScripts(  
new Script { ExtensionSuite = ExtensionSuite.Editors },  
new Script { ExtensionSuite = ExtensionSuite.GridView },  
new Script { ExtensionSuite = ExtensionSuite.NavigationAndLayout }  
)  

@Html.DevExpress().GetStyleSheets(  
new StyleSheet { ExtensionSuite = ExtensionSuite.Editors },  
new StyleSheet { ExtensionSuite = ExtensionSuite.GridView },  
new StyleSheet { ExtensionSuite = ExtensionSuite.NavigationAndLayout }  
)  

Solution

  • Solved. I used DevExtreme dxPivotGrid. It solved my problem. this is the Link that helped me;