ASP.NET MVC scenario, similar to 'Post your answer' on StackOverflow

Question

Hello,

I have a requirement to add commenting system to a page (similar to 'Post your answer' at the bottom of any SO question). What is the optimal way to implement this? Should I render the partial view with Ajax or should I just pass the Json data to server? In the latter case I don't quite get how I should add newly added comment to the bottom of existing comments.

I'm very very new to ASP.NET MVC, and don't quite feel solid with ajax patterns. Also, I heard, that the pillar of unobtrusive JavaScript is that your page should be first developed w/out JavaScript and be fully functional and only after that developer should add JavaScript and enhance the experience. Is this generally true and is this true in above particular case?

Thank you.

PS. I'm using jQuery.

Answer 1

Watch Phil Haack's presentation for PDC, where he builds HaackOverflow :)

Get the video here: http://channel9.msdn.com/pdc2008/PC21/

He demonstrates using the built-in AJAX functionality to submit a question, and have it automatically added to the bottom of the existing questions.

Answer 2

I typically would use JSON as my AJAX data type. JSON (JavaScript Object Notation) it works much like XML but it uses about 70% less data. You will also find it easier to parse in your javascript. You don't have to initialize date/number objects from xml!

{ "people": [
  { "firstName": "Brett", "lastName":"McLaughlin", "email": "[email protected]" },
  { "firstName": "Jason", "lastName":"Hunter", "email": "[email protected]" },
  { "firstName": "Elliotte", "lastName":"Harold", "email": "[email protected]" }
]}

Thanks IBM For The Example

<people>
  <person>
    <firstName>Brett</firstName>
    <lastName>McLaughlin</lastName>
    <email>[email protected]</email >
  </person>
  <person>
    <firstName>Jason</firstName>
    <lastName>Hunter</lastName>
    <email>[email protected]</email >
  </person>
  <person>
    <firstName>Elliotte</firstName>
    <lastName>Harold</lastName>
    <email>[email protected]</email >
  </person>
</people >

I have found the MVC JSON framework has some shortfalls, in regards to Serialization, De serialization, & Ignore Member Attributes. I have found Json.NET project on codeplex. it seams to fill all the functionality gaps that MVC JSON doesn't cover.

So in your controller, i am using Json.NET, please note that the output is ContentResult and it Does Not have a View

 public ContentResult ProcessRequestAction(string Email, string Password)
 {
     Product product = new Product();
     product.Name = "Apple";
     product.Expiry = new DateTime(2008, 12, 28);
     product.Price = 3.99M;
     product.Sizes = new string[] { "Small", "Medium", "Large" };
     return Content(JavaScriptConvert.SerializeObject(product));
 }

Typical JQuery Code, for JSON request

      $.ajax({
            type: "POST", /* GET OR POST */
            url: "JSON_MVC_URL_HERE", /* your url here */
            dataType: "json", /* json or xml */
            data: null, /* JSON CODE HERE TO SET GET OR POST BACK PARAMS */
            success: function(data){
                alert(data.Name); /* Gets Name Element */
                alert(data.Expiry); /* Gets Expiry Element */
                alert(data.Price); /* Gets Price Element */
                jQuery.each(data.Sizes, function() { /* Get Each Size */
                    alert(this);
                });
            }
        });

$.getJSON also works but lacks http request type POST/GET

Answer 3

in response to the 2nd paragraph:

yes, i'd suggest developing the app without any ajax/js of any sort. make sure the actions work and function correctly. then add the ajax (for UX) later. this approach may also lend itself to inspiring you about how to have the app fall back to the non-ajax method for non-js-enabled users (like mobile phones)

Answer 4

Use disqus: http://www.disqus.com