PopUp | C# Online Compiler

PopUp by TobyMosque

using System;

namespace SampleApp
{
	public class Opcao
	{		
		public int ID { get; set; }
		public string Descricao { get; set; }
	}
}

Model

​x
 
using System;
​
namespace SampleApp
{
    public class Opcao
    {       
        public int ID { get; set; }
        public string Descricao { get; set; }
    }
}

@model IEnumerable<SampleApp.Opcao>
@{
	Layout = null;
}

<!DOCTYPE html>
<!-- template from http://getbootstrap.com/getting-started -->

<html lang="en">
	<head>
		<link rel="stylesheet" type="text/css" href="http://cdn.foundation5.zurb.com/foundation.css">
		<script type="text/javascript" src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
		<script type="text/javascript" src="http://cdn.foundation5.zurb.com/foundation.js"></script>
	</head>	
	<body>
		<div class="container">
			<a href="#" data-reveal-id="modal">Abrir PopUp</a>
			<div id="modal" class="reveal-modal" data-reveal>
				<p>
					@Html.Label("Opcoes", "Opcoes")
					@Html.DropDownList("Opcoes", Model.Select(item => new SelectListItem {
						Value = item.ID.ToString(),
						Text  = item.Descricao
					}))
				</p>
				<a class="close-reveal-modal" aria-label="Close">×</a>
			</div>
		</div>		
		<script type="text/javascript">		
			$(function () {
				$(document).foundation();		
			});
		</script>
	</body>
</html>

View

 
@model IEnumerable<SampleApp.Opcao>
@{
    Layout = null;
}
​
<!DOCTYPE html>
<!-- template from http://getbootstrap.com/getting-started -->
​
<html lang="en">
    <head>
        <link rel="stylesheet" type="text/css" href="http://cdn.foundation5.zurb.com/foundation.css">
        <script type="text/javascript" src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
        <script type="text/javascript" src="http://cdn.foundation5.zurb.com/foundation.js"></script>
    </head> 
    <body>
        <div class="container">
            <a href="#" data-reveal-id="modal">Abrir PopUp</a>
            <div id="modal" class="reveal-modal" data-reveal>
                <p>
                    @Html.Label("Opcoes", "Opcoes")
                    @Html.DropDownList("Opcoes", Model.Select(item => new SelectListItem {
                        Value = item.ID.ToString(),
                        Text  = item.Descricao
                    }))
                </p>
                <a class="close-reveal-modal" aria-label="Close">×</a>
            </div>
        </div>      
        <script type="text/javascript">     
            $(function () {
                $(document).foundation();       
            });
        </script>
    </body>
</html>
​

using System;
using System.Web.Mvc;
using System.Collections.Generic;

namespace SampleApp
{
	public class HomeController : Controller
	{
		[HttpGet]
		public ActionResult Index()
		{
			var opcoes = new List<Opcao>();
			for (int i = 1; i <= 15; i++) 
			{
				opcoes.Add(new Opcao { 
					ID = i, 
					Descricao = Guid.NewGuid().ToString()
				});
			}
			return View(opcoes);
		}

	}
}

Controller

 
using System;
using System.Web.Mvc;
using System.Collections.Generic;
​
namespace SampleApp
{
    public class HomeController : Controller
    {
        [HttpGet]
        public ActionResult Index()
        {
            var opcoes = new List<Opcao>();
            for (int i = 1; i <= 15; i++) 
            {
                opcoes.Add(new Opcao { 
                    ID = i, 
                    Descricao = Guid.NewGuid().ToString()
                });
            }
            return View(opcoes);
        }
​
    }
}

View in Full Screen

View IL Code