Request ajax accessing already included scripts

Asked

Viewed 294 times

0

Eae guys,

I have a view that renders a partial view.

Index.cshtml

<script type="text/javascript" src="~/Scripts/jquery-2.1.1.js"></script>

    <div class="tab-control" data-role="tab-control">
        <ul class="tabs">
            <li class="active">@Ajax.ActionLink(Resources.Base.Entry, "_List", "Entrada", null, new AjaxOptions() { UpdateTargetId = "_Content", InsertionMode = InsertionMode.Replace, LoadingElementId = "Div_Loading" })</li>
            <li>@Ajax.ActionLink(Resources.Base.Data, "_Edit", "Entrada", null, new AjaxOptions { UpdateTargetId = "_Content", InsertionMode = InsertionMode.Replace, LoadingElementId = "Div_Loading" }, new { id = "Dados" })</li>
        </ul>

        <div class="frames" id="_Content">
            @{Html.RenderPartial("_List");}
        </div>
    </div>

_List.cshtml

$(document).ready(function () {
    $.get("@Url.Action("_Grid", "Data")", function (data) {
        $('#con').replaceWith(data);
    });
});

This view I do the jQuery include on it but in the partial view with this code above it says that jQuery does not exist. If I re-include jquery on top of the above mentioned code it works normal.

There is a way to make all my ajax requests after the page load have access to the included scripts?

All of them are being loaded at the bottom of the page (before the "< body>")

Vlw!

Off: I noticed that there are some questions on Stackoverflow that is worth reputation, how can I ask such a question?

2 answers

1

In ASP.NET MVC, Scripts should not be placed in Partial Views for the simple fact that Partial Views can be reused in various parts of your code, causing a strange behavior of Scripts.

The correct is to put your scripts in @session scripts of his Index.cshtml:

@section scripts {
    <script type="text/javascript">
        $(document).ready(function () {
            $.get("@Url.Action("_Grid", "Data")", function (data) {
                $('#con').replaceWith(data);
            });
        });
    </script>
}

Na View Shared/_Layout.cshtml, shall have the following statement:

@RenderSection("scripts", required: false)

This is where the content of @section scripts.

  • And where should I call this @Section scripts?

  • @Trxplz0 I updated the response.

  • In case when I make the ajax request will it work? I load the page /controller/action it loads me this index.cshtml that renders _List.cshtml. From there all links within _List.cshtml loads via ajax giving replace in the content of the own div #con, which is found in _List.cshtml.

  • If the method of Controller return a Partial View as the answer suggests, yes.

  • I’ll test the answer. How I was going to put @Rendersection in Layout.cshtml for me would not work since Partialviews does not make use of Layout Master.

  • Yep, it doesn’t work like that, because partial views don’t make use of Layout.cshtml(master) that has Rendersection. The way is to do as you did at the time when ajax became a fever. Intercept the ajax request scripts and interpret manually. Vlw even by the help anyway!

Show 1 more comment

0


@Gypsy thanks for your help.

I solved the problem by putting the scripts in the head instead of placing before closing the tag body.

As I have read in various searches and benchmarks when placing the scripts at the bottom of the page the scripts load in parallel, which is of no use if you need to hack to get access to scripts or keep loading in ajax requests.

If the system has significant use of ajax recommend always loading the scripts at the top of the page, otherwise click before closing body so the visual part of the page is displayed faster even if the scripts have not yet been loaded.

There are several techniques to improve the performance and loading time, among them cache, minification, Bundles, etc...

Browser other questions tagged

You are not signed in. Login or sign up in order to post.