Click here to Skip to main content
Click here to Skip to main content
Add your own
alternative version
Go to top

View, View Controller, Model Controller, Model (VVCMCM) Pattern

, 18 Mar 2012
The MVC Pattern was first conceptualized assuming all the three actors were present at one place. Since Web Applications have both a client and a server this needs to be applied differently without technology bias.
VVCMCMSystem.zip
VVCMCMSystem
VVCMCM
VVCMCMSystem.suo
App_Data
bin
Model
ModelControllers
obj
Debug
Refactor
TempPE
VVCMCM.dll
VVCMCM.pdb
Properties
Scripts
JqGrid
i18n
JqueryUI
Themes
jqgrid
start
images
ui-bg_flat_55_999999_40x100.png
ui-bg_flat_75_aaaaaa_40x100.png
ui-bg_glass_45_0078ae_1x400.png
ui-bg_glass_55_f8da4e_1x400.png
ui-bg_glass_75_79c9ec_1x400.png
ui-bg_gloss-wave_45_e14f1c_500x100.png
ui-bg_gloss-wave_50_6eac2c_500x100.png
ui-bg_gloss-wave_75_2191c0_500x100.png
ui-bg_inset-hard_100_fcfdfd_1x100.png
ui-icons_0078ae_256x240.png
ui-icons_056b93_256x240.png
ui-icons_d8e7f3_256x240.png
ui-icons_e0fdff_256x240.png
ui-icons_f5e175_256x240.png
ui-icons_f7a50d_256x240.png
ui-icons_fcd113_256x240.png
ui-lightness
images
ui-bg_diagonals-thick_18_b81900_40x40.png
ui-bg_diagonals-thick_20_666666_40x40.png
ui-bg_flat_10_000000_40x100.png
ui-bg_glass_100_f6f6f6_1x400.png
ui-bg_glass_100_fdf5ce_1x400.png
ui-bg_glass_65_ffffff_1x400.png
ui-bg_gloss-wave_35_f6a828_500x100.png
ui-bg_highlight-soft_100_eeeeee_1x100.png
ui-bg_highlight-soft_75_ffe45c_1x100.png
ui-icons_222222_256x240.png
ui-icons_228ef1_256x240.png
ui-icons_ef8c08_256x240.png
ui-icons_ffd27a_256x240.png
ui-icons_ffffff_256x240.png
ViewControllers
ViewEvents
Views
VVCMCM.csproj.user
.ui-jqgrid
{
	position:relative;
	font-size:11px;
	}
.ui-jqgrid .ui-jqgrid-view
{
	position:relative;
	left:0;
	top:0;
	padding:.0em;
	}
.ui-jqgrid .ui-jqgrid-titlebar
{
	padding:.3em .2em .2em .3em;
	position:relative;
	border-left:0 none;
	border-right:0 none;
	border-top:0 none;
	}
.ui-jqgrid .ui-jqgrid-title
{
	float:left;
	margin:.1em 0 .2em;
	}
.ui-jqgrid .ui-jqgrid-titlebar-close
{
	position:absolute;
	top:50%;
	width:19px;
	margin:-10px 0 0 0;
	padding:1px;
	height:18px;
	}
.ui-jqgrid .ui-jqgrid-titlebar-close span
{
	display:block;
	margin:1px;
	}
.ui-jqgrid .ui-jqgrid-titlebar-close:hover
{
	padding:0;
	}
.ui-jqgrid .ui-jqgrid-hdiv
{
	position:relative;
	margin:0;
	padding:0;
	overflow-x:hidden;
	overflow-y:auto;
	border-left:0 none!important;
	border-top:0 none!important;
	border-right:0 none!important;
	}
.ui-jqgrid .ui-jqgrid-hbox
{
	float:left;
	padding-right:20px;
	}
.ui-jqgrid .ui-jqgrid-htable
{
	table-layout:fixed;
	margin:0;
	}
