pynovice
pynovice

Reputation: 7752

How to use jquery-modal dialog box in this situation?

I am already using tablesorter.js which is dependent on jquery.js file. Now, I am trying to use the modal dialog which turns out to be dependent on jquery-1.9.1.js. Since 2 jqueries can't be on the same template how can I get both tablesorter.js and jquery dialog to work together? If I remove jquery.js and only include jquery-1.9.1.js, I get:

Uncaught TypeError: Object [object Object] has no method 'tablesorter'

Error.

And if I remove jquery-1.9.1.js and include only jquery.js then I get the following error:

Uncaught TypeError: Object #<Object> has no method 'dialog' 

I am using Javascript and css like this:

<script type="text/javascript" src="{{ STATIC_URL }}/js/jquery-latest.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}/js/jquery.tablesorter.js"></script>

 <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

Upvotes: 0

Views: 318

Answers (2)

Chamika Sandamal
Chamika Sandamal

Reputation: 24322

You need to remove following line,

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>

and it should looks like,

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />  
<script type="text/javascript" src="{{ STATIC_URL }}/js/jquery-latest.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}/js/jquery.tablesorter.js"></script>  
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

Upvotes: 1

Snake Eyes
Snake Eyes

Reputation: 16764

Your code

<script type="text/javascript" src="{{ STATIC_URL }}/js/jquery-latest.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}/js/jquery.tablesorter.js"></script>

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

Contains two jquery libraries.

<script type="text/javascript" src="{{ STATIC_URL }}/js/jquery-latest.js"></script>

and

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>

Choose one. Try this

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}/js/jquery.tablesorter.js"></script>

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />

If an error is occured again then try to post additional code.

Upvotes: 1

Related Questions