0

Okay this is starting to bug me. Working on a web based IM system for the site and when a new chat is initiated jQuery adds a name holder and a chat box to the chat bar. For some reason however it doesn't seem to want to work. Here is the code I'm working on now. It checks for active chats in the session after a page refresh and re-adds those chats to the chat bar. Just including that javascript stuff the PHP code is working fine.

$(document).ready(function()
        {
          jQuery('<div/>', {
                  id: 'chat_name_<?= $chat_user_id; ?>',
                  "class": 'chat_name',
                  text: '<?= $chat_member_name; ?>'
                  }).appendTo('#chat_bar');

          jQuery('<div/>', {
                  id: 'chat_text_<?= $chat_user_id; ?>',
                  "class": 'chat_text',
                  text: '<?= $chat_text; ?>'
                  }).appendTo('#chat_box');
        });

Anyone see what I'm doing wrong?

2
Contributors
5
Replies
8
Views
5 Years
Discussion Span
Last Post by GliderPilot
0

No that's the odd thing the DIV's just do not get added

Edited by GliderPilot: n/a

0

This is something that should work:

$(function() // document ready
{
	$('<div/>') // create div 
		.html('<?= $chat_member_name; ?>') // set html content
		.attr({ // set attributes
			  id: 'chat_name_<?= $chat_user_id; ?>',
			  className: 'chat_name'
		})
		.appendTo('#chat_bar'); // append to chat box

	$('<div/>')
		.html('<?= $chat_text; ?>')
		.attr({
			  id: 'chat_text_<?= $chat_user_id; ?>',
			  className: 'chat_text'
		})
		.appendTo('#chat_box');
});

Your approach was more clean, but it has compatibility issues with IE(http://api.jquery.com/jQuery/)

0

Still not working for some odd reason.... here is the output in the page source:

<div class="chat_box" id="chat_box">
  &nbsp; 
</div>

<div class="chat_bar" id="chat_bar">
  &nbsp;
</div>        
 


      <script type="text/javascript">  

        $(function() // document ready
	{
	  $('<div/>') // create div 
		    .html('GpCapt(AF) Chris Dulong') // set html content
		    .attr({ 
			  id: 'chat_name_52',
			  className: 'chat_name'
		    })
		    .appendTo('#chat_bar'); // append to chat box

	  $('<div/>')
		    .html('Hello')
		    .attr({
			  id: 'chat_text_52',
			  className: 'chat_text'
		    })
		    .appendTo('#chat_box');
        });   
      </script>
          <script type="text/javascript">  

        $(function() // document ready
	{
	  $('<div/>') // create div 
		    .html('NE(AF) James Magill') // set html content
		    .attr({ 
			  id: 'chat_name_1722',
			  className: 'chat_name'
		    })
		    .appendTo('#chat_bar'); // append to chat box

	  $('<div/>')
		    .html('Hey')
		    .attr({
			  id: 'chat_text_1722',
			  className: 'chat_text'
		    })
		    .appendTo('#chat_box');
        });   
      </script>
    

</body>

</html>
0

It looks like my &nbsp; was causing the DIV's to actually load off the visible portion of the screen. Always something silly. Thanks for the input, got it working now :)

This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.