.ui-jqgrid .ui-jqgrid-htable th
{
	height:22px;
	padding:0 2px 0 2px;
	}
.ui-jqgrid .ui-jqgrid-htable th div
{
	overflow:hidden;
	position:relative;
	height:17px;
	}
.ui-th-column,.ui-jqgrid .ui-jqgrid-htable th.ui-th-column
{
	overflow:hidden;
	white-space:nowrap;
	text-align:center;
	border-top:0 none;
	border-bottom:0 none;
	}
.ui-th-ltr,.ui-jqgrid .ui-jqgrid-htable th.ui-th-ltr
{
	border-left:0 none;
	}
.ui-th-rtl,.ui-jqgrid .ui-jqgrid-htable th.ui-th-rtl
{
	border-right:0 none;
	}
.ui-jqgrid .ui-th-div-ie
{
	white-space:nowrap;
	zoom:1;
	height:17px;
	}
.ui-jqgrid .ui-jqgrid-resize
{
	height:20px!important;
	position:relative;
	cursor:e-resize;
	display:inline;
	overflow:hidden;
	}
.ui-jqgrid .ui-grid-ico-sort
{
	overflow:hidden;
	position:absolute;
	display:inline;
	cursor:pointer!important;
	}
.ui-jqgrid .ui-icon-asc
{
	margin-top:-3px;
	height:12px;
	}
.ui-jqgrid .ui-icon-desc
{
	margin-top:3px;
	height:12px;
	}
.ui-jqgrid .ui-i-asc
{
	margin-top:0;
	height:16px;
	}
.ui-jqgrid .ui-i-desc
{
	margin-top:0;
	margin-left:13px;
	height:16px;
	}
.ui-jqgrid .ui-jqgrid-sortable
{
	cursor:pointer;
	}
.ui-jqgrid tr.ui-search-toolbar th
{
	border-top-width:1px!important;
	border-top-color:inherit!important;
	border-top-style:ridge!important;
	}
tr.ui-search-toolbar input
{
	margin:1px 0 0 0;
	}
tr.ui-search-toolbar select
{
	margin:1px 0 0 0;
	}
.ui-jqgrid .ui-jqgrid-bdiv
{
	position:relative;
	margin:0;
	padding:0;
	overflow:auto;
	text-align:left;
	}
.ui-jqgrid .ui-jqgrid-btable
{
	table-layout:fixed;
	margin:0;
	}
.ui-jqgrid tr.jqgrow td
{
	font-weight:normal;
	overflow:hidden;
	white-space:pre;
	height:22px;
	padding:0 2px 0 2px;
	border-bottom-width:1px;
	border-bottom-color:inherit;
	border-bottom-style:solid;
	}
.ui-jqgrid tr.ui-row-ltr td
{
	text-align:left;
	border-right-width:1px;
	border-right-color:inherit;
	border-right-style:solid;
	}
.ui-jqgrid tr.ui-row-rtl td
{
	text-align:right;
	border-left-width:1px;
	border-left-color:inherit;
	border-left-style:solid;
	}
.ui-jqgrid td.jqgrid-rownum
{
	padding:0 2px 0 2px;
	margin:0;border:0 none;
	}
.ui-jqgrid .ui-jqgrid-resize-mark
{
	width:2px;
	left:0;
	background-color:#777;
	cursor:e-resize;
	cursor:col-resize;
	position:absolute;
	top:0;
	height:100px;
	overflow:hidden;
	display:none;
	border:0 none;
	}
.ui-jqgrid .ui-jqgrid-sdiv
{
	position:relative;
	margin:0;
	padding:0;
	overflow:hidden;
	border-left:0 none!important;
	border-top:0 none!important;
	border-right:0 none!important;
	}
.ui-jqgrid .ui-jqgrid-ftable
{
	table-layout:fixed;
	margin-bottom:0;
	}
