eCommerce Website Part 14 User Register and Login

on

eCommerce Website  Part 14 User Register and Login

Hi, Dear's here we learn how to implement eCommerce Website in Visual Studio using C# ASP.NET MVC. Ilyasoft software company provide full project step by step training on our YouTube Channel ilyasoft software company so now subscribe, share and like for more project base tutorials


In this video we are going to implement user registration and login for more details click here: watch vedio

Script Part 14 Materials Download Materials.

Create UserMV Model View :

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

namespace eCommerceUI.Models
{
    public class UserMV
    {
        public UserMV()
        {
            GenderList = new List<GenderMV>();
            foreach (var gender in new DatabaseLayer.Pro_EcommerceDbEntities().GenderTables.ToList())
            {
                GenderList.Add(new GenderMV() { GenderID = gender.GenderID, GenderTitle = gender.GenderTitle });
            }
            UserTypeList = new List<UserTypeMV>();
            foreach (var usertype in new DatabaseLayer.Pro_EcommerceDbEntities().UserTypeTables.ToList())
            {
                UserTypeList.Add(new UserTypeMV() { UserTypeID = usertype.UserTypeID, UserType = usertype.UserType });
            }
        }
        public int UserID { get; set; }
        public int UserTypeID { get; set; }
        public string UserType { get; set; }

        [Required(ErrorMessage = "Enter User Name*")]
        [Remote("IsAlreadyUserRegistered", "User", HttpMethod = "POST", ErrorMessage = "UserName Already Exist!")]
        public string UserName { get; set; }

        [Required(ErrorMessage = "Confirm Your Password*")]
        [System.ComponentModel.DataAnnotations.Compare("Password", ErrorMessage = "Confirm Password Not Match.")]
        public string ConfirmPassword { get; set; }
        public string Password { get; set; }
        
        [Required(ErrorMessage = "Enter Email Address*")]
        [Remote("IsEmailAlreadyRegistered", "User", HttpMethod = "POST", ErrorMessage = "Email Already Exist!")]
        public string EmailAddress { get; set; }
        public string FirstName { get; set; }
        public string LastName { get; set; }

        [RegularExpression("(^\\+?\\d{1,4}?[-.\\s]?\\(?\\d{1,3}?\\)?[-.\\s]?\\d{1,4}[-.\\s]?\\d{1,4}[-.\\s]?\\d{1,9}$)", ErrorMessage = "Only Number's Allowed.")]
        [Required(ErrorMessage = "Enter Contact No*")]
        [Remote("IsContactNoAlreadyRegistered", "User", HttpMethod = "POST", ErrorMessage = "Contact No Already Exist!")]
        public string ContactNo { get; set; }
        
        [Required(ErrorMessage = "Select Gender*")]
        public int GenderID { get; set; }
        public string Gender { get; set; }
        public int UserStatusID { get; set; }
        public string UserStatus { get; set; }
        public virtual List<GenderMV> GenderList { get; set; }
        public virtual List<UserTypeMV> UserTypeList { get; set; }
    }
}


