In this example we explain that how to move or
transfer item from one listbox to another ListBox in MVC4. we already explain
that how to move or transfer items in listbox in asp.net but sometime if you are worked on mvc application
then how to move items from one Listbox to another ListBox or how to bind
Listbox in mvc4.
Here we create application same like online Shopping application or in hotel you first select the item that you want and finally selected item are send to the waiter same like here we create two listbox in which first listbox contains all the item that are available in shop and you have select your item and move this item from first listbox to second listbox and finally submit to the admin that will prepare your bill payment.
Here we create application same like online Shopping application or in hotel you first select the item that you want and finally selected item are send to the waiter same like here we create two listbox in which first listbox contains all the item that are available in shop and you have select your item and move this item from first listbox to second listbox and finally submit to the admin that will prepare your bill payment.
Fancy Image Slideshow of Image in Jquery Beautiful Slideshow in Jquery
Awesome Login Popup in Jquery Signup and Login Popup in Jquery
to transfer item from one listbox to another follow the below step
Step 1:- Create Product class in Model folder in your mvc applivation.
Product.cs:-
using System;
using
System.Collections.Generic;
using System.Linq;
using System.Web;
namespace
MvcApplication2.Models
{
public class Product
{
public int Id { get; set; }
public string Name { get; set; }
public string Description { get;
set; }
public Decimal Rate { get;
set; }
public
Product(int id, string
name, string description, decimal Rates)
{
Id = id;
Name = name;
Description = description;
Rate = Rates;
}
//sample list
to use in place of database
static List<Product>
AvailabeProduct = new List<Product>
{
new
Product(1, "LED",
"Watching Latest Video", 199.99m),
new
Product(2, "MP3
player", "Listen to your favourite
tunes on the move", 99.99m),
new
Product(3, "Mobile",
"Apps,Games,Fun and More",
399.99m),
new
Product(4, "Digital
Camera", "take photo with high
quality", 49.99m),
new
Product(5, "Speaker",
"singing a song", 149.99m),
new
Product(6, "extra
one", "All of season one plus
exclusive extras", 39.99m)
};
public static List<Product> GetAvailabeProduct()
{
return
AvailabeProduct;
}
}
}
Step 2:- Create ViewModel class in Model folder in your mvc applivation.
ViewModel .cs:-
using System;
using
System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace
MvcApplication2.Models
{
public class ViewModel
{
public List<Product>
AvailableProducts { get; set; }
public List<Product>
SelectedProduct { get; set;
}
public decimal RequestedTotal
{
get
{
if
(SelectedProduct == null)
return
0m;
else
return
SelectedProduct.Sum(prod => prod.Rate);
}
}
public int[] AvailableSelected { get;
set; }
public int[] RequestedSelected { get;
set; }
public string SavedRequested { get;
set; }
}
}
Step 3:- Create HomeController in Controller folder in your mvc applivation.
HomeController.cs:-
using System;
using
System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using
MvcApplication2.Models;
namespace
MvcApplication2.Controllers
{
public class HomeController
: Controller
{
public ActionResult Index()
{
ViewModel
model = new ViewModel
{ AvailableProducts = Product.GetAvailabeProduct(),
SelectedProduct = new List<Product>() };
return
View(model);
}
[HttpPost]
public ActionResult Index(ViewModel
model, string add, string
remove, string send)
{
//Need to
clear model state or it will interfere with the updated model
ModelState.Clear();
RestoreSavedState(model);
if
(!string.IsNullOrEmpty(add))
AddProducts(model);
else
if (!string.IsNullOrEmpty(remove))
RemoveProducts(model);
else
if (!string.IsNullOrEmpty(send))
{
Validate(model);
if
(ModelState.IsValid)
return
RedirectToAction("Done");
//todo:
implement SendListToSanta method...
}
SaveState(model);
return
View(model);
}
public ViewResult Done()
{
return
View();
}
#region SupportFuncs
private
void Validate(ViewModel
model)
{
if
(model.RequestedTotal > 500m)
ModelState.AddModelError("", "Total
must be 500 or less");
if
(model.SelectedProduct.Count > 2)
ModelState.AddModelError("", "Maximum
of 2 selections allowed");
if
(string.IsNullOrEmpty(model.SavedRequested))
ModelState.AddModelError("", "You
haven't selected any presents!");
}
void
SaveState(ViewModel model)
{
//create
comma delimited list of product ids
model.SavedRequested = string.Join(",",
model.SelectedProduct.Select(p => p.Id.ToString()).ToArray());
//Available
products = All - Requested
model.AvailableProducts = Product.GetAvailabeProduct().Except(model.SelectedProduct).ToList();
}
void
RemoveProducts(ViewModel model)
{
if
(model.RequestedSelected != null)
{
model.SelectedProduct.RemoveAll(p =>
model.RequestedSelected.Contains(p.Id));
model.RequestedSelected = null;
}
}
void
AddProducts(ViewModel model)
{
if
(model.AvailableSelected != null)
{
var
prods = Product.GetAvailabeProduct().Where(p
=> model.AvailableSelected.Contains(p.Id));
model.SelectedProduct.AddRange(prods);
model.AvailableSelected = null;
}
}
void
RestoreSavedState(ViewModel model)
{
model.SelectedProduct = new List<Product>();
//get the
previously stored items
if
(!string.IsNullOrEmpty(model.SavedRequested))
{
string[]
prodids = model.SavedRequested.Split(',');
var
prods = Product.GetAvailabeProduct().Where(p
=> prodids.Contains(p.Id.ToString()));
model.SelectedProduct.AddRange(prods);
}
}
#endregion
}
}
Step 4:- Create Index view in Views folder in your mvc applivation.
Index.aspx:-
<%@
Page Language="C#" Inherits="System.Web.Mvc.ViewPage<MvcApplication2.Models.ViewModel>"
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Index</title>
</head>
<body>
<h2>
Diwali Dhamaka Buper Offer</h2>
<div style="width:35%";>
<fieldset style="border: medium double #FF9900; font-family: 'Times New Roman', Times, serif;
font-size:
large; font-weight: bold">
<legend>
<h6>
Maximum you Select up to 2
gifts from List
below
total value 400</h6>
</legend>
<h3 style="font-family: 'Times New Roman', Times, serif; font-size: large; font-weight: bold;
color:
#FF0000">
Developed By
aspsolutionkirit.blogspot.in</h3>
<%using
(Html.BeginForm())
{ %>
<div>
<table>
<thead>
<tr>
<th>
Available
</th>
<th>
</th>
<th>
Requested
</th>
</tr>
</thead>
<tbody>
<tr>
<td valign="top">
<%=Html.ListBoxFor(model => model.AvailableSelected,
new MultiSelectList(Model.AvailableProducts,
"Id", "Name",
Model.AvailableSelected), new { size = "6" })%>
</td>
<td valign="top">
<input type="submit"
name="add"
id="add"
value=">>"
/><br />
<input type="submit"
name="remove"
id="remove"
value="<<"
/>
</td>
<td valign="top">
<%=Html.ListBoxFor(model => model.RequestedSelected,
new MultiSelectList(Model.SelectedProduct,
"Id", "Name",
Model.RequestedSelected))%>
</td>
</tr>
</tbody>
</table>
<br />
<%=Html.HiddenFor(model=>model.SavedRequested)
%>
<fieldset>
<legend>Your wish
list</legend>
<table>
<thead>
<tr>
<th>
Product
</th>
<th>
Description
</th>
<th>
Rate
</th>
</tr>
</thead>
<tfoot>
<tr>
<td colspan="2">
</td>
<td>
<span id="total" style="font-weight: bold;">
<%=Model.RequestedTotal.ToString("G") %></span>
</td>
</tr>
</tfoot>
<tbody id="tableBody">
<%foreach
(var product in
Model.SelectedProduct)
{ %>
<tr>
<td>
<%=product.Name %>
</td>
<td>
<%=product.Description %>
</td>
<td>
<%=product.Rate.ToString("G")
%>
</td>
</tr>
<%} %>
</tbody>
</table>
</fieldset>
<input type="submit" name="send" id="send" value="Send to Admin to Generate Bill.....!" />
<%=Html.ValidationSummary()
%>
</div>
<%} %>
</fieldset>
</div>
</body>
</html>
Step 5:- Create Done view in Views folder in your mvc applivation.
Done.aspx:-
<%@
Page Language="C#" Inherits="System.Web.Mvc.ViewPage" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
>
<head id="Head1" runat="server">
<title>Done</title>
</head>
<body>
<div>
<h2>Sent</h2>
your Request is send thank you for
purchasing.......!
</div>
</body>
</html>
0 comments:
Post a Comment