.ui-jqgrid tr.footrow td
{
	font-weight:bold;
	overflow:hidden;
	white-space:nowrap;
	height:21px;
	padding:0 2px 0 2px;
	border-top-width:1px;
	border-top-color:inherit;
	border-top-style:solid;
	}
.ui-jqgrid tr.footrow-ltr td
{
	text-align:left;
	border-right-width:1px;
	border-right-color:inherit;
	border-right-style:solid;
	}
.ui-jqgrid tr.footrow-rtl td
{
	text-align:right;
	border-left-width:1px;
	border-left-color:inherit;
	border-left-style:solid;
	}
.ui-jqgrid .ui-jqgrid-pager
{
	border-left:0 none!important;
	border-right:0 none!important;
	border-bottom:0 none!important;
	margin:0!important;
	padding:0!important;
	position:relative;
	height:25px;
	white-space:nowrap;
	overflow:hidden;
	}
.ui-jqgrid .ui-pager-control
{
	position:relative;
	}
.ui-jqgrid .ui-pg-table
{
	position:relative;
	padding-bottom:2px;
	width:auto;
	margin:0;
	}
.ui-jqgrid .ui-pg-table td
{
	font-weight:normal;
	vertical-align:middle;
	padding:1px;
	}
.ui-jqgrid .ui-pg-button
{
	height:19px!important;
	}
.ui-jqgrid .ui-pg-button span
{
	display:block;
	margin:1px;
	float:left;
	}
.ui-jqgrid .ui-pg-button:hover
{
	padding:0;
	}
.ui-jqgrid .ui-state-disabled:hover
{
	padding:1px;
	}
.ui-jqgrid .ui-pg-input
{
	height:13px;
	font-size:.8em;
	margin:0;
	}
.ui-jqgrid .ui-pg-selbox
{
	font-size:.8em;
	line-height:18px;
	display:block;
	height:18px;
	margin:0;
	}
.ui-jqgrid .ui-separator
{
	height:18px;
	border-left:1px solid #ccc;
	border-right:1px solid #ccc;
	margin:1px;
	float:right;
	}
.ui-jqgrid .ui-paging-info
{
	font-weight:normal;
	height:19px;
	margin-top:3px;
	margin-right:4px;
	}
.ui-jqgrid .ui-jqgrid-pager .ui-pg-div
{
	padding:1px 0;
	float:left;
	list-style-image:none;
	list-style-position:outside;
	list-style-type:none;
	position:relative;
	}
.ui-jqgrid .ui-jqgrid-pager .ui-pg-button
{
	cursor:pointer;
	}
.ui-jqgrid .ui-jqgrid-pager .ui-pg-div span.ui-icon
{
	float:left;margin:0 2px;
	}
.ui-jqgrid td input,.ui-jqgrid td select .ui-jqgrid td textarea
{
	margin:0;
	}
.ui-jqgrid td textarea
{
	width:auto;
	height:auto;
	}
.ui-jqgrid .ui-jqgrid-toppager
{
	border-left:0 none!important;
	border-right:0 none!important;
	border-top:0 none!important;
	margin:0!important;
	padding:0!important;
	position:relative;
	height:25px!important;
	white-space:nowrap;
	overflow:hidden;
	}
.ui-jqgrid .ui-jqgrid-btable .ui-sgcollapsed span
{
	display:block;
	}
.ui-jqgrid .ui-subgrid
{
	margin:0;
	padding:0;
	width:100%;
	}
.ui-jqgrid .ui-subgrid table
{
	table-layout:fixed;
	}
.ui-jqgrid .ui-subgrid tr.ui-subtblcell td
{
	height:18px;
	border-right-width:1px;
	border-right-color:inherit;
	border-right-style:solid;
	border-bottom-width:1px;
	border-bottom-color:inherit;
	border-bottom-style:solid;
	}
.ui-jqgrid .ui-subgrid td.subgrid-data
{
	border-top:0 none!important;
	}
.ui-jqgrid .ui-subgrid td.subgrid-cell
{
	border-width:0 0 1px 0;
	}
