Can't execute javascript function on jQueryUI dialog

Question

I've got this problem. I open my jQueryUI dialog window, but I need to call some additional function on that. The point is, that content of the dialog is loaded by AJAX and I need to load any other content using AJAX as well (I have some kind of list on that and since the list may content huge amount of items, I need to split it into pages, into smaller amouts of data) Here is my code:

<script type="text/javascript">
    $(function() {
        loadObjects(1);
    });
    var loadObjects = function(page) {
        // do something
    };
</script>

My console keep telling me? TypeError: 'loadObjects' is not a function. But when I try to run this code not in the jQueryUI dialog (but on plane page), there is obviously no problem.

When I googled this error I only found out, that jQuery may be blocking any JS code on purpose, because of some IE explorer error.

Can anybody help me?

Thanks !

Shotgun Ninja · Accepted Answer · 2015-05-04 14:34:48Z

3

Put the loadObjects function declaration first.

<script type="text/javascript">
    var loadObjects = function(page) {
        // do something
    };
    $(function() {
        loadObjects(1);
    });
</script>

What you could (and probably should) be doing to avoid this is placing the function definition for loadObjects() into a separate JS file, then including that file in the page before you use anything from it. (The main exceptions to this, of course, are when you are unable to load JS files in the page, or when you need to generate the function definition dynamically, among other rare situations.)

edited May 4, 2015 at 14:34

Shotgun Ninja

2,5383 gold badges26 silver badges32 bronze badges

answered May 4, 2015 at 13:57

itinance

12.5k8 gold badges68 silver badges112 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Mikec007 Over a year ago

Thank alot! Totally helped to switch the definitions (first define function loadObjects and then the jQuery $(function() {}). And I actually do not want those simple JS functions in separate files. I have a lot of modal views to dialogs and the separate file would be a bit confusing, while keeping all that content. But thanks again!

Pratik · Accepted Answer · 2015-05-04 13:57:18Z

1

$(function() {
    var loadObjects = function(page) {
    // do something
    }

    loadObjects(1);        
});

Your function should be defined. once you define it, call it.

answered May 4, 2015 at 13:57

Pratik

1,1388 silver badges26 bronze badges

Comments

jmgross · Accepted Answer · 2015-05-04 14:28:59Z

0

When you use a jQuery dialog, you first need to be sure that the content is loaded. To achieve this, you can use the open event handler in your dialog initialization :

$( ".selector" ).dialog({
  open: function( event, ui ) {
      var loadObjects = function(page) {
       // do something
      };
      $(function() {
        loadObjects(1);
      });
  }
});

edited May 4, 2015 at 14:28

answered May 4, 2015 at 14:19

jmgross

2,3461 gold badge22 silver badges25 bronze badges

1 Comment

Mikec007 Over a year ago

Thanks, but actually I can't do that. I have a lot of modal views to dialogs, so I would to this definition to all views. But anyway thank you!

Collectives™ on Stack Overflow

Can't execute javascript function on jQueryUI dialog

3 Answers 3

1 Comment

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related