Create User Controller for User Registration, Login and more
Code show below:
using DatabaseLayer;
using eCommerceUI.Models;
using System.Collections.Generic;
using System.Linq;
using System.Web.Mvc;
namespace eCommerceUI.Controllers
{
    public class UserController : Controller
    {
        Pro_EcommerceDbEntities DB = new Pro_EcommerceDbEntities();
        public ActionResult User_List()
        {
            var list = new List<UserMV>();
            foreach (var user in DB.UserTables.ToList())
            {
                list.Add(new UserMV()
                {
                    UserID = user.UserID,
                    UserType = user.UserTypeTable.UserType,
                    UserName = user.UserName,
                    EmailAddress = user.EmailAddress,
                    FirstName = user.FirstName,
                    LastName = user.LastName,
                    ContactNo = user.ContactNo,
                    Gender = user.GenderTable.GenderTitle,
                    UserStatus = user.UserStatusTable.UserStatus,
                });
            }
            return View(list);
        }
        public ActionResult Register()
        {
            return View(new UserMV());
        }
        [HttpPost]
        [ValidateAntiForgeryToken]
        public ActionResult Register(UserMV userMV)
        {
            if (ModelState.IsValid)
            {
                float contactno = 0;
                float.TryParse(userMV.ContactNo.Trim(), out contactno);
                if (contactno > 0)
                {
                    var user = new UserTable();

                    user.UserTypeID = 2;
                    user.UserName = userMV.UserName;
                    user.Password = userMV.Password;
                    user.EmailAddress = userMV.EmailAddress;
                    user.FirstName = userMV.FirstName;
                    user.LastName = userMV.LastName;
                    user.ContactNo = userMV.ContactNo;
                    user.GenderID = userMV.GenderID;
                    user.UserStatusID = 2;
                    DB.UserTables.Add(user);
                    DB.SaveChanges();
                    return RedirectToAction("User_List");
                }
                else
                {
                    ModelState.AddModelError("ContactNo", "Incorrect!");
                }
            }
            else
            {
                ModelState.AddModelError("", "Fill All Field's Properly!");
            }
            return View(userMV);
        }
        [HttpPost]
        [ValidateAntiForgeryToken]
        public ActionResult UserRegister_Partial(UserMV userMV)
        {
            if (ModelState.IsValid)
            {
                float contactno = 0;
                float.TryParse(userMV.ContactNo.Trim(), out contactno);
                if (contactno > 0)
                {
                    var user = new UserTable();

                    user.UserTypeID = 2;
                    user.UserName = userMV.UserName;
                    user.Password = userMV.Password;
                    user.EmailAddress = userMV.EmailAddress;
                    user.FirstName = userMV.FirstName;
                    user.LastName = userMV.LastName;
                    user.ContactNo = userMV.ContactNo;
                    user.GenderID = userMV.GenderID;
                    user.UserStatusID = 2;
                    DB.UserTables.Add(user);
                    DB.SaveChanges();
                    return RedirectToAction("Index", "Home");
                }
                else
                {
                    ModelState.AddModelError("ContactNo", "Incorrect!");
                }
            }
            else
            {
                ModelState.AddModelError("", "Fill All Field's Properly!");
            }
            return PartialView(new UserMV());
        }
        public JsonResult Login_Partial(string username, string password)
        {
            string message = string.Empty;
            var user = DB.UserTables.Where(u => (u.UserName == username.Trim() || u.EmailAddress == username.Trim()) && u.Password == password.Trim()).FirstOrDefault();
            if (user != null)
            {
                if (user.UserStatusID == 1)
                {
                    message = "Your Account Pending";
                }
                else if (user.UserStatusID == 2)
                {
                    message = "/Home/Index";
                }
                else if (user.UserStatusID == 3)
                {
                    message = "Your Account Rejected";
                }
                else if (user.UserStatusID == 4)
                {
                    message = "Your Account Suspended";
                }
                else if (user.UserStatusID == 5)
                {
                    message = "Your Account Processing";
                }
            }
            else
            {
                message = "Incorrect User Credentials";
            }
            return Json(message, JsonRequestBehavior.AllowGet);
        }
        [HttpPost]
        public JsonResult IsAlreadyUserRegistered(string UserName)
        {
            bool status;

            var user = (from u in DB.UserTables
                        where u.UserName.ToUpper() == UserName.ToUpper()
                        select new { UserName }).FirstOrDefault();
            if (user != null)
            {
                //Already registered  
                status = false;
            }
            else
            {
                //Available to use  
                status = true;
            }
            return Json(status);
        }
        [HttpPost]
        public JsonResult IsEmailAlreadyRegistered(string EmailAddress)
        {
            bool status;

            var user = (from u in DB.UserTables
                        where u.EmailAddress.ToUpper() == EmailAddress.ToUpper()
                        select new { EmailAddress }).FirstOrDefault();
            if (user != null)
            {
                //Already registered  
                status = false;
            }
            else
            {
                //Available to use  
                status = true;
            }
            return Json(status);
        }
        [HttpPost]
        public JsonResult IsContactNoAlreadyRegistered(string ContactNo)
        {
            bool status;

            var user = (from u in DB.UserTables
                        where u.ContactNo.ToUpper() == ContactNo.ToUpper()
                        select new { ContactNo }).FirstOrDefault();
            if (user != null)
            {
                //Already registered  
                status = false;
            }
            else
            {
                //Available to use  
                status = true;
            }
            return Json(status);
        }
    }
}

User Controller All Views Code's For Implementing watch complete video:
Code show below:

User_List.cshtml View Code:

