JavaScript - Using Ajax Or Js For A Dynamic Frame

Code:

oaktree.addItem("RC Mail", branch1, "rcmail/") //Add this item to branch2

I can open it up in the current page, but the menu is in a frame and I need to open it in a fram called "home".

How can I do that~??

I want to pass the "divId' function so that i can grab functions dynamically into the server where "success" is. this possible? I know the current setup is not (because " d.divId " isn't a variable)

Code:

function run(times,divId)
{
	$(function() 
	{
		var client_id = $('#client_id').attr('value');
		$.ajax(
		{
			url:'http://urlhere.com',
			data:{c:client_id},
			timeout:99999999999999,
			dataType:'jsonp',
			jsonp:'callback',
			jsonpCallback:'jsonpCallback',
			error:function()
			{
				if (times==1)
				{
					run(2);
				}
				else
				{
					$('#'+divId).html('Error') 
				}
			},
			success:function(d)
			{
				$('#'+divId).html('$'+d.divId);
			}
		});
}

hi friends,

I am looking for a solution to display the records of a dynamically selected mysql table using ajax,jsp & js combinations.

any sites showing some example

thnx in advance.

Hello,

I have a rather complex problem involving ajax and the dynamic loading of text.

Basically, I have a flash player with a video and a series of annotations that the customer would like to appear next to the flash player. These annotations need to dynamically light up and move as the timecode associated with the annotation is passed on the flash player's timecode.

I had a basic static system up and running fine. The problem is that the videos could be 3 hours long and have thousands of annotations - which causes a looonng load time for the page so I would like them to appear dynamically.

At the moment I have tried using the below code to load the first 100 annotations and then when the 100th annotation appears, the next 100 should load up.

The trouble is that it doesn't work! The first 100 annotations cycle through perfectly but then nothing seems to happen when the 100th annotation is read. Please help!

Here's the code....

On the record's html page, I load up the first 100 annotations in the $annotations array in a container called 'media-meta-container' - which appears next to the Flash plaer:
Code:

<div id="media-item" style="width: 858px;">
<div id="media-meta-container" style="width: 302px;">
<ul>
<? $annotate_count = 0; ?>
<? for($i=0;$i<10;$i++): ?>
<? if($annotations[$i]["start"] > 0 && $annotations[$i]["end"] > 0): ?>
<li class="media-meta-li-off" id="annotation_container_<?=$annotate_count?>" onclick="seekPrompt(<?=$annotations[$i]["start"]?>);"><p><?=$annotations[$i]["text"]?></p></li>
<input type="hidden" id="start_<?=$annotate_count?>" value="<?=$annotations[$i]["start"]?>" />
<? $annotate_count++; ?>
<? endif; ?>
<? endfor; ?> 
</ul>
</div> 
<input type="hidden" id="count" value="<?=$annotate_count?>" size="12" />
<input type="hidden" id="start_count" value="0" size="12" />
<input type="hidden" id="start_time" value="0" size="12" />

On an attached javascript file the following function is run every 100ms to update the annotations next to the player:

Code:

function updateTimeCode()
{
	var player = document.FLVClipEditor;
	
	if (player)
	{
		var state = player.getState();
		var time = player.getCurrentTime();
		var start_count = document.getElementById("start_count").value;
		var start_time = document.getElementById("start_time").value;
		
		document.getElementById("annotation_container_" + start_count).className = 'media-meta-li-off';
		var end_count = document.getElementById("count").value;
				
		if(state != "stopped")
		{
			
			
			if(time <= start_time)
			{
				for(k=0;k<start_count;k++)
				{
					var start = document.getElementById("start_" + k).value;
					if(time < start) break;
				}
				
				var start_count = k - 1;
			}
			
			if(start_count > 0) start_count--;
			
			for(i=start_count;i<end_count;i++)
			{
				var start = document.getElementById("start_" + i).value;
				document.getElementById("annotation_container_" + i).className = 'media-meta-li-off';
				if(time < start) break;
			}
			

//IF WE HAVE REACHED THE END OF THE AVAILABLE ANNOTATIONS THEN LOAD UP SOME MORE - THIS IS THE PART I AM HAVING PROBLEMS WITH
//THE FUNCTION FIRES BUT NOTHING HAPPENS
			if(end_count == i)
			{
				var new_end_count = end_count + 50;
				document.getElementById("count").value = new_end_count;
				scroll_annotations(end_count, new_end_count);
			}
			
			
			document.getElementById("annotation_container_" + start_count).className = 'media-meta-li-off';
			document.getElementById("annotation_container_" + i).className = 'media-meta-li-off';
			
			if(i > 0) i--;
			
			if(i - start_count > 3) 
			{
				document.getElementById("start_count").value = i;
				document.getElementById("start_time").value = document.getElementById("start_" + i).value;
			}
			
			var filled = document.getElementById("annotation_container_" + i);
			
			
			if(i == 0)
			{
				var end = document.getElementById("start_0").value;
				if(time > end)
				{
					filled.className = 'media-meta-li-on';
				}
			}
			else
			{
				filled.className = 'media-meta-li-on';
					
			}
			
			document.getElementById("media-meta-container").scrollTop = filled.offsetTop - 412;
			
		}
	}
}

Here is the scroll_annotations() code that is being called when we reach the end of the annotations:

Code:

function scroll_annotations(start, end){
	$.ajax({
		type: "GET",
		url: "/xml/record_annotations.php",
		dataType: "xml",
		data: "id="+id+"&media_urn="+media_urn+"&start="+start+"&end="+end+"",
		success: function(xml) {
			
			$(xml).find('annotation_item').each(function(){
				
				var annotation_count = $(this).attr('id');
				var startTimecode = $(this).find('startTimecode').text();
				var start = $(this).find('start').text();
				var annotate_count = $(this).find('annotate_count').text();
				var text = $(this).find('text').text();
				$('<li class="media-meta-li-off" id="annotation_container_' + annotate_count + '" onclick="seekPrompt(' + start +');"><p>' + text + '</p><p>' + startTimecode + '</p></li><input type="hidden" id="' + annotate_count+ '" value="' + start + '" />').appendTo('ul#annotations-list-items');
				
			});
		}
	});
}

Where record_annotations produces an xml file like this to give the annotations variables:

Code:

<annotations>
−
<annotation_item id="0">
<start>64.760000</start>
<annotate_count>0</annotate_count>
<text> ahnfea </text>
</annotation_item>
−
<annotation_item id="1">
<start>65.360000</start>
<annotate_count>1</annotate_count>
<text> we all seek. Two states for two </text>
</annotation_item>
−
<annotation_item id="2">
<start>65.920000</start>
<annotate_count>2</annotate_count>
<text> people living in peace and security. </text>
</annotation_item>
−
<annotation_item id="3">
<start>70.720000</start>
<annotate_count>3</annotate_count>
<text> The verbal gloves came off at an EU </text>
</annotation_item>
−
<annotation_item id="4">
<start>73.680000</start>
<annotate_count>4</annotate_count>
<text> summit in Brussels as the French </text>
</annotation_item>
</annotations>

Thank you. Let me know if there is any other information you need

I'm working on my portfolio and I want to get content to load into my "middle" div upon clicking on the buttons in the sidebar.

I'm able to get it to load, but I can't figure out how to get the CSS to load. I keep getting errors in the code. Here is the code I'm using: http://www.dynamicdrive.com/dynamici...jaxcontent.htm

Here is what I've got:

Code:

<img src="images/rule.png" id="rule" width="1" height="1" />
  		<a href="javascript:ajaxpage('about.html', 'middle');"><img src="images/about.png" width="195" height="101" alt="about" /></a>
      <img src="images/rule.png" id="sidebar_rule" width="194" height="1" />
  		<a href="javascript:ajaxpage('work.html', 'middle');"><img src="images/work.png" width="195" height="101" alt="work" />
      <img src="images/rule.png" id="sidebar_rule" width="194" height="1" />
		<img src="images/resume.png" width="195" height="101" alt="resume" />
      <img src="images/rule.png" id="sidebar_rule" width="194" height="1" />
		<a href="javascript:ajaxpage('contact.html', 'middle'); loadobjs('contact.css', 'feature.js')"><img src="images/contact.png" width="195" height="101" alt="contact" /></a> 
  <img src="images/rule.png" id="sidebar_rule" width="194" height="1" /></div>

I'm working on the contact page right now, just trying to figure out how to get it to load properly. Here is a screenshot of what it's supposed to look like:

https://skitch.com/jillianadriana/r7...itled-document

I can't get it to load with the custom CSS.