Training in Asp.net mvc3 platform-apextgi,noida

ASP.NET MVC 3.NET Framework

Apex T. G. India Pvt. Ltd

Jquery 1.7JavaScript Framework

Validation

Interactivity

AJAX

Widgets and UI

Semantic Web

Paint HTML Style and Skin using CSS Keep CSS at top of page Keep Scripts at bottom of page Update using Ajax Use Json ActionResult

Sections

Create sections in your Layout file Use section in head for styles Use section at bottom for scripts @RenderSection("StyleSection", false) @section StyleSection in our view

<!DOCTYPE html><html>

<head><title>@ViewBag.Title</title>@RenderSection(“StyleSection”, false)

<head><body>

… Rest of your html body here …@RenderSection(“Scripts”, false)

<body><html>

<appSettings> <add key="ClientValidationEnabled"

value="true" /> <add key="UnobtrusiveJavaScriptEnabled" value="true" /> </appSettings>

public class People { public int ID { get; set; }

[Required(ErrorMessage="Firstname is required")] [StringLength(50, ErrorMessage="Field too long")] public string FirstName { get; set; }

[Required(ErrorMessage = "Lastname is required")] [StringLength(50, ErrorMessage = " Field too long ")] public string LastName { get; set; }

[Required(ErrorMessage = "Email is required")] [StringLength(256, ErrorMessage = " Field too long by 256 chars")] [RegularExpression(".+\\@.+\\..+", ErrorMessage = "email not valid")] public string Email { get; set; } }

<input class="text-box single-line" data-val="true" data-val-length="Field too long" data-val-length-max="50" data-val-required="Firstname…" id="FirstName" name="FirstName" type="text" value="" />

Binding to events

Keep scripts at bottom of page $(“#myButton”).click(fn(e)); $(“#myButton”).bind(“click”, fn(e)); $(“#myButton”).delegate(“td”, “click”, fn(e)); $(“#myButton”).on(“click”, “td”, fn(e));

<sometag onclick=“fn();” />

Please Avoid

$(sometag).live(fn);

Event object functions

event.preventDefault(); event.stopPropagation(); event.stopImmediatePropagation();

Partial Views

Use partials for Dialogs and pop-ups $(“#myDiv”).load(“/controller/action”); Partials are also good for Tabs

Ajax

$.ajax(); $.getJSON(); $.post(); $.get(); $.load();

Ajax function

$.ajax({ url: “/myController/myAction", type: “POST”, data: someVar, success: function(result){ $("#results").append(result); }});

getJSON function

$.getJSON(“/mycontroller/myAction/232”, function(data) { … });

public ActionResult SampleJsonResponse(int Id){ int mynumber = providerGetNumber(Id); return Json(mynumber, JsonRequestBehavior.AllowGet);}

JQueryUI

Dragging Widgets, Accordian, Tabs, Datepicker,

Dialog, Slider and Autocomplete Utilities Widget framework Effects Grid control coming

3rd Party Jquery Grids

tableSorter jqGrid Flexigrid DataTables SlickGrid Ingrid

Thanks

facebook.com/apex.tgi

twitter.com/ApextgiNoida

pinterest.com/apextgi

Technology

Training in Asp.net mvc3 platform-apextgi,noida