@model IEnumerable<eCommerceUI.Models.UserMV>
@{
    ViewBag.Title = "List";
}
<div class="container">
    <div class="page-width">
        <h3 class="docs-title">User List</h3>
        <p>
            @Html.ActionLink("New User", "Register", null, new { @class = "btn btn--secondary" })
            <div style="float:right;" class="form-group">
                <input type="text"
                       style="background-image: url('@Url.Content("~/Content/Template/images/searchicon.png")'); background-position: 10px 5px; background-repeat: no-repeat; font-size: 16px; padding: 12px 20px 12px 40px; border: 1px solid #ddd; margin-bottom: 12px; "
                       class="search form-control"
                       id="myInput"
                       placeholder="What you looking for?">
            </div>
        </p>

        <table class="responsive-table">
            <thead>
                <tr>
                    <th>
                        User Name
                    </th>
                    <th>
                        Email Address
                    </th>
                    <th>
                        User Type
                    </th>
                    <th>
                        First Name
                    </th>
                    <th>
                        Last Name
                    </th>
                    <th>
                        Contact No
                    </th>
                    <th>
                        Gender
                    </th>
                    <th>
                        Account Status
                    </th>

                    <th>Action</th>
                </tr>
            </thead>
            <tbody id="myTable">
                @foreach (var item in Model)
                {
                    <tr>
                        <td>
                            @Html.DisplayFor(modelItem => item.UserName)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.EmailAddress)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.UserType)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.FirstName)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.LastName)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.ContactNo)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.Gender)
                        </td>
                        <td>
                            @Html.DisplayFor(modelItem => item.UserStatus)
                        </td>
                        <td>
                            @Html.ActionLink("Details", "Details", new { id = item.UserID }, new { @class = "btn" })
                        </td>
                    </tr>
                }
                <tbody>
        </table>
    </div>
</div>

Register.cshtml View Code:

@model eCommerceUI.Models.UserMV
@{
    ViewBag.Title = "Register";
}
<div class="breadcrumbs mt-15">
    <div class="container">
        <ul class="list-unstyled d-flex flex-wrap align-items-center justify-content-center justify-content-lg-start">
            <li><a href="@Url.Content("~/Home/Index")">Home</a></li>
            <li><span>Create Account</span></li>
        </ul>
    </div>
