samedi 9 mai 2015

Is it safe to use jQuery in _Layout.cshtml for a large Angular application?

I realise this question is somewhat broad, but I'm hoping I can provide enough contextual detail to narrow it down a bit. In a project I am very new to, one of my tasks is to add a confirmation dialogue when the user clicks the logout link. I have changed the link as follows, in _Layout.cshtml:

<div class="row inner">
    @if (Request.IsAuthenticated)
    {
        using (Html.BeginForm("LogOff", "Account", FormMethod.Post, new { @id = "logoutForm", @class = "col-md-8 col-md-offset-2 rightText" }))
        {
            @Html.AntiForgeryToken()
            <a href="@Url.Action("CreateNewMlamApplication", "MlamApplication")"><img src="/img/icons/plusIcon.png" class="icon" /></a>
            <a href="@Url.Action("Index", "Home")"><img src="/img/icons/documentIcon.png" class="icon" /></a>
            @* BKMOD <a href="javascript:document.getElementById('logoutForm').submit()"><img src="/img/icons/gearIcon.png" class="icon" /></a>*@
            <a class="logout-link-confirm" href="#" ><img src="/img/icons/gearIcon.png" class="icon" /></a>
        }
    }
</div>

Then, I hook a handler up to logout-link-confirm, at the bottom of the layout:

    <script>
        $(function() {
            $(".logout-link-confirm").click(function() {
                $('#modalLogoutConfirmation').modal('show');
            });
            $(".logout-link-final").click(function () {
                $('#logoutForm').submit()
            });
        });
    </script>
    @RenderSection("scripts", required: false)
</body>

And in the modalLogoutConfirmation popup, I perform the actual logout when the user confirms their choice: $('#logoutForm').submit().

This has nothing to do with angular directly, as angular only kicks in on some of the body views in this layout, but it is loaded, and I am a little concerned of any side effects my jQuery may introduce.

Aucun commentaire:

Enregistrer un commentaire