Плагин JQuery SimpleModel и MVC - PullRequest
       15

Плагин JQuery SimpleModel и MVC

1 голос
/ 14 февраля 2010

Кто-нибудь когда-либо добивался успеха в том, чтобы подключить плагин SimpleModel jquery к asp.net mvc? Если да, то как вы это реализовали, я не могу даже отобразить диалоговое окно.

1 Ответ

3 голосов
/ 15 февраля 2010

Я предполагаю, что вы говорите о плагине jquery SimpleModel, найденном в http://www.ericmmartin.com/projects/simplemodal/, и что у вас уже есть базовая настройка приложения ASP.NET MVC.

Я собираюсь рассказать, как вы можете получить пример Basic Modal Dialog .

Загрузите файлы плагинов в ваше приложение ASP.NET MVC

  1. Загрузите пример по ссылке, приведенной выше, и распакуйте его.
  2. Скопируйте файлы basic.css и basic_ie.css в папку Content вашего приложения ASP.NET MVC.
  3. Также скопируйте папку img в папку Content вашего приложения ASP.NET MVC.
  4. Наконец, скопируйте файлы javascript из папки js в папку Scripts вашего приложения ASP.NET MVC.

Ссылка на таблицу стилей и файлы JavaScript в вашем приложении

Откройте файл Site.Master в папке Views \ Shared и вставьте приведенный ниже код перед тегом </head>

.
<link type='text/css' href='../../Content/basic.css' rel='stylesheet' media='screen' />
<!-- IE 6 "fixes" -->
<!--[if lt IE 7]>
<link type='text/css' href='../../Content/basic_ie.css' rel='stylesheet' media='screen' />
<![endif]-->

<script type='text/javascript' src='../../Scripts/jquery.js'></script>
<script type='text/javascript' src='../../Scripts/jquery.simplemodal.js'></script>
<script type='text/javascript' src='../../Scripts/basic.js'></script>

Наконец, вызовите диалоговое окно в вашем представлении

Например, в Index.aspx вы можете вставить следующий код:

<div id='basic-modal'><h2>Basic Modal Dialog</h2>
<p>A basic modal dialog with minimal styling and without any additional settings. There are a few CSS attributes set internally by SimpleModal, however, SimpleModal relies mostly on external CSS for the look and feel.</p>
<input type='button' name='basic' value='Demo' class='basic demo'/> or <a href='#' class='basic'>Demo</a>
</div>

<div id="basic-modal-content">
        <h3>Basic Modal Dialog</h3>
        <p>For this demo, SimpleModal is using this "hidden" data for its content. You can also populate the modal dialog with standard HTML or with DOM element(s).</p>
        <p>Examples:</p>
        <p><code>$('#basicModalContent').modal(); // jQuery object; this demo</code></p>
        <p><code>$.modal(document.getElementById('basicModalContent')); // DOM</code></p>
        <p><code>$.modal('&lt;p&gt;&lt;b&gt;HTML&lt;/b&gt; elements&lt;/p&gt;'); // HTML</code></p>

        <p><a href='http://www.ericmmartin.com/projects/simplemodal/'>More details...</a></p>
</div>

Надеюсь, это поможет.

Matrich

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...