</div>
<div class="register mb-60">
    <div class="container">
        <h1 class="h3 mt-30 mb-40 text-center">Sign Up</h1>
        @using (Html.BeginForm("Register", "User"))
        {
            @Html.AntiForgeryToken()
            @Html.ValidationSummary(true, "", new { @class = "text-danger" })
            <div class="form-group">
                <label for="UserTypeID" class="label-required">USER TYPE*</label>
                @Html.DropDownList("UserTypeID", new SelectList(Model.UserTypeList, "UserTypeID", "UserType", Model.UserTypeID), "--Choose--", htmlAttributes: new { @class = "form-control" })
                @Html.ValidationMessageFor(model => model.UserTypeID, "", new { @class = "text-danger" })
            </div>
            <div class="form-group">
                <label for="FirstName" class="label-required">FIRST NAME</label>
                @Html.EditorFor(model => model.FirstName, new
                {
                    htmlAttributes = new
                    {
                       @class = "form-control",
                       @type = "text",
                       @id = "FirstName",
                       @placeholder = "Enter your first name",
                       @required = "required"
                    }
                })
                @Html.ValidationMessageFor(model => model.FirstName, "", new { @class = "text-danger" })
            </div>
            <div class="form-group">
                <label for="LastName" class="label-required">LAST NAME</label>
                @Html.EditorFor(model => model.LastName, new
                {
                    htmlAttributes = new
                    {
                       @class = "form-control",
                       @type = "text",
                       @id = "LastName",
                       @placeholder = "Enter your last name",
                       @required = "required"
                    }
                })
                @Html.ValidationMessageFor(model => model.LastName, "", new { @class = "text-danger" })
            </div>
            <div class="form-group">
                <label for="UserName" class="label-required">USER NAME</label>
                @Html.EditorFor(model => model.UserName, new
                {
                    htmlAttributes = new
                    {
                       @class = "form-control",
                       @type = "text",
                       @id = "UserName",
                       @placeholder = "Enter your user name",
                       @required = "required"
                    }
                })
                @Html.ValidationMessageFor(model => model.UserName, "", new { @class = "text-danger" })
            </div>
            <div class="form-group">
                <label for="GenderID" class="label-required">GENDER</label>
                @Html.DropDownList("GenderID", new SelectList(Model.GenderList, "GenderID", "GenderTitle", Model.GenderID), "--Choose--", htmlAttributes: new { @class = "form-control" })
                @Html.ValidationMessageFor(model => model.GenderID, "", new { @class = "text-danger" })
            </div>
            <div class="form-group">
                <label for="ContactNo" class="label-required">Contact No</label>
                @Html.EditorFor(model => model.ContactNo, new
                {
                    htmlAttributes = new
                    {
                       @class = "form-control",
                       @type = "text",
                       @id = "ContactNo",
                       @placeholder = "Enter your contact no",
                       @required = "required"
                    }
                })
                @Html.ValidationMessageFor(model => model.ContactNo, "", new { @class = "text-danger" })
            </div>
            <div class="form-group">
                <label for="Email" class="label-required">EMAIL</label>
                @Html.EditorFor(model => model.EmailAddress, new
                {
                    htmlAttributes = new
                    {
                        @type = "email",
                        @id = "Email",
                        @class = "",
                        @placeholder = "Enter your email",
                        @value = "",
                        @spellcheck = "false",
                        @autocomplete = "off",
                        @autocapitalize = "off",
                        @required = "required"
                    }
                })
                @Html.ValidationMessageFor(model => model.EmailAddress, "", new { @class = "text-danger" })
            </div>
            <div class="form-group">
                <label for="CreatePassword" class="label-required">PASSWORD</label>
                @Html.EditorFor(model => model.Password, new
                {
                    htmlAttributes = new
                    {
                       @type = "password",
                       @id = "CreatePassword",
                       @class = "",
                       @placeholder = "Enter your password",
                       @required = "required"
                    }
                })
                @Html.ValidationMessageFor(model => model.Password, "", new { @class = "text-danger" })
            </div>
            <div class="form-group">
                <label for="ConfirmPassword" class="label-required">CONFIRM PASSWORD</label>
                @Html.EditorFor(model => model.ConfirmPassword, new
                {
                    htmlAttributes = new
                    {
                       @type = "password",
                       @id = "ConfirmPassword",
                       @class = "",
                       @placeholder = "Re-Enter your password",
                       @required = "required"
                    }
                })
                @Html.ValidationMessageFor(model => model.ConfirmPassword, "", new { @class = "text-danger" })
            </div>
            <div class="text-center">
                <input type="submit" value="SIGN UP NOW!" class="btn btn--full btn--secondary">
                <a href="#" class="h6 btn-link mt-20 mb-0">RETURN TO STORE</a>
            </div>
        }
    </div>
</div>

Login_Partial.cshtml View Code:

<div class="mb-15">
    <input type="hidden" name="form_type" value="customer_login" />
    <input type="hidden" name="utf8" value="✓" />

    <div>
        <label for="PopupCustomerEmail" class="label-required">EMAIL/USER NAME</label>
        <input type="text" name="L_UserName" id="L_UserName" class=""
               placeholder="Your Email/Username" spellcheck="false"
               autocapitalize="off" required="required">
    </div>

    <div>
        <label for="PopupCustomerPassword" class="label-required">PASSWORD</label>
        <input type="password" name="L_Password" id="L_Password" class=""
               placeholder="••••••" required="required">
    </div>

    <input type="submit" class="btn btn--full btn--secondary mb-20" value="LOGIN" onclick="loginfunction();">
    <div class="mb-15">
        <span class="popup-account__return-to-store btn-link"
              data-js-popup-close>RETURN TO STORE</span>
    </div>
    <div class="mb-10">

        <a href="#" class="btn-link js-button-block-visibility"
           data-block-link="#recover" data-action="open" data-action-close-popup="account">
            Forgot
            Your Password?
        </a>
        <script>
            Loader.require({
                type: "script",
                name: "buttons_blocks_visibility"
            });
        </script>

    </div>
</div>


<script type="text/javascript">
    function loginfunction() {
        var username = document.getElementById("L_UserName").value;
        var password = document.getElementById("L_Password").value;
        alert(username);
        alert(password);
        $.ajax({
            type: "GET",
            url: "/User/Login_Partial?username=" + username + "&password=" + password,
            data: [],
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (data) {
                if (data = "/Home/Index") {
                    window.location.href = data;
                }
                else {
                    alert(data);
                }
            },
            error: function () {
                alert("Un-Expected Issue Error is Occur, Plz Try-Again");
            }
        });
    }
