Render Partial View using Jquery Ajax with variable data

Question

I have already read this post, but I am not sure know to make it work taking data from the user. Here is the ajax jquery I am using. I know (or at least think) that this cant render a partial. But it works all the way until the render fails. I thought it may be helpful to have.

 $.ajax(
     {
         type: 'POST',
         contentType: 'application/json; charset=utf-8',
         data: "{'test':" + "'" + dateText + "'}",
         dataType: 'json',
         url: 'Site/Grab/',
         success: function (result) {
         alert('Success');
         },

         error: function (error) {
            alert('Fail');
         }
      });

Here is my controller

[HttpPost]
    public ActionResult Grab(string test)
    {
        DateTime lineDate= Convert.ToDateTime(test);
        List<Info> myInfo= GameCache.Data(lineDate);
       return PartialView("_PartialView", myInfo);
    }

If it works until it tries rendering the partial, the problem is most likely in the partial view's markup. Please provide that code, as well as the error you're receiving. — StriplingWarrior
– StriplingWarrior, Commented Jun 15, 2011 at 2:25

RPM1984 · Accepted Answer · 2011-06-15 02:34:36Z

18

Okay, couple of things to try:

1) dataType is the expected result of the ajax call. In your case, your sending JSON, but receiving HTML. The content-type parameter specifies the request, which you have (and what you have is correct). So the data type should be:

dataType: 'html',

2) You need to serialize the JSON. Try grabbing the lightweight JSON library and stringify'ing:

var test = { test: 'testvalue' };
$.ajax {
   ...
   data: JSON.stringify(test),
   ...
});

Much easier than trying to coerce a JSON string with quoatations. Create a regular JS variable, then stringify it.

The rest of your code looks fine.

If it's a problem with the HTML/markup of the partial view itself, run in debug mode and Visual Studio should stop on the line in the markup that is causing the problem.

Bonus Hint: ASP.NET MVC 3 includes built-in JSON model binding. So you can create a basic POCO that matches the fields of your JSON object, then accept it as a strongly-typed object in the action method:

[HttpPost]
public ActionResult Grab(MyJsonObject obj) 
{
   DateTime lineDate= Convert.ToDateTime(obj.test);
   List<Info> myInfo= GameCache.Data(lineDate);
   return PartialView("_PartialView", myInfo);
}

Since your only sending one parameter, it's overkill - but if you have more than 2 then it's worthwhile using a JSON POCO.

edited Jun 15, 2011 at 2:34

answered Jun 15, 2011 at 2:28

RPM1984

73.3k62 gold badges241 silver badges364 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

dan_vitch Over a year ago

when I switched data data type to html is repaired the problem.

Jehof · Accepted Answer · 2012-01-05 11:07:03Z

3

Change your controller code to:

public ActionResult Grab(string test) {
  DateTime lineDate= Convert.ToDateTime(test);
  List<Info> myInfo= GameCache.Data(lineDate);

  return Json(new { data = this.RenderPartialViewToString("_PartialView", myInfo) });
}

edited Jan 5, 2012 at 11:07

Jehof

35.7k11 gold badges128 silver badges156 bronze badges

answered Jan 5, 2012 at 10:34

Rashid Hussain Siddiqui

411 bronze badge

2 Comments

Muneer Over a year ago

where the "RenderPartialViewToString()" method exists?

Marc Over a year ago

Here c-sharpcorner.com/blogs/7150/… or here craftycodeblog.com/2010/05/15/…

Collectives™ on Stack Overflow

Render Partial View using Jquery Ajax with variable data

2 Answers 2

1 Comment

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related