CODEWITHSUNDEEP
phpjqueryhtml
user626511
user626511

Reputation:

jQuery not responding when moved from HTML to PHP?

The Venkman debugger says this:

    $("#aboutbox") is null
[Break On This Error] $("#aboutbox").hide();

But I don't know what to do to fix it! It worked perfectly in HTML: http://leventhan.webfactional.com/static/ But when I moved it to PHP, it just stopped working.

Here's the index.php:

    <?php

require_once dirname(__FILE__)."/src/phpfreechat.class.php";
$params = array();
$params["title"] = "Quick chat";
$params["nick"] = "guest".rand(1,1000);  // setup the intitial nickname
$params['firstisadmin'] = true;
//$params["isadmin"] = true; // makes everybody admin: do not use it on production servers ;)
$params["serverid"] = md5(__FILE__); // calculate a unique id for this chat
$params["debug"] = false;
$chat = new phpFreeChat( $params );

?>
<!DOCTYPE html>
<html>
 <head>
  <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <title>phpFreeChat- Sources Index</title>
  <link rel="stylesheet" title="classic" type="text/css" href="style/styles.css" />
  <link rel="stylesheet" title="classic" type="text/css" href="style/content.css" />  
  <script type="text/javascript"src="http://maps.google.com/maps/api/js?sensor=false"></script>
  <script type="text/javascript" src="jquery-1.4.4.min.js"></script>
  <SCRIPT type="text/javascript" src="oracle.js"></SCRIPT>

<script type="text/javascript">
 // some google maps javascript code that works fine
 </script>
 </head>
 <body>

<header>
    <div id="aboutbox">
    <br>
    <p><strong>GeoChat is the perfect chat app to hatch your world domination plans. A place on the web where you can point to maps and chat at the same time. 
    A great way for teachers to teach and students to learn with an interactive map. </strong></p>
    </div>
    <div id ="nav">
        <h1>GeoChat</h1><h2><a href="#" id="changebg">Toggle background</a><a href="#" id="toggle">Chat Help</a><a href="#" id="about">What's all this about?</a></h2>
    </div>
    </header>

    <div id="map_canvas"></div>

<div class="content">
  <?php $chat->printChat(); ?>
  <?php if (isset($params["isadmin"]) && $params["isadmin"]) { ?>
  <?php } ?>
</div>

        <footer>
            <p>&#10084 Made by <strong><a href="http://cloudborn.me" id="name">Author</a></strong> with love.<a href="javascript:#" id="dirbutton">Go up &#8593</a></p>
        </footer>

</body></html>

Here's the live broken site: http://leventhan.webfactional.com/phpfreechat-1.3/

EDIT: Yeah, jQuery worked again when I commented out the chat app (phpFreeChat), this part: 

<div class="content">
  <?php $chat->printChat(); ?>
  <?php if (isset($params["isadmin"]) && $params["isadmin"]) { ?>
  <?php } ?>
</div>

And it turns out the problem is really because jQuery is conflicting with Prototype.js (phpFreeChat uses Prototype apparently.) The solution is to use:

jQuery.noConflict();

Upvotes: 0

Views: 276

Answers (3)

user626511
user626511

Reputation:

It worked! It was jQuery and Prototype not getting along with each other.

Here's what I did:

  1. add:

    jQuery.noConflict();

  2. change all occurences of:

    $(document).ready(function(){ to: jQuery(document).ready(function($)­ {

  3. in my external js do a find and replace.

    find: $ replace: jQuery (case sensitive).

Upvotes: 1

Felix Kling
Felix Kling

Reputation: 816462

Edit: Oh, that is actually in your static version, so the static versions seems to be broken. Given this, it is impossible to tell what does not work in your PHP version.

I get an error

oracle.js:4 Uncaught ReferenceError: hide is not defined

The line where the error is thrown is

 $("#aboutbox").live(hide());

Maybe you meant $("#aboutbox").hide(); ?

Upvotes: 1

HyderA
HyderA

Reputation: 21371

I am seeing an error here (Chrome)

function showInDiv(text)
{
    var sidediv = document.getElementById('content_window');
    sidediv.innerHTML = text; // Cannot set property 'innerHTML' of null
}

What's content_window? I could not find it on the page

Upvotes: 0

Related Questions