Month: December 2014

What is the Json ?

ChandradevLeave a comment

Hi

I am the huge fan of Ajax. I want to do maximum task in client side only using Ajax and Jquery. If you have to do maximum task using ajax then you have to expose the data as JSON format  from Server.

There are so many ways to expose data as Json from Asp.net application like using ASMX webservice,WCF web service,ASHX Generic Handler,WCF Data Service, and MVC Controller action.

I am writing the article series on this all topic. My topic will be like this.

1. Brief introduction of Json.

I had already posted article on this topic on C# corner site
What is the Json

2. How to Expose Json in Asp.net.

3. How to do Insert/Update/delete operation using Json and asp.net MVC Web API.

4. How to do Insert/Update/delete operation using Json and asp.net Webservice.

5. How to do Insert/Update/delete operation using Json and WCF.

6. How to do Insert/Update/delete operation using Json and using Asp.net HTTP handler.

 

Advertisement

How to implement jquery accordion in asp.net MVC

Chandradev2 Comments

AccordianJqery

It is very straight forward to implement jquery accordion in asp.net MVC. If we have to implement any jquery UI widgets in asp.net mvc  there will be no need to do any extra work. This is the cool features of asp.net MVC.

Lets check with one simple  asp.net MVC 4  application.

Step1: Create one blank asp.net mvc  application.

Step2: Download the Jquery and Jquery UI libray fron Nuget Package Manager in the application.

Step 3: Create the Home controller  like this


using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace MvcApplication8.Controllers
{
    public class HomeController : Controller
    {
        //
        // GET: /Home/

        public ActionResult Index()
        {
            return View();
        }

    }
}

Step 4: Create the Index view and implement Jquery and style sheet like this Code snippet


@{
    ViewBag.Title = "Index";
}

<script src="~/Scripts/jquery-2.1.1.min.js"></script>
<script src="~/Scripts/jquery-ui-1.11.2.min.js"></script>
<link href="~/Content/themes/base/all.css" rel="stylesheet" />
<link href="~/Content/themes/base/accordion.css" rel="stylesheet" />
<link href="~/Content/demos.css" rel="stylesheet" />

<script type="text/javascript">
    $(function () {
        $("#accordion").accordion();
    });
</script>

<div class="demo">
<div id="accordion">
  <h3>This is the Title1</h3>
  <div>
    <p>
    Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
    ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
    amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
    odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
    </p>
  </div>
  <h3>This is the Title2</h3>
  <div>
    <p>
    Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet
    purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor
    velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In
    suscipit faucibus urna.
    </p>
  </div>
  
</div>

</div>

Summary: Here i donot have done any exatra work to implement this functionality so asp.net MVC is very user friedly with Jquery UI Library. This is one of the good features of asp.net MVC.

How to overload the Action Method in asp.net MVC ?

ChandradevLeave a comment

If we have to overload the action Method in asp.net MVC then we can not do it directly like C#. We have to implement some trick like changing the ActionName like this code snippet.


using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace MvcApplication5.Controllers
{
    public class HomeController : Controller
    {
       

        public ActionResult GetEmpName()
        {
            return Content("This is the test Message");
        }

        [ActionName("GetEmpWithCode")]
        public ActionResult GetEmpName(string EmpCode)
        {
            return Content("This is the test Messagewith Overloaded");
        }

    }
}

Now to run the above controller GetEmpName action method with just give the URL like this

http://localhost:49389/Home/GetEmpName

Overload1

Now to run the above controller GetEmpWithCode action method with just give the URL like this

http://localhost:49389/Home/GetEmpWithCode

Overload2