Question

我希望Modal显示ASP.NET MVC应用程序中Edit form所做的所有更改。如果用户未进行任何更改，则不应显示Modal。

我编写的JavaScript代码显示了这些更改，但我认为这不是正确的方法。

我有一个模态，点击Submit按钮即可打开。

我的JavaScript代码是：

<script type="text/javascript">
    var FirstName = "@Html.Raw(ViewBag.FName)";
    var LastName = "@Html.Raw(ViewBag.LName)";
    var NameAddress = "@Html.Raw(ViewBag.NameAddress)";
    $(document).ready(function () {
        $("#btnSubmit").click(function () {
            if ($("#FName").val() == FirstName  && ("#LName").val() == LastName  && ("#Address").val() == NameAddress ) {

                alert("There is no value changed in textbox");
            }
            else {
              alert("First Name changed from:" + FirstName + " to " + $("#FName").val());          
            } 

        });

    });
</script>

显示更改的模式：

<input type="submit" id="btnSubmit" value="Save" class="btn btn-primary" data-toggle="modal" data-target="#ListofChanges" />

 <div id="ListofChanges" class="modal fade" role="dialog">
        <div class="modal-dialog">

               <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                    <h4 class="modal-title">PhoneBook Details changed from</h4>
                </div>
                <div class="modal-body">

                    <ul>
                        <li>
                            "@Html.Raw(ViewBag.FName)"
                        </li>
                        <li>
                            "@Html.Raw(ViewBag.LName)"
                        </li>
                        <li>
                            "@Html.Raw(ViewBag.NameAddress)"
                        </li>
                    </ul>

                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                </div>
            </div>

        </div>
    </div>

请指导我。我陷入了困境。谢谢。

Answer 1

您必须使用模态方法将其打开：

import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { SplashScreen } from '@ionic-native/splash-screen';
import { StatusBar } from '@ionic-native/status-bar';

import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';
import { TestPage } from '../pages/test/test';

import { Geolocation } from '@ionic-native/geolocation';

import { MessageServiceProvider } from '../providers/message-service/message-service';

@NgModule({
  declarations: [
    MyApp,
    HomePage,
    TestPage
  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp)
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    HomePage,
    TestPage
  ],
  providers: [
    StatusBar,
    SplashScreen,
    {provide: ErrorHandler, useClass: IonicErrorHandler},
    MessageServiceProvider,
    Geolocation
  ]
})
export class AppModule {}

Docs here to Modal methods

想要在ASP.NET MVC应用程序的“编辑”窗体中显示Modal弹出窗口中的更改

1 个答案: