@if (item.Selected) { <text>checked="checked"</text> }
export interface IUser {
id: number;
name: string;
email: string;
password: string;
} <form> <div class="form-group"> <label form="name">Username</label> <input id="name" type="text" class="form-control" /> </div> <div class="form-group"> <label form="email">Email</label> <input id="email" type="text" class="form-control" /> </div> <div class="form-group"> <label form="password">Password</label> <input id="password" type="password" class="form-control" /> </div> <button class="btn btn-primary" type="submit">Submit</button> </form>
import { Component } from '@angular/core';
import { Control, ControlGroup, Validators } from '@angular/common';
@Component({
selector: 'signup-form',
templateUrl: 'app/users/signup-form.component.html'
})
export class SignupFormComponent {
form = new ControlGroup({
name: new Control('', Validators.required),
email: new Control('', Validators.required),
password: new Control('', Validators.required)
});
onSubmit(): void {
console.log(this.form.value);
}
} <form [ngFormModel]="form" (ngSubmit)="onSubmit()"> <div class="form-group"> <label form="name">Username</label> <input id="name" type="text" class="form-control" ngControl="name"/> <label class="text-danger" *ngIf="!form.controls['name'].valid"> Username is required. </label> </div> <div class="form-group"> <label form="email">Email</label> <input id="email" type="text" class="form-control" ngControl="email" #email="ngForm"/> <label class="text-danger" *ngIf="email.touched && !email.valid"> Email is required. </label> </div> <div class="form-group"> <label form="password">Password</label> <input id="password" type="password" class="form-control" ngControl="password" #password="ngForm"/> <label class="text-danger" *ngIf="password.touched && !password.valid"> Password is required. </label> </div> <button class="btn btn-primary" type="submit">Submit</button> </form>
form = new ControlGroup({
name: new Control('', Validators.required),
email: new Control('', Validators.required),
password: new Control('', Validators.required)
}); import { Control, ControlGroup, Validators } from '@angular/common'; <form [ngFormModel]="form" (ngSubmit)="onSubmit()">
<label class="text-danger" *ngIf="!form.controls['name'].valid">
onSubmit(): void {
console.log(this.form.value);
} //same as before...
import { SignupFormComponent } from './users/signup-form.component';
@Component({
//same as before…
template: `
//same as before…
<li><a [routerLink]="['AddUser']">Add User</a></li>
//same as before…
`,
//same as before…
})
@RouteConfig([
//same as before…
{ path: '/adduser', name: 'AddUser', component: SignupFormComponent }
])
//same as before... import { Control, ControlGroup, Validators, FormBuilder } from '@angular/common';
form: ControlGroup;
constructor(formBuilder: FormBuilder) {
this.form = formBuilder.group({
name: ['', Validators.required],
email: ['', Validators.required],
password: ['', Validators.required]
});
} import { Control } from '@angular/common';
export class UsernameValidators {
static cannotContainSpace(control: Control) {
if (control.value.indexOf(' ') >= 0) {
return { cannotContainSpace: true };
}
return null;
}
} { required:true } {
minlength : {
requiredLength : 3,
actualLength : 1
}
} import { UsernameValidators } from './usernameValidators'; name: ['', Validators.compose([Validators.required, UsernameValidators.cannotContainSpace])],
<div class="form-group"> <label form="name">Username</label> <input id="name" type="text" class="form-control" ngControl="name" #name="ngForm" /> <div *ngIf="name.touched && name.errors"> <label class="text-danger" *ngIf="name.errors.required"> Username is required. </label> <label class="text-danger" *ngIf="name.errors.cannotContainSpace"> Username can't contain space. </label> </div> </div>
import {Control} from '@angular/common';
export class EmailValidators {
static email(control: Control) {
var regEx = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
var valid = regEx.test(control.value);
return valid ? null : { email: true };
}
} control(value: Object, validator?: ValidatorFn, asyncValidator?: AsyncValidatorFn) : Control
nameShouldBeUnique(control: Control) {
let name: string = control.value;
return new Promise((resolve) => {
this._userService.isUserNameUnique(<IUser>{ "name": name }).subscribe(
(result: IResult) => {
resolve(
result.result ? null : { 'nameShouldBeUnique': true }
);
},
error => {
resolve(null);
}
);
});
} this.form = _formBuilder.group({
name: ['', Validators.compose([
Validators.required,
UsernameValidators.cannotContainSpace
]),
(control: Control) => this.nameShouldBeUnique(control)], import { Injectable } from '@angular/core';
import { Http, Response } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import { Headers, RequestOptions } from '@angular/http';
import { IUser } from './user';
import { IResult } from './result';
@Injectable()
export class UserService {
private _checkUserUrl = '/home/checkUser';
constructor(private _http: Http) { }
private handleError(error: Response) {
console.error(error);
return Observable.throw(error.json().error || 'Server error');
}
isUserNameUnique(user: IUser): Observable<IResult> {
let headers = new Headers({ 'Content-Type': 'application/json' }); // for ASP.NET MVC
let options = new RequestOptions({ headers: headers });
return this._http.post(this._checkUserUrl, JSON.stringify(user), options)
.map((response: Response) => <IResult>response.json())
.do(data => console.log("User: " + JSON.stringify(data)))
.catch(this.handleError);
}
} export interface IResult {
result: boolean;
} namespace MVC5Angular2.Controllers
{
public class HomeController : Controller
{
[HttpPost]
public ActionResult CheckUser(User user)
{
var isUnique = new { result = true };
if (user.Name?.Equals("Vahid", StringComparison.OrdinalIgnoreCase) ?? false)
{
isUnique = new { result = false };
}
return new ContentResult
{
Content = JsonConvert.SerializeObject(isUnique, new JsonSerializerSettings
{
ContractResolver = new CamelCasePropertyNamesContractResolver()
}),
ContentType = "application/json",
ContentEncoding = Encoding.UTF8
};
}
}
} @Component({
selector: 'signup-form',
templateUrl: 'app/users/signup-form.component.html',
providers: [ UserService ]
})
export class SignupFormComponent {
constructor(private _formBuilder: FormBuilder, private _userService: UserService) { <div *ngIf="name.touched && name.errors"> <label class="text-danger" *ngIf="name.errors.required"> Username is required. </label> <label class="text-danger" *ngIf="name.errors.cannotContainSpace"> Username can't contain space. </label> <label class="text-danger" *ngIf="name.errors.nameShouldBeUnique"> This username is already taken. </label> </div>
<input id="name" type="text" class="form-control" ngControl="name" #name="ngForm" /> <div *ngIf="name.control.pending"> Checking server, Please wait ... </div>
onSubmit(): void {
console.log(this.form.value);
this.form.find('name').setErrors({
invalidData : true
});
} <div *ngIf="name.touched && name.errors"> <label class="text-danger" *ngIf="name.errors.invalidData"> Check the inputs.... </label> </div>
{ name="VahidN", email="email@site.com", password="123"} import { Injectable } from '@angular/core';
import { Http, Response } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import { Headers, RequestOptions } from '@angular/http';
import { IUser } from './user';
import { IResult } from './result';
@Injectable()
export class UserService {
private _addUserUrl = '/home/addUser';
constructor(private _http: Http) { }
private handleError(error: Response) {
console.error(error);
return Observable.throw(error.json().error || 'Server error');
}
addUser(user: IUser): Observable<IUser> {
let headers = new Headers({ 'Content-Type': 'application/json' }); // for ASP.NET MVC
let options = new RequestOptions({ headers: headers });
return this._http.post(this._addUserUrl, JSON.stringify(user), options)
.map((response: Response) => <IUser>response.json())
.do(data => console.log("User: " + JSON.stringify(data)))
.catch(this.handleError);
}
} [HttpPost]
public ActionResult AddUser(User user)
{
user.Id = 1; //todo: save user and get id from db
return new ContentResult
{
Content = JsonConvert.SerializeObject(user, new JsonSerializerSettings
{
ContractResolver = new CamelCasePropertyNamesContractResolver()
}),
ContentType = "application/json",
ContentEncoding = Encoding.UTF8
};
} onSubmit(): void {
console.log(this.form.value);
/*this.form.find('name').setErrors({
invalidData : true
});*/
this._userService.addUser(<IUser>this.form.value)
.subscribe((user: IUser) => {
console.log(`ID: ${user.id}`);
});
} 
In this article we are going to discuss how to insert, update and delete data into database using ASP.NET MVC 4.0. There is a Layout page and Data base script that we are going to use for this but we are not going to discuss much how to create a Layout page and database script here in detail.
@{
Layout = "~/Views/Shared/_Layout.cshtml";
} @{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>Index</h2> [SetLayoutAttribute("_MyLayout")]
public ActionResult Index()
{
return View();
} [SetLayoutAttribute("_MyLayout")]
public class HomeController : Controller
{
public ActionResult Index()
{
return View();
}
public ActionResult About()
{
ViewBag.Message = "Your application description page.";
return View();
}
public ActionResult Contact()
{
ViewBag.Message = "Your contact page.";
return View();
}
} public class SetLayoutAttribute : ActionFilterAttribute
{
private readonly string _masterName;
public SetLayoutAttribute(string masterName)
{
_masterName = masterName;
}
public override void OnActionExecuted(ActionExecutedContext filterContext)
{
base.OnActionExecuted(filterContext);
var result = filterContext.Result as ViewResult;
if (result != null)
{
result.MasterName = _masterName;
}
}
} شاید تا به حال به این فکر افتاده بودید
که برنامه‌ی شما چه مقداری از RAM ، CPU و ... را اشغال کرده است، و جواب آن را به طور مثال در Task Manager ویندوز پیدا کرده باشید. اما آیا تا به حال به این فکر رفته اید
که خب این برنامه چرا باید این مقدار از حافظه را اشغال کند و بخواهید به طور دقیق
مقدار حافظه را چک کنید، که چه آبجکت هایی از چه کلاس هایی چه مقدار از رم را
اشغال کرده است. در این مقاله قصد دارم که ابزاری به شما معرفی کنم که شما به کمک آن
میتوانید به راحتی در هنگام Debug برنامه خود
مصرف حافظه برنامه‌ی خود را با جزئیات آن بسنجید .
همچنین شما میتوانید با اعمال یک سری از تغییرات بر روی برنامه متوجه شوید که این
تغییرات چقدر بر مصرف حافظه‌ی شما تاثیر داشته اند.
با Memory Usage Tool که در VS2015 وجود دارد، شما میتوانید در حالت عیب یابی (debugging) ، مصرف حافظه‌ی خود را بسنجید.
· Break-Aware Live Graph
یکی از قابلیت‌های کلیدی Diagnostic Tools window این است که فقط در زمانی که برنامه در حال اجرا با در زمانی که به وسیله‌ی breakpoint متوقف شده باشد،گراف را ثبت میکند. پس وقتی که به وسیله‌ی یک breakpoint برنامه متوقف شده باشد، این گراف هیچ پیشروی نخواهد کرد مگر اینکه شما برنامه را ادامه دهید. در این صورت گراف با شرایط فعلی برنامه شما پیشروی خواهد کرد.
شما میتوانید این ابزار را در موقعی که برنامه‌ی شما
در حال اجراست در سمت راست مشاهده کنید. همچنین میتوانید در هنگامی که برنامه‌ی شما از حالت اجرا خارج شد این ابزار را از مسیر
Debug -> Show
Diagnostic Tools بیاورید
خب حالا وقت آن رسیده که درباره طرز کار این ابزار با هم صحبت کنیم. همانطور که گفتم وقتی برنامه در حال اجراست، این ابزار به طور خودکار در سمت راست صفحه ظاهر خواهد شد. برای اینکه بتوانید مصرف حافظه با جزئیات آن را ببینید میتوانید به روش زیر عمل کنید.
ابتدا بر روی گزینه‌ی Memory Usage کلیک کرده و گزینه‌ی Take Snapshot را انتخاب کنید
وقتی که بر روی این گزینه کلیک کردید مصرف حافظه‌ی شما به جزئیات به شما نشان داده میشود.
حال میتوانید با انتخاب مقدار Object از مصرف حافظه‌ی کلاسهای خود و آبجکت‌های خود مطلع شوید.
با این ابزار شما قادر خواهید بود که میزان تغییر حافظه بر اساس مقایسه بین دو Snapshot را بسنجید. برای اینکار شما میتوانید بعد از اعمال تغییرات، و یا بعد از زمانی مشخص دوباره بر روی گزینه‌ی Take Snapshot کلیک کنید. در این حالت شما میتوانید تغییری که بر روی حافظه‌ی شما اعمال گردیده را مشاهده کنید.
Layout 00:46:16
C# Metro applications have access to numerous XAML layout features.
This module describes those services, and shows how to use them to support Windows 8 features such as display orientation, and snap.
Introduction
Layout System
Size Properties
Alignment
Margin
Demo: Margin and Alignment
Padding
Panels
Demo: Canvas
Demo: Grid and Snap
Data-Oriented Panels
ScrollViewer
Metro Layout Conventions
Layout Change Events
Summary
public class ApplicationUser : IdentityUser
{
public string Email { get; set; }
public string ConfirmationToken { get; set; }
public bool IsConfirmed { get; set; }
} private string CreateConfirmationToken()
{
return ShortGuid.NewGuid();
}
private void SendEmailConfirmation(string to, string username, string confirmationToken)
{
dynamic email = new Email("RegEmail");
email.To = to;
email.UserName = username;
email.ConfirmationToken = confirmationToken;
email.Send();
}
//
// POST: /Account/Register
[HttpPost]
[AllowAnonymous]
[ValidateAntiForgeryToken]
public async Task<ActionResult> Register(RegisterViewModel model)
{
if (ModelState.IsValid)
{
string confirmationToken = CreateConfirmationToken();
var user = new ApplicationUser()
{
UserName = model.UserName,
Email = model.Email,
ConfirmationToken = confirmationToken,
IsConfirmed = false };
var result = await UserManager.CreateAsync(user, model.Password);
if (result.Succeeded)
{
SendEmailConfirmation(model.Email, model.UserName, confirmationToken);
return RedirectToAction("RegisterStepTwo", "Account");
}
else
{
AddErrors(result);
}
}
// If we got this far, something failed, redisplay form
return View(model);
} private bool ConfirmAccount(string confirmationToken)
{
ApplicationDbContext context = new ApplicationDbContext();
ApplicationUser user = context.Users.SingleOrDefault(u => u.ConfirmationToken == confirmationToken);
if (user != null)
{
user.IsConfirmed = true;
DbSet<ApplicationUser> dbSet = context.Set<ApplicationUser>();
dbSet.Attach(user);
context.Entry(user).State = EntityState.Modified;
context.SaveChanges();
return true;
}
return false;
}
[AllowAnonymous]
public ActionResult RegisterConfirmation(string Id)
{
if (ConfirmAccount(Id))
{
return RedirectToAction("ConfirmationSuccess");
}
return RedirectToAction("ConfirmationFailure");
} [HttpPost]
[AllowAnonymous]
[ValidateAntiForgeryToken]
public async Task<ActionResult> Login(LoginViewModel model, string returnUrl)
{
if (ModelState.IsValid)
{
var user = await UserManager.FindAsync(model.UserName, model.Password);
if (user != null && user.IsConfirmed)
{
await SignInAsync(user, model.RememberMe);
return RedirectToLocal(returnUrl);
}
else
{
ModelState.AddModelError("", "Invalid username or password.");
}
}
// If we got this far, something failed, redisplay form
return View(model);
} To: @ViewBag.To
From: YOURNAME@gmail.com
Subject: Confirm your registration
Hello @ViewBag.UserName,
Please confirm your registration by following the link bellow.
@Html.ActionLink(Url.Action("RegisterConfirmation", "Account", new { id = @ViewBag.ConfirmationToken }), "RegisterConfirmation", "Account", new { id = @ViewBag.ConfirmationToken }, null) @{ Layout = null; /* Overrides the Layout set for regular page views. */ } 