Показывать всплывающее окно после успешного обновления

Я хочу показать всплывающее окно после успешного обновления. Что я сделал этоПоказывать всплывающее окно после успешного обновления

В контроллере

var objContext = new KnittingdbContext(); 

     objContext.ProductTypes.Attach(producttype); 
     var obJBlog = objContext.Entry(producttype); 

     obJBlog.Property(a => a.ProductTypeCode).IsModified = true; 
     obJBlog.Property(a => a.ProductTypeName).IsModified = true; 
     objContext.SaveChanges(); 

     TempData["SuccessEdit"] = "a"; 

     return RedirectToAction("vwProductTypeIndex");

и vwProductTypeIndex зрения

@if (TempData["SuccessEdit"] != null) 
     { 
     <div class="green"> 
      <p style="color:green;">Updated Successfully</p> 
     </div> 
     }

Но проблема заключается в следующем показывает только текст.

У меня есть окно сообщение, созданное с помощью CSS

<!--popup model--> 
<div class="modal fade" id="basic" role="dialog" aria-labelledby="basic" aria-hidden="true"> 
    <div class="modal-dialog modal-sm"> 
     <div class="modal-content" style="background-color:#ffffff; borderolid 4px #44d775;margin-top:253px; left:-25px;"> 
      <div class="modal-header" style="background-color:#44d775; height:15px;"> 
       <button type="button" class="close" data-dismiss="modal" aria-hidden="true" style="margin-top:-12px;">x</button> 
       <span class="glyphicon glyphicon-ok" style=" color:yellow; font-size:large; top:-10px; left:115px;" aria-hidden="true"></span> 
       <h4 class="modal-title" id="myModalLabel" style="text-align:center;"></h4> 
      </div> 
      <p style="text-align:center; font-family:'Ebrima'; color:black; margin-top:15px;"> <strong> saved Successfully </strong></p> 

     </div> 
    </div> 
</div><!--/end popup model--

Я хочу, чтобы это всплывающее окно появляться вместо этого текста. Как я могу достичь этого? Заранее спасибо!

источник

2015-08-21 Isuru

Знаете ли вы о диалоговом окне JQuery и не знаете, как реализовать этот конкретный случай? – ssilas777

@ ssilas777, Спасибо, что ответили! :) Мой друг предоставил мне эту всплывающее окно. Но я не знаю, как реализовать его с моим проектом. Помощь Pls. – Isuru

Вы можете использовать Bootstrap режимные здесь как этот

@if(TempData["SuccessEdit"] !=null) 
{ 
    <div class="modal fade" role="dialog"> 
     <div class="modal-dialog"> 
      <!-- Modal content--> 
      <div class="modal-content"> 
       <div class="modal-header"> 
        <button type="button" class="close" data-dismiss="modal">&times;</button> 
        <h4 class="modal-title">Change Password</h4> 
       </div> 
       <div class="modal-body">      
        <div class="modal-footer"> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 
}

источник

2015-08-21 14:19:18

вам нужно добавить bootstrap js и bootstrap css на свою страницу. –

не работает. Я добавил bootsrap.js и bootstrap.css. А потом bootstrap.min.js. Но не получилось. Нужно ли мне использовать форму начала ajax вместо html begin form для этого. Beacause, я думаю, что призывать идентификатор этой модели является обязательным условием для ее работы. – Isuru

пытаются вашей сНу тега и передать идентификатор

<div class="green" data-toggle="modal" data-target="#basic"> 
     <p style="color:green;">Updated Successfully</p> 
    </div>

источник

2015-08-22 06:10:15

Это снова вызывает текст, и при нажатии на этот текстовый модальный режим запускается. Я хочу, чтобы модальность появилась прямо, не нажимая на текст. – Isuru

Сначала добавить модальность в конце вашего тела тега, или где бы вы ни находились:

<body> 
    <!-- your other codes --> 
    <div class="modal fade" id="basic" role="dialog" aria-labelledby="basic" aria-hidden="true"> 
     <div class="modal-dialog modal-sm"> 
      <div class="modal-content" style="background-color:#ffffff; borderolid 4px #44d775;margin-top:253px; left:-25px;"> 
       <div class="modal-header" style="background-color:#44d775; height:15px;"> 
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true" style="margin-top:-12px;">x</button> 
        <span class="glyphicon glyphicon-ok" style=" color:yellow; font-size:large; top:-10px; left:115px;" aria-hidden="true"></span> 
        <h4 class="modal-title" id="myModalLabel" style="text-align:center;"></h4> 
       </div> 
       <p style="text-align:center; font-family:'Ebrima'; color:black; margin-top:15px;"> <strong> saved Successfully </strong></p> 
      </div> 
     </div> 
    </div> 
</body>

И в скрипты раздел добавить следующий код:

@section Scripts { 
    @if((bool?)TempData["SuccessEdit"] ==true) 
    { 
     <script type="text/javascript"> 
      $(document).ready(function(){ 
       $('#basic').modal('show'); 
      }); 
     </script> 
    } 
}

Теперь вы можете добавить следующую строку в метод действия:

TempData["SuccessEdit"] = true;

Вы также должны добавить JQuery и bootstrap.js на ваш взгляд, как хорошо.

источник

2015-09-12 14:24:57

Показывать всплывающее окно после успешного обновления

ответ

Смежные вопросы