</script>  

UserRegister_Partial.cshtml View Code:

@model eCommerceUI.Models.UserMV
@using (Html.BeginForm("UserRegister_Partial", "User"))
{
    @Html.AntiForgeryToken()
    @Html.ValidationSummary(true, "", new { @class = "text-danger" })
    <div class="form-group">
        <label for="FirstName" class="label-required">FIRST NAME</label>
        @Html.EditorFor(model => model.FirstName, new
   {
       htmlAttributes = new
       {
           @class = "form-control",
           @type = "text",
           @id = "FirstName",
           @placeholder = "Enter your first name",
           @required = "required"
       }
   })
        @Html.ValidationMessageFor(model => model.FirstName, "", new { @class = "text-danger" })
    </div>
    <div class="form-group">
        <label for="LastName" class="label-required">LAST NAME</label>
        @Html.EditorFor(model => model.LastName, new
   {
       htmlAttributes = new
       {
           @class = "form-control",
           @type = "text",
           @id = "LastName",
           @placeholder = "Enter your last name",
           @required = "required"
       }
   })
        @Html.ValidationMessageFor(model => model.LastName, "", new { @class = "text-danger" })
    </div>
    <div class="form-group">
        <label for="UserName" class="label-required">USER NAME</label>
        @Html.EditorFor(model => model.UserName, new
   {
       htmlAttributes = new
       {
           @class = "form-control",
           @type = "text",
           @id = "UserName",
           @placeholder = "Enter your user name",
           @required = "required"
       }
   })
        @Html.ValidationMessageFor(model => model.UserName, "", new { @class = "text-danger" })
    </div>
    <div class="form-group">
        <label for="GenderID" class="label-required">GENDER</label>
        @Html.DropDownList("GenderID", new SelectList(Model.GenderList, "GenderID", "GenderTitle", Model.GenderID), "--Choose--", htmlAttributes: new { @class = "form-control" })
        @Html.ValidationMessageFor(model => model.GenderID, "", new { @class = "text-danger" })
    </div>
    <div class="form-group">
        <label for="ContactNo" class="label-required">Contact No</label>
        @Html.EditorFor(model => model.ContactNo, new
   {
       htmlAttributes = new
       {
           @class = "form-control",
           @id = "ContactNo",
           @placeholder = "Enter your contact no",
           @required = "required"
       }
   })
        @Html.ValidationMessageFor(model => model.ContactNo, "", new { @class = "text-danger" })
    </div>
    <div class="form-group">
        <label for="Email" class="label-required">EMAIL</label>
        @Html.EditorFor(model => model.EmailAddress, new
   {
       htmlAttributes = new
       {
           @type = "email",
           @id = "Email",
           @class = "",
           @placeholder = "Enter your email",
           @value = "",
           @spellcheck = "false",
           @autocomplete = "off",
           @autocapitalize = "off",
           @required = "required"
       }
   })
        @Html.ValidationMessageFor(model => model.EmailAddress, "", new { @class = "text-danger" })
    </div>
    <div class="form-group">
        <label for="CreatePassword" class="label-required">PASSWORD</label>
        @Html.EditorFor(model => model.Password, new
   {
       htmlAttributes = new
       {
           @type = "password",
           @id = "CreatePassword",
           @class = "",
           @placeholder = "Enter your password",
           @required = "required"
       }
   })
        @Html.ValidationMessageFor(model => model.Password, "", new { @class = "text-danger" })
    </div>
    <div class="form-group">
        <label for="ConfirmPassword" class="label-required">CONFIRM PASSWORD</label>
        @Html.EditorFor(model => model.ConfirmPassword, new
   {
       htmlAttributes = new
       {
           @type = "password",
           @id = "ConfirmPassword",
           @class = "",
           @placeholder = "Re-Enter your password",
           @required = "required"
       }
   })
        @Html.ValidationMessageFor(model => model.ConfirmPassword, "", new { @class = "text-danger" })
    </div>
    <input type="submit" class="btn btn--full btn--secondary mb-20" value="Sign up now!">
    <div class="mb-15">
        <span class="popup-account__return-to-store btn-link"
              data-js-popup-close>RETURN TO STORE</span>
    </div>
}

