Question

I am using the following Action in my controller and I’m,trying to display the number of rooms in a jq.grid;

  public JsonResult Incercare() 
    {
        DBContext.Current.Open();
        var data = new
    {
        Title="Total",
        Rezervari = Reservation.SelectByReservationDate(5).FirstOrDefault().NumarRezervari   
    };
        var result = new JsonResult(){Data = data,JsonRequestBehavior =JsonRequestBehavior.AllowGet};
        return result;
     }

Here is my view:

    @model LicentaTest.Models.Reservation

    @{
    ViewBag.Title = "Incercare";
    }

    <script type="text/javascript">
    $(function () {
    var requestUrl = '@Url.Action("Incercare","Grafice")';

    $("#cartResults").jqGrid({

        url: requestUrl,
        datatype:'json',
        mtype: 'GET',
        emptyrecords: "No results",
        colNames: ['Title','Rezervari'],
        colModel: [
                        { name: "Title", width: 350, editable: false, searchoptions: {}, index: "Title" },
                        { name: "Rezervari", width: 100, editable: false, searchoptions: {}, index: "Rezervari"}
                        ],
        pager: $('#cartPager'),
        rowList: [],        // disable page size dropdown
        pgbuttons: false,     // disable page control like next, back button
        viewrecords: false,    // disable current view record text like 'View 1-10 of 100' 
        sortname: 'id',
        sortorder: 'asc',
        loadonce: false,
        sortable: true,
        scrollrows: true,
        height: 300,
        pgtext: null,
        hoverrows: false,
        footerrow: true,
        userDataOnFooter: true,
        emptyDataText: "Your Cart is Empty"
        
         });
        });
       </script>
       <div class="styler">
       <fieldset class="ui-widget">
       <legend class="ui-state-legend-default ui-corner-top ui-corner-bottom">Review Your Cart  </legend>
       <div id="update-message-disp" class="ui-state-highlight ui-corner-all" style="margin-top: 20px; padding: 0 .7em;width: 500px">
        <p><span class="ui-icon ui-icon-info" style="float: left; margin-right: .3em;">     </span><strong>Cart modified</strong><br />
        </p>
        </div>
        <br />
        <table id="cartResults">
        </table>
        <div id="cartPager">
        </div>
         </fieldset>
        </div>

But instead of getting something like this:

I get this:

What am I doing wrong?

Answer 1

It’s because of the fact that in your controller you return a JsonResult that renders json object to the view.
Instead you should return ViewResult or PartialViewResult and make sure you pass to it the object as an argument.