Search the Community

I'm trying to load an xml file into an html file using jquery... i'm using jquery bc the site is built in Adobe's Business Catalyst and doesnt allow for any server-side scripting languages. The XML fIle is broken down into five sections - Corporation Builder Subdivision Plan and Spec- with child nodes within themThe following node names are in the following format (Parent Child). The data that I am trying to display are the: "Builder BrandName", "Spec SpecStreet1", "Spec SpecPrice", "Subdivision SubParentName", "Plan Description", "Spec SpecElevationImage", "Spec SpecBedrooms", "Spec SpecBaths", "Spec SpecSqft", "Spec SpecGarage"So far I've managed to .find and .append all the information in the correct format within its appropriate div with one exception - The data is being repeated around 78 times. Where there should only be one version of each address. So my question is:What can i do to continue displaying the data on my page (http://www.fallsatimperialoaks.com/home-inventory/index_copy.html) without having the data repeated?The XML File is located at http://www.fallsatimperialoaks.com/I8959.xml <script type="text/javascript"> $(document).ready(function(){ $.ajax({ type:"GET", url:"/I8959.xml", dataType:"xml", success: function(data){ $('#load').fadeOut(); $(data).find("Builder").each(function(){ var Brandname = $(this).find("BrandName").text(); var Subdivision = $(this).find("Subdivision SubParentName").text(); $(data).find("Plan").each(function(){ var Description = $(this).find("Description").text(); $(data).find("Spec").each(function(){ var Address = $(this).find("Spec SpecStreet1").text(); var Price = $(this).find("Spec SpecPrice").text(); var Image = $(this).find("Spec SpecElevationImage").text() + '" width="220" height="124" alt="' + $(this).find("Spec SpecStreet1").text(); var Beds = $(this).find("Spec SpecBedrooms").text(); var Baths = $(this).find("Spec SpecBaths").text(); var Sqft = $(this).find("Spec SpecSqft").text(); var Garage = $(this).find("Spec SpecGarage").text();//Append to homecontainer $("#homecontainer").append(' <div class="address"> ' + Address + ' <br><span>Section: ' + Subdivision + '</span>' + '</div>' + ' <div class="price"> $' + Price + ' <br><span> ' + Brandname + ' </span>' + '</div>' + '<div class="clearboth"></div>' + ' <div class="home-image"><img src="' + Image + '"/>' +'</div>' + ' <div class="home-description"> ' + Description + '</div>' + '<div class="clearboth"></div>'); $("#homecontainer").append(' <div class="stats"><div class="beds"><img alt="" src="/images/ico-beds.png" style="border: 0px; width:22px;" /> ' + Beds + ' Bedroom(s)</div><div class="baths"><img alt="" src="/images/ico-baths.png" style="border: 0px; width:22px;" /> ' + Baths + ' Bath(s)</div><div class="sqft"><img alt="" src="/images/ico-sqft.png" style="border: 0px; width:22px;" /> ' + Sqft + ' Sq. Ft.</div><div class="garage"><img alt="" src="/images/ico-garage.png" style="border: 0px; width:22px;" /> ' + Garage + ' Car Garage</div></div>'); }); //End Data Function "Spec" }); //End Data Function "Plan" }); //End Data Function "Builder" }, error:function(){ $("#homecontainer").text('Failed to get feed'); } });}); </script> Any help is appreciated! 

If an element is relatively positioned, its child is absolutely positioned (within the parent container), and the child has a child which is also absolutely positioned. Why is it that the child's child continues to be absolutely positioned relative to its parent container, when it's parent isn't relatively positioned? It seems to go on an on like this.I'm probably just thinking about this the wrong way, but I find it to be confusing. If someone could explain this to me, I would be greatful.

Hi there, After many hours searching for the answer to what I thought was a relatively simple query, I am still no wiser. I hope an expert here will be able to help me with the following - How do you maintain the proportions of child div as its parent gets larger, when the parent is set to width:auto (to fill the browser)? For example say the parent is 1000px X 400px and its child is 200px X 100px; when the browser is resized and changes the parent to 500 x 200, what is the CSS code to ensure the child div changes size with it, proportionally, making it 100 px X 50px? This is because I have come across a JS plugin to scale the text to fit the div. Many thanks in advance, I look forward to reading the response. Matt

<?phpclass test { private $messages = array(); public function addMessage($message){ $this->message[] = $message; } public function getMessages(){ return $this->messages; } } class test2 extends test{ public function getMessages(){ $this->addMessage("Last message."); return parent::getMessages(); }} $test2 = new test2();$test2->addMessage("Hello World");print_r($test2->getMessages()); In my world of understanding this should return an array with 2 entries but I get an empty array back, anyone know what's wrong? What the code does is what class test2 overwrites getMessages and adds a message and calls back to the parent method to do the original script of the function. odd is this work: class test2 extends test{ public function getMessages(){ $this->addMessage("Last message."); return $this->messages; }}