Add UserIcon in Header Code Show Below:

<div class="header__sidebar d-flex align-items-center ml-auto">

                                <a href="account"
                                   class="header__btn-account d-flex align-items-center position-relative ml-25 ml-lg-15 js-popup-button"
                                   data-js-popup-button="account"
                                   data-js-tooltip
                                   data-tippy-content="Account"
                                   data-tippy-placement="bottom"
                                   data-tippy-distance="6">
                                    <i>
                                        <svg aria-hidden="true" focusable="false" role="presentation"
                                             class="icon icon-theme-201" viewBox="0 0 24 24">
                                            <path d="M4.023 22.167h-1.25v-.625c0-1.042.163-2.034.488-2.979a9.524 9.524 0 0 1 1.357-2.588 9.366 9.366 0 0 1 2.061-2.031 9.58 9.58 0 0 1 2.598-1.328 5.588 5.588 0 0 1-1.992-2.002 5.413 5.413 0 0 1-.762-2.822c0-.781.146-1.51.439-2.188A5.707 5.707 0 0 1 9.96 2.606c.677-.293 1.406-.439 2.188-.439s1.51.146 2.188.439a5.724 5.724 0 0 1 2.998 2.998c.293.677.439 1.406.439 2.188 0 1.029-.254 1.97-.762 2.822a5.588 5.588 0 0 1-1.992 2.002 9.623 9.623 0 0 1 2.598 1.328 9.41 9.41 0 0 1 3.418 4.619c.325.944.488 1.937.488 2.979v.625h-1.25v-.625c0-1.12-.212-2.174-.635-3.164A8.172 8.172 0 0 0 17.9 15.79a8.172 8.172 0 0 0-2.588-1.738 7.966 7.966 0 0 0-3.164-.635c-1.12 0-2.175.212-3.164.635a8.15 8.15 0 0 0-2.588 1.738 8.155 8.155 0 0 0-1.738 2.588 7.966 7.966 0 0 0-.635 3.164v.625zM8.115 9.491a4.364 4.364 0 0 0 2.334 2.334 4.28 4.28 0 0 0 1.699.342 4.375 4.375 0 0 0 4.033-2.676 4.28 4.28 0 0 0 .342-1.699 4.28 4.28 0 0 0-.342-1.699 4.392 4.392 0 0 0-.938-1.396 4.4 4.4 0 0 0-1.396-.937 4.284 4.284 0 0 0-1.699-.342c-.599 0-1.166.114-1.699.342-.534.228-1 .541-1.396.937-.397.397-.71.863-.938 1.396a4.28 4.28 0 0 0-.342 1.699c0 .599.114 1.165.342 1.699z" />
                                        </svg>
                                    </i>
                                </a>
                            </div>

Add UserRegister & Login Code , Code Show Below:

