1

ドロップダウンで選択した値に基づいて結果をフィルタリングしようとしています。すべてのフィルタリングとすべてが機能しています。ビューを結果で更新するのに苦労しています。いくつかの括弧やその他の無関係なコードを省略しています。これが私が持っているものです:

public ViewResult Index()
{    
     -- this effectively returns all Invoices no matter what date --
     var data = new UserBAL().GetInvoice(date);
     return View(data);                 
}

私のJqueryとAjaxは次のとおりです。

 $(document).ready(function () {
     $("[name='DDLItems']").change(function () {
         var selection = $("[name='DDLItems']").val();
         var dataToSend = {
             //variable to hold selection?
             idDate: selection
         };

         $.ajax({
             type: "POST",
             url: "Invoice/FilterInvoice",
             data: dataToSend,
             success: function (data) {   
                $("#Index").html(data);                     
             }

[HttpPost]                     // Selected DDL value 
public ActionResult FilterInvoice(int idDate)
{       
     switch (idDate)
    { 
        case 0:
             date = DateTime.Parse("01-01-1754");
             break;

        case 3:
             date = DateTime.Now.AddMonths(-12);
             break;
     }
     //var data is returning my expected results 
     var data = new UserBAL().GetInvoice(date);

    // I know this isn't right and needs to be changed 
     return View(data);

私のajax成功関数も何もしていないので、これには微調整が必​​要だと思います。また、テーブルタグを使用してテーブルを表示する方法を次に示します。一部のコードを省略しましたが、重要なものはすべてここにあります。唯一の問題は、フィルター処理された結果をビューにレンダリングすることです。

  @foreach (var item in Model) {
  <tr><td>   
    @Html.DisplayFor(modelItem => item.Invoice_Number)        
    @Html.DisplayFor(modelItem => item.Amt_Total)
</td>
4

2 に答える 2

1

ビューを渡す代わりに、部分ビューを文字列として返すことができます。その後、jquery を使用して ajax の成功で結果を更新できます。

コントローラ ロジック:

[HttpPost]
public JsonResult FilterInvoice(int idDate)
{     
 .....  
 return Json((RenderRazorViewToString("YourViewName", data)), JsonRequestBehavior.AllowGet);
}


    [NonAction]
    public string RenderRazorViewToString(string viewName, object model)
    {
        ViewData.Model = model;
        using (var sw = new StringWriter())
        {
            var viewResult = ViewEngines.Engines.FindPartialView(ControllerContext, viewName);
            var viewContext = new ViewContext(ControllerContext, viewResult.View, ViewData, TempData, sw);
            viewResult.View.Render(viewContext, sw);
            viewResult.ViewEngine.ReleaseView(ControllerContext, viewResult.View);
            return sw.GetStringBuilder().ToString();
        }
    }

Ajax 呼び出し:

    $.ajax({
    //........
    success: function (result) {
        $("#Index").replaceWith(result);
    }
});
于 2013-09-16T17:23:45.593 に答える
0

他の誰かがこれに出くわした場合の答えは次のとおりです。これが私がやったことです。行は、関数の URL に渡す日付パラメーターに渡されてフィルター処理されます。Ajax 呼び出し内で Grid を設定することも問題のように思えたので、それを取り除く必要がありました。

 public JsonResult JqGrid(int idDate)
    {
         switch (idDate)

         #region switch date
            --Switch Statement--
        #endregion
        var invoices = new UserBAL().GetInvoice(date);

        return Json(invoices, JsonRequestBehavior.AllowGet);
    }

    [HttpPost]  // pretty much does nothing, used as a middle man for ajax call 
    public JsonResult JqGridz(int idDate)
    {
        switch (idDate)
        #region switch date

          --Switch Statement--
        #endregion

        var invoices = new UserBAL().GetInvoice(date);

        return Json(invoices, JsonRequestBehavior.AllowGet);
    }

はい、これら2つの機能は非常に冗長に見えますが、実際にはそうです。投稿がデータを更新しない理由はわかりませんが、毎回グリッドをリロードする必要があり、それを行うと最初の関数が呼び出されました。そうそう、ポストjqGridzは単なる仲介者のようなものです。

これが私が使用したjqueryコードです

var dropdown
var Url = '/Invoice/JqGrid/?idDate=0'  
         $(document).ready(function () {

$("#jqgrid").jqGrid({ 
    url: Url,
    datatype: 'json',
    mtype: 'GET', //insert data from the data object we created above 
    width: 500,  
    colNames: ['ID','Invoice #', 'Total Amount', 'Amount Due', 'Amount Paid', 'Due Date'], //define column names
    colModel: [
    { name: 'InvoiceID', index: 'Invoice_Number', key: true, hidden: true, width: 50, align: 'left' },
    { name: 'Invoice_Number', index: 'Invoice_Number', width: 50,  align: 'left'},
    { name: 'Amt_Total', index: 'Amt_Total', width: 50, align: 'left' },
    { name: 'Amt_Due', index: 'Amt_Due', width: 50, align: 'left' },
    { name: 'Amt_Paid', index: 'Amt_Paid', width: 50, align: 'left' },
    { name: 'Due_Date', index: 'Due_Date', formatter: "date", formatoptions: { "srcformat": "Y-m-d", newformat: "m/d/Y" }, width: 50, align: 'left' },

    ],                     
    pager: jQuery('#pager'), 
    sortname: 'Invoice_Number',  
    viewrecords: false, 
    editable: true,
    sortorder: "asc",  
    caption: "Invoices",       
});
$("[name='DDLItems']").change(function () {
    var selection = $(this).val();
     dropdown = {
        //holds selected value 
        idDate: selection
    };

    $.ajax({

        type: "POST",
        url: "Invoice/JqGridz",
        data: dropdown,
        async: false,
        cache: false,
        success: function (data) {         
            $("#jqgrid").setGridParam({ url: Url + selection})               
             $("#jqgrid").trigger('reloadGrid');
        }
    })      

  })
});
于 2013-09-20T19:42:47.880 に答える