Element loaded with ajax is empty - php

Here is an HTML page where I want to load an element with a php script using ajax.
<?php require_once('connect.php'); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<?php require("pagetitle.php"); ?>
<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame Remove this if you use the .htaccess -->
<!-- <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> -->
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link rel="stylesheet" type="text/css" href="style.css" media="screen" />
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.3/themes/base/jquery-ui.css" type="text/css" media="all"
/>
<!-- Portal JavaScript -->
<script type="text/javascript" src="portal.js"></script>
<script type="text/javascript">
var http = false;
if(navigator.appName == "Microsoft Internet Explorer") {
http = new ActiveXObject("Microsoft.XMLHTTP");
} else {
http = new XMLHttpRequest();
}
function LoadCalendar() {
http.abort();
http.open("GET", "calendar/index.php?cP=2", true);
http.onreadystatechange=function() {
if(http.readyState == 4) {
document.getElementById('litcal').src = http.responseText;
}
}
http.send(null);
}
</script>
</head>
<body onload="appendTitle('Calendar');">
<div id="content-body"><a name="top"></a>
<h1>
<iframe id="litcal" onload="LoadCalendar();" style="padding: 0px 0px 0px 0px; border: 1px solid #404040;" width="690px"
height="691px"></iframe>
</h1>
</div> <!-- End CONTENT-BODY div -->
</body>
</html>
The loaded element is empty. It only has <html></html>. What error in the ajax code caused this?


maybe you need to make sure the status is 200 before assigning the src attribute to the response text


The problem was that the PHP was not returning a URL. So ajax could not assign anything to the src. See this question for the code that worked.
https://stackoverflow.com/questions/6612918/loading-an-iframe-with-ajax/6618656#6618656

Related

My css class code doesnt works, it should at be the bottom but it's now working

Php code
i searched on the web and i didnt see anything about this it looks like no error css status is 200
css code is at the bottom.
.sagalt {
margin-top: 500px
}
<html>
<head>
<meta charset="utf-8">
<title>quantum</title>
<link rel="shortcut icon" href="logo.png" type="image/png">
<link rel="stylesheet" href="qntm.css?v=<?php echo time(); ?>">
<!--link//-->
</head>
<body>
<div>
Sign Out
</div>
</body>
</html>

Think you are trying to apply CSS to the link. Anchor tag being an inline element, margin top/bottom property alone wont have an effect in it as inline elements flow with content on the page. Use display: inline-block or display: flex or float: left as per your requirement.
.sagalt {
color: red;
margin-top: 100px;
display: inline-block;
}
<html>
<head>
<meta charset="utf-8">
<title>quantum</title>
<link rel="shortcut icon" href="logo.png" type="image/png">
<link rel="stylesheet" href="qntm.css?v=<?php echo time(); ?>">
<!--link//-->
</head>
<body>
<div>
Sign Out
</div>
</body>
</html>

laravel 5.1 css and js files are not reading

