@model HelloWorldMvcApp.SampleViewModel
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bootstrap 101 Template</title>
font-family: 'Open Sans';
margin: 20px auto 0 auto;
#slider1 ul, #slider2 ul {
#slider1 ul li, #slider2 ul li {
a.control_prev1, a.control_next1,a.control_prev2, a.control_next2 {
a.control_prev1:hover, a.control_next1:hover,a.control_prev2:hover, a.control_next2:hover {
-webkit-transition: all 0.2s ease;
border-radius: 0 2px 2px 0;
border-radius: 2px 0 0 2px;
border-radius: 0 2px 2px 0;
border-radius: 2px 0 0 2px;
font: 12px Helvetica, Arial, sans-serif;
border-bottom: 2px solid #ddd;
/* Content Positioning and Size */
/* width:100px; height:100px; position:relative;*/
/* height:72px;*/ /*width:68px;*/ /*position:absolute;*/ /* background:url('../images/buttons.png') no-repeat;*/ /* top:50%;*/ /* margin-top:-36px;*/
z-index: 2000; /* background-position:left top;*/ /*left:0*/
.container .prevButton:hover
background-position: left bottom; /*left:0;*/
/* height:72px;*/ /*width:68px;*/ /* position:absolute;*/
background: url('../images/buttons.png') no-repeat; /* top:50%;*/ /* margin-top:-36px;*/
z-index: 2000; /* background-position:right top;*/ /*right:0*/
.container .nextButton:hover
background-position: right bottom;
/* width:100px;*/ /*height:100px;*/
list-style: none outside none; /* position:relative;*/
.container li:first-child
display: list-item; /* position:absolute;*/
.validation-summary-valid
#loginForm .validation-error
#loginForm .validation-summary-errors ul
#loginForm .validation-summary-errors li
/* styles for validation helpers */
input.input-validation-error
border: 1px solid #e80c4d;
input[type="checkbox"].input-validation-error
.validation-summary-errors
.validation-summary-valid
<form action="" method="post" enctype="multipart/form-data">
<h1>Acciones Requeridas.</h1>
<p class="description">Acciones preventivas o correctivas.</p>
<h2>Accion requerida</h2>
<textarea rows="10" cols="60"></textarea>
<label>Administrador</label>
<label>Responsable</label><label>Alejandro Torres</label>
<label class="message-error" id="labelErrorFechaPromesa"> </label>
<h2>Archivos/Imagenes</h2>
<div id="reemplazarArchivos">
<a href="#" class="control_next1">>></a>
<a href="#" class="control_prev1"><</a>
@foreach(string s in Model.Rutas)
<img src="@s" heigth="100px" width="200px"/>
<input type="file" name="file" />
<input type="submit" name="action:UploadArchivoAccionApertura" value="Upload" />
<h2> Accion de cierre</h2>
<textarea rows="10" cols="60"></textarea>
<input type="submit" name="action:CierraAR" value="Cerrar"/>
<h2> Archivos/Imagenes</h2>
<div id="reemplazarArchivosCerrados">
<a href="#" class="control_next2">>></a>
<a href="#" class="control_prev2"><</a>
@foreach(string s in Model.Rutas)
<img src="@s" heigth="100px" width="200px"/>
<input type="file" name="file" />
<input type="submit" name="action:UploadArchivoAccionCierre" value="Upload" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<script src="//ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
<script src="//ajax.aspnetcdn.com/ajax/mvc/4.0/jquery.validate.unobtrusive.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function ($) {
$('#checkbox').change(function(){
setInterval(function () {
var slideCount = $('#slider1 ul li').length;
var slideWidth = $('#slider1 ul li').width();
var slideHeight = $('#slider1 ul li').height();
var slideCount = $('#slider2 ul li').length;
var slideWidth = $('#slider2 ul li').width();
var slideHeight = $('#slider2 ul li').height();
var sliderUlWidth = slideCount * slideWidth;
$('#slider1').css({ width: slideWidth, height: slideHeight });
$('#slider2').css({ width: slideWidth, height: slideHeight });
$('#slider1 ul').css({ width: sliderUlWidth, marginLeft: - slideWidth });
$('#slider2 ul').css({ width: sliderUlWidth, marginLeft: - slideWidth });
$('#slider1 ul li:last-child').prependTo('#slider1 ul');
$('#slider2 ul li:last-child').prependTo('#slider2 ul');
$('#slider1 ul').animate({
$('#slider1 ul li:last-child').prependTo('#slider1 ul');
$('#slider1 ul').css('left', '');
$('#slider2 ul').animate({
$('#slider2 ul li:last-child').prependTo('#slider2 ul');
$('#slider2 ul').css('left', '');
$('#slider1 ul').animate({
$('#slider1 ul li:first-child').appendTo('#slider1 ul');
$('#slider1 ul').css('left', '');
$('#slider2 ul').animate({
$('#slider2 ul li:first-child').appendTo('#slider2 ul');
$('#slider2 ul').css('left', '');
$('a.control_prev1').click(function () {
$('a.control_next1').click(function () {
$('a.control_prev2').click(function () {
$('a.control_next2').click(function () {