bravo14 Posted September 19, 2011 Share Posted September 19, 2011 Hi Guys I hope you can help me, I have a page that uses certain jquery plugins, but I am not sure if having all of the plugins listed has caused some kind of conflict that stops some of them working. The html that is delivered to the browser is as follows <!doctype html public "-//W3C//DTD HTML 4.0 //EN"> <html> <head> <title>Trade-Bidz :: View Lot :: RENAULT SCENIC EXPRESSION 16V A MPV</title> <link rel="stylesheet" href="css/validationEngine.jquery.css" type="text/css"/> <link rel="stylesheet" href="css/template.css" type="text/css"/> <script src="js/jquery-1.6.min.js" type="text/javascript"> </script> <script src="js/languages/jquery.validationEngine-en.js" type="text/javascript" charset="utf-8"> </script> <script src="js/jquery.validationEngine.js" type="text/javascript" charset="utf-8"> </script> <script src="js/contrib/other-validations.js" type="text/javascript" charset="utf-8"> </script> <script> jQuery(document).ready(function(){ // binds form submission and fields to the validation engine jQuery("#formID").validationEngine(); }); </script> <script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script> <link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" /> <link href="style/trade-bidz.css" rel="stylesheet" type="text/css" /> <link rel="stylesheet" href="http://jqueryui.com/themes/base/jquery.ui.all.css"> <script src="http://jqueryui.com/ui/jquery.ui.core.js"></script> <script src="http://jqueryui.com/ui/jquery.ui.widget.js"></script> <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js'></script> <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.7/jquery-ui.min.js'></script> <script type='text/javascript' src='source/jquery.tag.js'></script> <link media="screen" rel="stylesheet" href="css/jquery.tag.css" type="text/css" /> <link media="screen" rel="stylesheet" href="css/jquery-ui.custom.css" type="text/css" /> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/jquery.lightbox-0.5.js"></script> <link rel="stylesheet" type="text/css" href="style/jquery.lightbox-0.5.css" media="screen" /> <script type="text/javascript"> $(function() { $('.gallery a').lightBox(); }); </script> </head> <body> <table> <tr> <td colspan="2"> <div id="header"> <div id="login_form"> <a href="logout.php">Logout</a></div> <img src="images/logo.jpg" width="300" /></div> </td> </tr> <tr> <tr> <td colspan="2"> <div id="nav_head"> <ul> <li><a href="index.php">Home</a></li> <li><a href="browse.php">Buying</a></li> <li><a href="sell-vehicle.php">Selling</a></li> <li><a href="contact-us.php">Contact Us</a></li> <li><a href="terms.php">Terms</a></li> <li><a href="my-trade-bidz.php">My Trade-Bidz</a></li> <li><a href="how-it-works.php">How It Works</a></li> </ul> </div> </td> </tr> <tr> <td width="200"> <div class="left_column_box"> <h3>Search Items</h3> <form method="post" action="browse.php"> <table width="100%"> <tr><td>Make:</td> <td><select name="make" onchange="reload(this.form)"> <option selected="selected">Please select...</option> <option value="MG">MG</option><option value="RENAULT">RENAULT</option> </select></td> </tr> <tr><td>Model:</td><td> <select name="model"> <option>Select Make</option> </select> </td></tr> <tr><td>Style:</td><td></td></tr> <tr><td></td><td><input type="submit" name="make_model_search" value="Search"/></td></tr> </table> </form> </div> <div class="left_column_box"> <h3>Ending Soon</h3> There are no lots completing today </div> <div class="left_column_box"> <h3>Other Selected Lots</h3> <div class="mini_lot"> <h4>MG ZR</h4> <img src="photos/"/><br/> Current Bid: £1234<br/> Time Left: Countdown will go here<br/> <a href="lot.php?lot_id=38">View Lot</a><br/> </div><div class="mini_lot"> <h4>MG ZR</h4> <img src="photos/"/><br/> Current Bid: £12<br/> Time Left: Countdown will go here<br/> <a href="lot.php?lot_id=37">View Lot</a><br/> </div><div class="mini_lot"> <h4>RENAULT SCENIC EXPRESSION 16V A</h4> <img src="photos/"/><br/> Current Bid: £12<br/> Time Left: Countdown will go here<br/> <a href="lot.php?lot_id=36">View Lot</a><br/> </div> </div> </td> <td> User ID: 42<br /> Seller ID: 39<br /> Allowed to Bid: yes<br /> Allowed to Watch: no<br /> <div id="bidder_message">You are the current high bidderYou are currently watching this item</div><img src="photos/20.jpg"/> <div id="countdown">This lot ends is <span class="countdown">Insert Countdown here</span></div> <div id="TabbedPanels1" class="TabbedPanels"> <ul class="TabbedPanelsTabGroup"> <li class="TabbedPanelsTab" tabindex="0">Main Details</li> <li class="TabbedPanelsTab" tabindex="0">Photos</li> <li class="TabbedPanelsTab" tabindex="0">Damage</li> <li class="TabbedPanelsTab" tabindex="0">Seller Details</li> </ul> <div class="TabbedPanelsContentGroup"> <div class="TabbedPanelsContent"> <table> <tr> <td>Make/Model</td><td>RENAULT SCENIC EXPRESSION 16V A MPV</td></tr> <tr> <td>Date of Manufacture:</td><td></td></tr> <tr> <td>Date of First Registration:</td><td></td></tr> <tr> <td>Colour:</td><td>GREEN</td></tr> <tr> <td>Number of Doors:</td><td>5</td></tr> <tr> <td>Engine Size:</td><td>1598</td></tr> <tr> <td>Fuel Type:</td><td>PETROL</td></tr> <tr> <td>Gearbox Type:</td><td>TIPTRONIC AUTOMATIC</td></tr> <tr> <td>Previous Keepers:</td><td>1</td></tr> <tr> <td>BHP:</td><td>115.10</td></tr> <tr> <td>Emissions:</td><td>0.00</td></tr> <tr> <td>Tread Depths:</td> <td>F/O/S 0mm F/N/S 0mm</td> </tr> <tr> <td></td> <td>R/O/S 0mm R/N/S 0mm</td> </tr> <tr><td>Service History:</td><td>0</td></tr> <tr><td>Vehicle Condition:</td><td>Please select V </td></tr> <tr><td>MOT Date:</td> <td>0000-00-00</td> </tr> </table> </div> <div class="TabbedPanelsContent"> <div class="gallery"> <ul><li><a href="photos/20.jpg"><img src="photos/20.jpg" title=""/></a></li></ul> </div> </div> <div class="TabbedPanelsContent"> <img src="images/car-outline.jpg" id="img" /> </div> <div class="TabbedPanelsContent"> <h1>Seller Details</h1> </div> </div> </div> <script type="text/javascript"> <!-- var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1"); //--> </script> <div> <form id="formID" action="submit-bid.php" method="post"> <table width="60%"> <tr><td width="40%">Current Price</td><td>£3434</td></tr> <tr><td>Current High Bidder</td><td><a href="profile.php?p=42">Boyce Autos</a><input type="hidden" name="high_bidder" value="42" readonly="readonly" /></td></tr> <tr><td>Your Bid</td><td>£<input type="hidden" name="bidder" value="42" readonly="readonly" /> <input type="hidden" name="lot" value="34" readonly="readonly" /> <input type="text" class="validate[required,min[3484]]" id="bid" name="bid" /><br/>Please enter at least 3484</td></tr> <tr><td></td> <td>Once a Bid has been placed, a legal contract has been made between the bidder and the seller, the seller agrees to sell the vehicle once the reserve price has been met, the bidder agrees to purchase the vehicle once the reserve price has been met. If a bidder wants to retract a bid he or she must contact trade-bidz. Trade-bidz will monitor all bid retractions. Excessive retractions may result in a bidders membership being suspended. <br /><input type="checkbox" id="terms" class="validate[required] checkbox" name="terms" value="yes" /> By ticking this box you are agreeing to the above.<br /></td> </tr> <tr><td></td><td><input type="submit" name="submit" value="Submit Bid" /></td></tr> </table> </form> </div> </td> </tr> <tr> <td colspan="2"> </td> </tr> <tr> </body> <script> $(document).ready(function(){ $("#img").tag({ save: function(width,height,top_pos,left,label,the_tag){ $.post("ajax.php",{'action':'save','width':width,'height':height,'top':top_pos,'left':left,'label':label},function(id){ the_tag.setId(id); }); }, remove: function(id){ $.post("ajax.php",{'action':'delete','id':id}); } }); $.getJSON("ajax.php",{'action':'list'},function(tags){ $.each(tags, function(key,tag){ $("#img").addTag(tag.width,tag.height,tag.top,tag.left,tag.label,tag.id); }); }); }); </script> </html> There are a couple of Javascript errors listed on the page and they are: Message: Object doesn't support this property or method Line: 18 Char: 17 Code: 0 URI: http://www.trade-bidz.co.uk/lot.php?lot_id=34 Message: Object doesn't support this property or method Line: 220 Char: 4 Code: 0 URI: http://www.trade-bidz.co.uk/lot.php?lot_id=34 When they are used by themselves the plugins work, but now they have stopped. Any help would be much appreciated. Quote Link to comment https://forums.phpfreaks.com/topic/247432-possible-conflicts/ Share on other sites More sharing options...
Adam Posted September 19, 2011 Share Posted September 19, 2011 Try cleaning up the external scripts before anything else. Do you realise you're including the jQuery core three times? You also have the UI core twice. Quote Link to comment https://forums.phpfreaks.com/topic/247432-possible-conflicts/#findComment-1270671 Share on other sites More sharing options...
bravo14 Posted September 19, 2011 Author Share Posted September 19, 2011 Being as the different plugins are using a different version, do I just need to use the most recent version of jquery for all plugins? Quote Link to comment https://forums.phpfreaks.com/topic/247432-possible-conflicts/#findComment-1270681 Share on other sites More sharing options...
Adam Posted September 19, 2011 Share Posted September 19, 2011 Yeah. I doubt you'll run into any backwards-compatibility issues. Quote Link to comment https://forums.phpfreaks.com/topic/247432-possible-conflicts/#findComment-1270686 Share on other sites More sharing options...
bravo14 Posted September 21, 2011 Author Share Posted September 21, 2011 Which of the lines below would you recommend to be removed, or maybe moved to a new order. <script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script> <link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" /> <link href="style/trade-bidz.css" rel="stylesheet" type="text/css" /> <link rel="stylesheet" href="css/validationEngine.jquery.css" type="text/css"/> <link rel="stylesheet" href="css/template.css" type="text/css"/> <script src="js/jquery-1.6.min.js" type="text/javascript"> </script> <script src="js/languages/jquery.validationEngine-en.js" type="text/javascript" charset="utf-8"> </script> <script src="js/jquery.validationEngine.js" type="text/javascript" charset="utf-8"> </script> <script src="js/contrib/other-validations.js" type="text/javascript" charset="utf-8"> </script> <script> jQuery(document).ready(function(){ // binds form submission and fields to the validation engine jQuery("#formID").validationEngine(); }); </script> <link rel="stylesheet" href="http://jqueryui.com/themes/base/jquery.ui.all.css"> <script src="http://jqueryui.com/ui/jquery.ui.core.js"></script> <script src="http://jqueryui.com/ui/jquery.ui.widget.js"></script> <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.7/jquery-ui.min.js'></script> <script type='text/javascript' src='source/jquery.tag.js'></script> <link media="screen" rel="stylesheet" href="css/jquery.tag.css" type="text/css" /> <link media="screen" rel="stylesheet" href="css/jquery-ui.custom.css" type="text/css" /> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/jquery.lightbox-0.5.js"></script> <link rel="stylesheet" type="text/css" href="style/jquery.lightbox-0.5.css" media="screen" /> <script type="text/javascript"> $(function() { $('.gallery a').lightBox(); }); </script> Quote Link to comment https://forums.phpfreaks.com/topic/247432-possible-conflicts/#findComment-1271290 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.