defining jquery ready event in Partial View

Question

I have defined a $(document).ready() event in Site.Master page and I also want to define another $(document).ready() in one of my partial view (which is use to display msgs and error msgs), and I am calling this partial view in all pages and all partial view ...

the partial views are displayed in the page and also using modal popup ... so I tried to this but the ready event in partial view is not firing

I have few things to ask:

first, is it possible to do what i am trying to do ...
there are pages which have partial view and because of it a page has two $(document).ready() events so when the page is loaded, is there be any clashes between these two events ...

and if some body can provide wth some example ...

yup i m using ajax.beginform or ajax.actionlink when calling/updating partial view ... — Safran Ali, Aug 06 '11 at 13:28

score 6 · Accepted Answer · answered Aug 06 '11 at 13:27

Yes, you can include multiple ready event handlers on the page. You can put them in the site master, partial views, and view page itself -- as many as you need. They must all be enclosed in script tags. They will fire in the order that they are included in the final, rendered page. Note, you want to be careful to make sure that the partial is included only once on the page or that it doesn't matter if that handler is called multiple times.

Example (not complete):

Master:

 <script type="text/javascript" src="jquery.js"></script>
 <script type="text/javascript" src="jqueryui.js"></script>
 <script type="text/javascript">
      $(function() {
           // do something for whole page
      });
 </script>

 @Html.Partial( "ErrorDialog" )

Partial (ErrorDialog)

 <div id="errorDialog" style="display: none;" title="Error">
     <p>An error occurred</p>
 </div>
 <script type="text/javascript">
      $(function() {
          $('#errorDialog').dialog({
             modal: true,
             autoOpen: false,
             // more options
          });
      });

      function showError(msg) {
          $('#errorDialog').find('p').html(msg)
                           .stop()
                           .dialog('open');
      }
 </script>

this doesn't work if there are multiple partial views. the first partial view in the order will get its document ready triggered but not the second one. — Pinakin Shah, Oct 25 '11 at 07:39
@PinakinShah That shouldn't be true unless something in the first one is (a) failing or (b) prevents the other ones from running. You can have as many as you need. This should be true even if they are loaded via AJAX. I have a couple of pages that are very similar where I've split the code into two sections that are included independently based on whether some model property is present or not. Works like a charm. — tvanfosson, Oct 25 '11 at 11:59

score 5 · Answer 2 · edited May 23 '17 at 12:34

5

yes you are allowed to have multiple $(document).ready() in a page just make sure you have included jquery file before calling this function. Functions invoked inside $(document).ready() called in the order they are requested.

jQuery - multiple $(document).ready ...?

edited May 23 '17 at 12:34

Community

1
1

answered Aug 06 '11 at 13:24

Praveen Prasad

31,561
18
73
106

can you provide me wth any example, as i said i tried but the ready event in partial view is not firing up ... – Safran Ali Aug 06 '11 at 13:27
@dvlpr: i think tvanfosson has written it, if that doesnt solve ur problem, let us know!! – Praveen Prasad Aug 06 '11 at 13:31

score 1 · Answer 3 · answered May 14 '15 at 01:55

1

Yep, that's right, as long as previous partial view does not have any error you can have as many $(document).ready() as you want and it will fire for all.

answered May 14 '15 at 01:55

Jignesh Patel

61
1
4

defining jquery ready event in Partial View

3 Answers3