I have copied my assets folder to public and called my css files using
<link href="{{!! asset('assets/global/plugins/font-awesome/css/font-awesome.min.css') !!}}" rel="stylesheet" type="text/css" />
<link href="{{ asset('assets/global/plugins/font-awesome/css/font-awesome.min.css') }}" rel="stylesheet" type="text/css" />
but when I open my local host to view my app the css does not working and when I check the css using inspect element it shows this error
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>Object not found!</title>
<link rev="made" href="mailto:postmaster#localhost" />
<style type="text/css"><!--/*--><![CDATA[/*><!--*/
body { color: #000000; background-color: #FFFFFF; }
a:link { color: #0000CC; }
p, address {margin-left: 3em;}
span {font-size: smaller;}
/*]]>*/--></style>
</head>
<body>
<h1>Object not found!</h1>
<p>
The requested URL was not found on this server.
The link on the
<a href="http://localhost:7777/laravel/resources/views/login.blade.php">referring
page</a> seems to be wrong or outdated. Please inform the author of
that page
about the error.
</p>
<p>
If you think this is a server error, please contact
the webmaster.
</p>
<h2>Error 404</h2>
<address>
localhost<br />
<span>Apache/2.4.16 (Win32) OpenSSL/1.0.1p PHP/5.6.12</span>
</address>
</body>
</html>

First you put all your css and js file inside public folder.
ie, wamp->www->your project folder->public.
then in the coding section simply use the below mentioned technique.
<link href="css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="js/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="../css/jquery.datetimepicker.css"/>
<script type="text/javascript" src="../select/select2.min.js"></script>
<script type="text/javascript" src="../select/select2.js"></script>
<link href="../select/select2.css" rel="stylesheet">

Add a slash to the beginning of your assets urls:
<link href="{{!!asset('/assets/global/plugins/font-awesome/css/font-awesome.min.css') !!}}" rel="stylesheet" type="text/css" />
<link href="{{ asset('/assets/global/plugins/font-awesome/css/font-awesome.min.css') }}" rel="stylesheet" type="text/css" />

Trying To Use A PHP Header with an IFrame

I am trying to add a blog to my website and I decided I would just create a google blog and use a full screen Iframe to display it on my page. It works fine but then I decided to add the websites header. So now I have the header followed by the Iframe but I would like to be able to treat the header & Iframe as one single page. Right now the header is always visible and I can scroll through the Iframe with the header always showing above it which is not the most visibly pleasant experience. Here is the code:
<?php
include("header.php");
?>
<html>
<head>
<style type="text/css">
body
{
margin: 0;
overflow: hidden;
}
#iframe1
{
height: 80%;
left: 0px;
position: absolute;
top: 180px;
width: 100%;
}
</style>
</head>
<body>
<iframe id="iframe1" src="http://xxxx.blogspot.com/" frameborder="0"></iframe>
</body>
</html>
Here is the header code:
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta name="google-site-verification"=xxx />
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-26023641-1']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>xxx – <?php if ($page != 'Home') { echo $page; } else { echo 'xxxxs'; } ?></title>
<meta name="description" content="xxx." />
<meta name="keywords" content="xxx<?php echo $tags; ?>" />
<link href='http://fonts.googleapis.com/css?family=PT+Sans:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<!--[if lt IE 9]>
<script type="text/javascript" src="/js/lightview/js/excanvas/excanvas.js"></script>
<![endif]-->
<script type="text/javascript" src="js/external.js"></script>
<script type="text/javascript" src="js/lightview/js/spinners/spinners.js"></script>
<script type="text/javascript" src="js/lightview/js/lightview/lightview.js"></script>
<script type="text/javascript" src="http://www.google.com/coop/cse/brand?form=cse-search-box"></script>
<link rel="stylesheet" type="text/css" href="css/hub.css" media="screen" />
<link rel="stylesheet" type="text/css" href="js/lightview/css/lightview/lightview.css"/>
<!--[if IE 7]><link rel="stylesheet" type="text/css" href="css/ie7styles.css" /><![endif]-->
<!--[if IE 6]><link rel="stylesheet" type="text/css" href="css/ie6styles.css" /><![endif]-->
<!--[if lte IE 6]><link rel="stylesheet" type="text/css" href="css/ie6styles.css" /><![endif]-->
<link rel="icon" href="favicon.ico" type="image/ico" />
</head>
<body>
<div id="header">
<a id="logo" href="/"></a>
<ul id="nav">
<li>xx</li>
<li>xx</li>
<li>xx</li>
<li>xx</li>
<li>xx</li>
<li>xx</li>
<li>xx</li>
<li>xx</li>
<li>xx</li>
<li>xx</li>
</ul>
</div>
<div id="content">

The problem is that your scroll bar is within the iframe and disabled on the main page body, so scrolling is only scrolling within the iframe and not your whole page. Remove overflow: hidden from your page body and make it so your iframe stretches its height to fit its contents. That way, the scrollbar you see on the page would scroll your entire page instead of just the iframe.

Function this.text=text; to html

I have some code for a tootlip in a calendar. i want to be able to display html in the tool tip is this possible? every time i try and change it to accept html it crashes it only allows text right now and i do not understand how to change it to allow for html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title></title>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.8.2.js'></script>
<link rel="stylesheet" type="text/css" href="/css/normalize.css">
<link rel="stylesheet" type="text/css" href="/css/result-light.css">
<link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css">
<script type='text/javascript' src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<style type='text/css'>
.pink > a {
background-color: pink !important;
background-image:none !important;
}
.green > a {
background-color: green !important;
background-image: none !important;
}
</style>
<script type='text/javascript'>//<![CDATA[
$(window).load(function(){
var Event = function(text, className) {
// would like to convert this to allow for html
this.text = text;
// this.html = text; // does not work
this.className = className;
};
var events = {};
events[new Date("01/01/2013")] = new Event("New Years Day", "pink");
events[new Date("12/25/2012")] = new Event("<B>Merry</b> Christmas", "green");
console.dir(events);
$("#dates").datepicker({
beforeShowDay: function(date) {
var event = events[date];
if (event) {
return [true, event.className, event.text];
}
else {
return [true, '', ''];
}
}
});
});//]]>
</script>
</head>
<body>
<div id="dates"></div>
</body>
</html>
thank you in advance for any code or help you may provide
Johnny

The title attribute does not allow html code.
But there are several frameworks out there that allow you to modify the hover.
I used jQuery Tooltip
<script src="http://jquery.bassistance.de/tooltip/jquery.tooltip.js"></script>
$('*').tooltip();
Here you will see that they tooltip has been modified and the bold is in place.
http://jsfiddle.net/Morlock0821/WqrMK/

Why is my WordPress PHP header template generating oddly coded paths and transcluding some css and js file in the outputted HTML?

I think this is an encoding problem(?), but not really sure.
When I view my generated source (in both FF and IE) I see funky paths from my js and css files like: <script type="text/javascript" src="http://www.domain.com/wp-content/themes/dudical/js/ce.f4195499d3cfc40ae09588aae02ff2dc.jquery,oeasing,omin,l.js"></script>
Also, several of the js/css files are actually being transcluded, i.e I don't see references to the external files, but instead the content of those files are being shown in the source inside of <script> and <style> tags respectively. I've never seen this type of behavior before and am pretty baffled.
Here is how my header.php file begins:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>>
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
<title><?php if (is_front_page() ) {
bloginfo('name');
} elseif ( is_category() ) {
single_cat_title(); echo ' - ' ; bloginfo('name');
} elseif (is_single() ) {
single_post_title();
} elseif (is_page() ) {
single_post_title(); echo ' - '; bloginfo('name');
} else {
wp_title('',true);
} ?>
</title>
<?php if(get_option('favicon')) { ?>
<link rel="shortcut icon" href="<?php echo get_option('favicon'); ?>" type="image/x-icon" />
<?php }else{?><link rel="shortcut icon" href="<?php echo system32_url; ?>/favicon.ico" type="image/x-icon" /> <?php } ?>
<?php if ( is_singular() ) wp_enqueue_script( 'comment-reply' ); ?>
<?php wp_head(); ?>
<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo('template_url'); ?>/css/reset.css" />
<link rel="stylesheet" type="text/css" href="<?php bloginfo('template_url'); ?>/style.css" />
<!-- Jquery and Easing-->
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jquery-1.4.min.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jquery.easing.min.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jquery.capSlide.js"></script>
Here is what I see output:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang=en lang=en>
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv=Content-Type content="text/html; charset=ISO-8859-1"/>
<title>Surf Hatteras</title>
<link rel="shortcut icon" href="http://www.surfhatteras.com/wp-content/uploads/2010/10/surf-icon.gif" type="image/x-icon"/>
<style>body { outline:none;}
.postoptions { padding:0px; padding-top:0; }
.postoptions select,
...
</style>
<style>/* CSS for WP-Testimonials */
#sfstest-form label {
float: left;
width: 200px;
font-weight: bold;
}
...
</style>
<script type='text/javascript' src='http://www.surfhatteras.com/wp-includes/js/jquery/jquery.js?ver=1.4.2'></script>
<link rel=EditURI type="application/rsd+xml" title=RSD href="http://www.surfhatteras.com/xmlrpc.php?rsd"/>
<link rel=wlwmanifest type="application/wlwmanifest+xml" href="http://www.surfhatteras.com/wp-includes/wlwmanifest.xml"/>
<link rel=index title='Surf Hatteras' href='http://www.surfhatteras.com/'/>
<meta name=generator content="WordPress 3.0.1"/>
<style>/* http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
...
</style>
<link rel=stylesheet type="text/css" href="http://www.surfhatteras.com/wp-content/themes/dudical/ce.51cd742ab6418eec6131ff2cf43b61c4.style,s.css"/>
<!-- Jquery and Easing-->
<script type="text/javascript" src="http://www.surfhatteras.com/wp-content/themes/dudical/js/ce.9e936b27d8d0e4e07ebef242d7c6e2cc.jquery-1,o4,omin,l.js"></script>
<script type="text/javascript">(function($) {
$.fn.capslide = function(options) {
var opts = $.extend({}, $.fn.capslide.defaults, options);
return this.each(function() {
$this = $(this);
var o = $.meta ? $.extend({}, opts, $this.data()) : opts;
...
})(jQuery);</script>
<link rel=stylesheet type="text/css" href="http://www.surfhatteras.com/wp-content/themes/dudical/colors/ce.d47db6d7bbcb1f0192576f60ffa27ec9.white,s.css" media=screen />
<!-- Slider CSS-->
<style>/*
Coin Slider jQuery plugin CSS styles
http://workshop.rs/projects/coin-slider
*/
#coin-slider { margin-left:20px;}
...
</style>
<link rel=stylesheet type="text/css" media=screen href="http://www.surfhatteras.com/wp-content/themes/dudical/css/cc.224c1b363a793961fc7bc2e428d6ce58.nivo-slider,s+superfish,s.css">
Can't figure what is happening to my paths, or why some external files are getting treated as such...
EDIT
List of plug-ins I am using:
Category Posts Widget
Contact Form 7
Contact Form 7 to DB Extension
Get Post Image
Get The Image
Resize At Upload Plus
Widgets Reloaded
WordPress Hashcash
WP-DBManager
WP-Mail-SMTP
WP Show IDs
WP Wunderground
(The caching plugin I was using is Quick Cache)
Contents of my functions.php file

It's not a big deal.
Just because you have using Goolge Page Speed extension mod.

Categories