<div id="theme-section-popup" class="theme-section">
        <div class="popup fixed-stretch d-none js-popup" tabindex="0">
            <div class="popup__bg fixed-stretch cursor-pointer pointer-events-none" data-js-popup-bg></div>
            <div class="popup__body position-relative d-none show visible" data-js-popup-name="sidebar-blog" data-popup-left="">
                <div class="popup-sidebar popup-sidebar--width-md py-30 px-20" data-popup-content="">
                    <div class="popup-sidebar__head">
                        <div class="popup-sidebar__close d-flex align-items-center cursor-pointer" data-js-popup-close="">
                            <i class="mr-lg-5">
                                <svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-164"
                                     viewBox="0 0 24 24">
                                    <path d="M19.583 4.965a.65.65 0 0 1-.176.449l-6.445 6.426 6.445 6.426c.117.131.176.28.176.449a.65.65 0 0 1-.176.449.846.846 0 0 1-.215.127.596.596 0 0 1-.468 0 .846.846 0 0 1-.215-.127l-6.426-6.445-6.426 6.445a.846.846 0 0 1-.215.127.596.596 0 0 1-.468 0 .846.846 0 0 1-.215-.127.65.65 0 0 1-.176-.449c0-.169.059-.318.176-.449l6.445-6.426-6.445-6.426a.65.65 0 0 1-.176-.449c0-.169.059-.318.176-.449a.652.652 0 0 1 .449-.176c.169 0 .319.059.449.176l6.426 6.445 6.426-6.445a.652.652 0 0 1 .449-.176c.169 0 .319.059.449.176.117.13.176.28.176.449z"></path>
                                </svg>
                            </i> <span class="d-none d-lg-inline">CLOSE</span>
                        </div>
                    </div>
                    <div class="popup-sidebar__content pt-50" data-js-position-mobile="sidebar-blog"></div>
                </div>
            </div>

            <div class="popup__body position-relative d-none justify-content-end" data-js-popup-name="account"
                 data-popup-right>
                <div class="popup-account py-25 px-20 js-popup-account" data-popup-content>
                    <div class="popup-account__login">
                        <div class="popup-account__head d-flex align-items-center mb-10">
                            <h5 class="m-0">MY ACCOUNT</h5>
                            <i class="popup-account__close ml-auto cursor-pointer" data-js-popup-close>
                                <svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-164"
                                     viewBox="0 0 24 24">
                                    <path d="M19.583 4.965a.65.65 0 0 1-.176.449l-6.445 6.426 6.445 6.426c.117.131.176.28.176.449a.65.65 0 0 1-.176.449.846.846 0 0 1-.215.127.596.596 0 0 1-.468 0 .846.846 0 0 1-.215-.127l-6.426-6.445-6.426 6.445a.846.846 0 0 1-.215.127.596.596 0 0 1-.468 0 .846.846 0 0 1-.215-.127.65.65 0 0 1-.176-.449c0-.169.059-.318.176-.449l6.445-6.426-6.445-6.426a.65.65 0 0 1-.176-.449c0-.169.059-.318.176-.449a.652.652 0 0 1 .449-.176c.169 0 .319.059.449.176l6.426 6.445 6.426-6.445a.652.652 0 0 1 .449-.176c.169 0 .319.059.449.176.117.13.176.28.176.449z" />
                                </svg>
                            </i>
                        </div>
                        @{
                            Html.RenderPartial("~/Views/User/Login_Partial.cshtml", new eCommerceUI.Models.LoginMV());
                        }
                        <hr class="my-15" />
                        <div class="popup-account__head d-flex align-items-center mb-10">
                            <h5 class="m-0">SIGN UP</h5>
                        </div>
                        <div>
                            <p class="h6 mb-15">Enjoy the benefits of registering:</p>
                            <ul class="mb-20">
                                <li class="mb-15">Order: view Order History, track and manage purchases and returns</li>
                                <li class="mb-15">
                                    Address Book and Card Wallet: safely store delivery and payment details
                                    for faster checkout
                                </li>
                                <li class="mb-15">
                                    Saved for later: wish list your preferred items and track their
                                    availability
                                </li>
                            </ul>
                        </div>
                        <a href="register.html"
                           class="btn btn--full btn--secondary mb-20 js-popup-account-show-sign-up">Sign up now!</a>
                    </div>
                    <div class="popup-account__sign-up d-none-important">
                        <div class="popup-account__head d-flex align-items-center mb-10">
                            <h5 class="m-0">SIGN UP</h5>
                            <i class="popup-account__close ml-auto cursor-pointer" data-js-popup-close>
                                <svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-theme-164"
                                     viewBox="0 0 24 24">
                                    <path d="M19.583 4.965a.65.65 0 0 1-.176.449l-6.445 6.426 6.445 6.426c.117.131.176.28.176.449a.65.65 0 0 1-.176.449.846.846 0 0 1-.215.127.596.596 0 0 1-.468 0 .846.846 0 0 1-.215-.127l-6.426-6.445-6.426 6.445a.846.846 0 0 1-.215.127.596.596 0 0 1-.468 0 .846.846 0 0 1-.215-.127.65.65 0 0 1-.176-.449c0-.169.059-.318.176-.449l6.445-6.426-6.445-6.426a.65.65 0 0 1-.176-.449c0-.169.059-.318.176-.449a.652.652 0 0 1 .449-.176c.169 0 .319.059.449.176l6.426 6.445 6.426-6.445a.652.652 0 0 1 .449-.176c.169 0 .319.059.449.176.117.13.176.28.176.449z" />
                                </svg>
                            </i>
                        </div>
                        @{
                            Html.RenderPartial("~/Views/User/UserRegister_Partial.cshtml", new eCommerceUI.Models.UserMV());
                        }
                    </div>
                </div>
            </div>
        </div>
    </div>

Comments

Post a Comment