.ui-jqgrid .ui-th-subgrid
{
	height:20px;
	}
.ui-jqgrid .loading
{
	position:absolute;
	top:45%;
	left:45%;
	width:auto;
	z-index:101;
	padding:6px;
	margin:5px;
	text-align:center;
	font-weight:bold;
	display:none;
	border-width:2px!important;
	}
.ui-jqgrid .jqgrid-overlay
{
	display:none;
	z-index:100;
	}
* html .jqgrid-overlay
{
	width:expression(this.parentNode.offsetWidth+'px');
	height:expression(this.parentNode.offsetHeight+'px');
	}
* .jqgrid-overlay iframe
{
	position:absolute;
	top:0;
	left:0;
	z-index:-1;
	width:expression(this.parentNode.offsetWidth+'px');
	height:expression(this.parentNode.offsetHeight+'px');
	}
.ui-jqgrid .ui-userdata
{
	border-left:0 none;
	border-right:0 none;
	height:21px;
	overflow:hidden;
	}
.ui-jqdialog
{
	display:none;
	width:300px;
	position:absolute;
	padding:.2em;
	font-size:11px;
	overflow:visible;
	}
.ui-jqdialog .ui-jqdialog-titlebar
{
	padding:.3em .2em;
	position:relative;
	}
.ui-jqdialog .ui-jqdialog-title
{
	margin:.1em 0 .2em;
	}
.ui-jqdialog .ui-jqdialog-titlebar-close
{
	position:absolute;
	top:50%;
	width:19px;
	margin:-10px 0 0 0;
	padding:1px;
	height:18px;
	}
.ui-jqdialog .ui-jqdialog-titlebar-close span
{
	display:block;
	margin:1px;
	}
.ui-jqdialog .ui-jqdialog-titlebar-close:hover,.ui-jqdialog .ui-jqdialog-titlebar-close:focus
{
	padding:0;
	}
.ui-jqdialog-content,.ui-jqdialog .ui-jqdialog-content
{
	border:0;
	padding:.3em .2em;
	background:none;
	height:auto;
	}
.ui-jqdialog .ui-jqconfirm
{
	padding:.4em 1em;
	border-width:3px;
	position:absolute;
	bottom:10px;
	right:10px;
	overflow:visible;
	display:none;
	height:80px;
	width:220px;
	text-align:center;
	}
.ui-jqdialog-content .FormGrid
{
	margin:0;
	}
.ui-jqdialog-content .EditTable
{
	width:100%;
	margin-bottom:0;
	}
.ui-jqdialog-content .DelTable
{
	width:100%;margin-bottom:0;
	}
.EditTable td input,.EditTable td select,.EditTable td textarea
{
	margin:0;
	}
.EditTable td textarea
{
	width:auto;
	height:auto;
	}
.ui-jqdialog-content td.EditButton
{
	text-align:right;
	border-top:0 none;
	border-left:0 none;
	border-right:0 none;
	padding-bottom:5px;
	padding-top:5px;
	}
.ui-jqdialog-content td.navButton
{
	text-align:center;
	border-left:0 none;
	border-top:0 none;
	border-right:0 none;
	padding-bottom:5px;
	padding-top:5px;
	}
.ui-jqdialog-content .CaptionTD
{
	text-align:left;
	vertical-align:top;
	border-left:0 none;
	border-right:0 none;
	border-bottom:0 none;
	padding:1px;
	white-space:nowrap;
	}
.ui-jqdialog-content .DataTD
{
	padding:1px;
	border-left:0 none;
	border-right:0 none;
	border-bottom:0 none;
	vertical-align:top;
	}
.ui-jqdialog-content .form-view-data
{
	white-space:pre;
	}
.fm-button
{
	display:inline-block;
	margin:0 4px 0 0;
	padding:.4em .5em;
	text-decoration:none!important;
	cursor:pointer;
	position:relative;
	text-align:center;
	zoom:1;
	}
