JS in partialView never fired

Question

I have a partial view which contains some JS, but seems it's never fired :

My Partial :

@model List<String>

@if (Model != null)
{
foreach (var item in Model)
{
    <button id="application-@item" type="button"  class="btn btn-default" onclick="showUses('@item')">@item</button>
}
}


@section scripts
{
<script type="text/javascript">

    $(function () {
        alert("plop");
    });

        </script>
    }

Main view :

...
<div class="col-md-6 ">
    <h2>Applications</h2>
    <div id="Application" class="btn-group-vertical" role="group">
        @Html.Partial("_ApplicationPartial", null, new ViewDataDictionary())
    </div>
</div>
...
 @section scripts
{
    <script type="text/javascript">

        $(function () {

            $('[id^=univers]').click(function () {

                var selectedButton = $(this).attr('id');
                var selectedUniverse = selectedButton.substring(selectedButton.indexOf('-') + 1, selectedButton.lenght);

                $("#Application").load('@(Url.Action("Application", "UseAndNeed", null, Request.Url.Scheme))?idUniverse=' + selectedUniverse);
            });
        });

    </script>
}

The alert is supposed to be fired when the page is loaded, and as well when i use the load() to refresh the partialView content.

Is it the normal behaviour, JS is never fired in a partialView or do i miss something?

In my experience scripts loaded in partialViews do not get the $(document).ready event, so I usually import scripts in my main view. Though i'm not too experienced yet with .net mvc, so I could be wrong — Glubus, Dec 24 '15 at 09:10
Check this link. http://stackoverflow.com/questions/9504315/what-exactly-document-ready-means-in-jquery/9504352#9504352 And what are you looking for? I can suggest an alternate way. Call you view using ajax and on complete you can trigger your function. Document.ready means that when document is ready and your document is already ready. — Kaushik, Dec 24 '15 at 09:10
Actually when i call load() i'll refresh some data contained in the partial, but i need to refresh a data contained in the main view as well... don't know exactly how to do as i receive refreshed data in the partialView model... And i would like to avoid refreshing all the view — Lempkin, Dec 24 '15 at 09:13
Yes you can do whatever you want. Instead of calling `load` use `$.ajax({})` method. on `complete` of `ajax` call call your function and change whatever u want. — Kaushik, Dec 24 '15 at 09:14

Kaushik · Accepted Answer · 2015-12-24T09:37:29.560

0

In partial views document.ready() will not trigger.

You can do this in following way

$.ajax({
type:'get',
url:'/.....',
cache:false,
success:function(){/* Set your records here. Use the returns view hidden variables. */....},
complete:function(){ /*Call your partial view functions here */ }
});

In success call you can populate your partial grid.

like

$('#selector').html(Response);

edited Dec 24 '15 at 09:37

answered Dec 24 '15 at 09:32

Kaushik

2,072
1
23
31

JS in partialView never fired

1 Answers1