CODEWITHSUNDEEP
javascriptphpjquerycssemoticons
user3127632
user3127632

Reputation: 373

jQuery CSS Emoticons crashing

i am trying to use the above plugin but only works in a div with static text.

E.g This works.:

<div id = "header" name = "header" class = "header" >
        <?php
            echo "Hi :) 
        ?>
    </div>

This Doesn't change anything:

 <div id='chatArea' name='chatArea' class='chatArea'>
        <script>chatRefresh();</script>                 
    </div>

chatRefresh() contains:

function chatRefresh(){$("#chatArea").load("doShowMessage.php");}
setInterval('chatRefresh()', 5000);

emoticonizing() contains:

 function emoticonizing()
    {
        $(document).ready(function() {
  $('#header').emoticonize({
            });
            $('#chatArea').emoticonize({
            });

        });
    }

If i call emoticonizing() inside chatArea it hangs if i call it outside it runs but it's not working. Also if i call chatRefresh() outside the div chatArea it loads after 5sec, instead of loading instantly and refreshing every 5 sec. (by the way i am looking how to implement some sort of long polling for this function with jQuery).

And the whole html view is:

    <?php
if (!isset($_SESSION)) {
    session_start();
}
include 'header.php';
//include './functions/doLogout.php';
?>
<script>chatRefresh();</script> <-- Loads after 5secs in here
<script>emoticonizing();</script> <-- runs but not working properly
<div id='wrapper' name='wrapper' >
    <div name='logout' class=''>
        <form id='logoutForm' action='./functions/doLogout.php' method='post'>
            <input type='submit' name='logout' id='logout'/><br/>
        </form>
    </div>
    <div id='chatBody' name='chatBody' class='chatBody'>
        :D
        <div id='chatArea' name='chatArea' class='chatArea'>
            <script>chatRefresh();</script> <--Loads instanly here
            <script>emoticonizing();</script> <-- works sometimes but hangs 99% of the time
        </div>
    </div>
    <div id='onlineUsersDiv' name='onlineUsersDiv' class='chatOnUser' >
        Online Users:
        <div id='onlineUsers'>
            <script>userRefresh();</script>
        </div>
    </div> 
    <div name='chatBox' class='chatBox'>
        <form id="chatForm" method="post" action="doPostMessage.php"> <br/>
            <input type='text' name='chatText' id='chatText' autocomplete='off' /><br/>
            <input type='submit' name='sendButton' value='Send' /> <br/>
        </form>
    </div>
</div>
<?php
include 'footer.php';
?>

I am fairly new to javascript and all this, so comments are welcome.

Upvotes: 1

Views: 557

Answers (2)

CaptainKnee
CaptainKnee

Reputation: 139

Use this to refresh your <div> instead your refresh function.

$(document).ready(function(){
var myf=function(){
clearInterval(auto_refresh);
auto_refresh=setInterval(myf,5000);
$("#chatArea").load("doShowMessage.php");}
var auto_refresh=setInterval(myf,5000);
});

I hope it works on your code. Greetings!

Upvotes: 1

Slavenko Miljic
Slavenko Miljic

Reputation: 3856

I believe you would need to re-bind the emoticon plugin to the newly generated content. Every time the content changes, call the function that 'emoticonizes' content. Something along these lines.

function chatRefresh(){
        $("#chatArea").load("doShowMessage.php")
        emoticonizing();
;}

Upvotes: 1

Related Questions