.fm-button-icon-left
{
	padding-left:1.9em;
	}
.fm-button-icon-right
{
	padding-right:1.9em;
	}
.fm-button-icon-left .ui-icon
{
	right:auto;
	left:.2em;
	margin-left:0;
	position:absolute;
	top:50%;
	margin-top:-8px;
	}
.fm-button-icon-right .ui-icon
{
	left:auto;
	right:.2em;
	margin-left:0;
	position:absolute;
	top:50%;
	margin-top:-8px;
	}
#nData,#pData
{
	float:left;
	margin:3px;
	padding:0;
	width:15px;
	}
.ui-jqgrid .selected-row,div.ui-jqgrid .selected-row td
{
	font-style:normal;
	border-left:0 none;
	}
.ui-jqgrid .tree-wrap
{
	float:left;
	position:relative;
	height:18px;
	white-space:nowrap;
	overflow:hidden;
	}
.ui-jqgrid .tree-minus
{
	position:absolute;
	height:18px;
	width:18px;
	overflow:hidden;
	}
.ui-jqgrid .tree-plus
{
	position:absolute;
	height:18px;
	width:18px;
	overflow:hidden;
	}
.ui-jqgrid .tree-leaf
{
	position:absolute;
	height:18px;
	width:18px;
	overflow:hidden;
	}
.ui-jqgrid .treeclick
{
	cursor:pointer;
	}
.jqmOverlay
{
	background-color:#000;
	}
* iframe.jqm
{
	position:absolute;
	top:0;
	left:0;
	z-index:-1;
	width:expression(this.parentNode.offsetWidth+'px');
	height:expression(this.parentNode.offsetHeight+'px');
	}
.ui-jqgrid-dnd tr td
{
	border-right-width:1px;
	border-right-color:inherit;
	border-right-style:solid;
	height:20px;
	}
.ui-jqgrid .ui-jqgrid-title-rtl
{
	float:right;margin:.1em 0 .2em;
	}
.ui-jqgrid .ui-jqgrid-hbox-rtl
{
	float:right;padding-left:20px;
	}
.ui-jqgrid .ui-jqgrid-resize-ltr
{
	float:right;
	margin:-2px -2px -2px 0;
	}
.ui-jqgrid .ui-jqgrid-resize-rtl
{
	float:left;
	margin:-2px 0 -1px -3px;
	}
.ui-jqgrid .ui-sort-rtl
{
	left:0;
	}
.ui-jqgrid .tree-wrap-ltr
{
	float:left;
	}
.ui-jqgrid .tree-wrap-rtl
{
	float:right;
	}
.ui-jqgrid .ui-ellipsis
{
	text-overflow:ellipsis;
	-moz-binding:url('ellipsis-xbl.xml#ellipsis');
	}
.ui-searchFilter
{
	display:none;
	position:absolute;
	z-index:770;
	overflow:visible;
	}
.ui-searchFilter table
{
	position:relative;
	margin:0;
	width:auto;
	}
.ui-searchFilter table td
{
	margin:0;
	padding:1px;
	}
.ui-searchFilter table td input,.ui-searchFilter table td select
{
	margin:.1em;
	}
.ui-searchFilter .ui-state-default
{
	cursor:pointer;
	}
.ui-searchFilter .divider
{
	height:1px;
	}
.ui-searchFilter .divider div
{
	background-color:black;
	height:1px;
	}

By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.

If a file you wish to view isn't highlighted, and is a text file (not binary), please let us know and we'll add colourisation support for it.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

Anton Pious Alfred
Architect Riversand Technologies Inc
India India
Head of Engineering at Riversand Technologies Inc.

| Advertise | Privacy | Mobile
Web01 | 2.8.140922.1 | Last Updated 18 Mar 2012
Article Copyright 2012 by Anton Pious Alfred
Everything else Copyright © CodeProject, 1999-2014
Terms of Service
Layout: fixed | fluid