JavaScript - Iframe Json Security Question

Is there a way to resize an iframe dynamically so that you never get the scroll bar and essentially hide that there is an iframe? Better integration really.

Basically I want to iframe a forum into my site so that the design down the sides and top which my friend does using iweb are not messed with.
We have a central area which can be longer or shorter depending on the forum.

I have used iframes for my site and found various javascripts so when a person clicks on say the audio page he http://www.krillmeed.com/index.html
it takes them to the audio page but will load it into the index.html page. The problem is, especially with search engines, to point to that page, this is what the URL looks like to send someone to that page:
http://www.krillmeed.com/?frame=0&sr...m%2Faudio.html
which is not very clean at all, this is the javascript that i found that at least works:

Child iframe script:

Code:

<script type="text/javascript">
(function(){
	var qstr = '?frame=0&src=' + encodeURIComponent(location.href),
	lre = new RegExp('^' + location.protocol + '//' + location.hostname + '(()|(/)|(/index.html)|(/index.php))(()|(\\' + qstr + '))$');
	if (!lre.test(parent.location.href)){
		top.location.href = '/' + qstr;
	}
})();
</script>

Parent iframe Script:

Code:

<script type="text/javascript">
(function(){
	function getQval(n) {
		if(typeof n !== 'string'){
			return null;
		}
		var r = new RegExp('[?&;]' + n + '=([^&;#]*)'), m = location.search;
		return (m = r.exec(m))? unescape(m[1]) : null;
	}
	var f = getQval('frame'), s = getQval('src');
	if(f && frames[f] && s && s.indexOf(location.protocol + '//' + location.hostname + '/') === 0){
		frames[f].location.href = s;
	}
})();
</script>

Is there a "cleaner" way of doing this? This was an old code, i have yet to find a more modern one. Thank you in advance.

Hi,

Not sure if I worded that question right. I have a web page which will display another web page in an iframe. But the content inside the iframe may change while the user interacts with it so I need to be able to resize the iframe height from code on the page inside the iframe. Any tips on how I can do that? I am using php and javascript. Thanks.

I'm working on an html form that will be launched from within another application, but every time it launches the form none of the JS coding works because of the stupid IE security. If I launch the form from outside the application I just have to select "allow blocked content" from that stupid information bar that says "to help protect your security IE has restricted the webpage from running scripts...."

I added the application site to our trusted sites and basically turned off security for that zone but it still doesn't work. Obviously there is a way to run JS without allowing the content, but I don't do enough coding to know how that is done.

Can someone help me out please? I need the JS to run automatically without that information bar appearing at all.

Hi, I am currently having a problem with my code. It is pointing at a logical error somewhere as neither the error console in FireFox nor Firebug can detect any errors. The problem is getting the alert box to pop up when the user types in invalid letters or numbers for their respective functions. I guess it could be the Unicode coding for Internet Explorer or Mozilla, or maybe the validation is not getting called from the option list....Anyway here's my code so far:



<script type="text/javascript">
/* <![CDATA[ */

function validateAlphabetic(keyPressEvent) {
if (navigator.appName == "Microsoft Internet Explorer")
var enteredKey = keyPressEvent.keyCode;
else if (navigator.appName == "Netscape")
var enteredKey = keyPressEvent.charCode;
var enteredChar = String.fromCharCode(enteredKey);
var retValue = true;
try {
if (!/\D/.test(enteredChar) && !/\W/.test(enteredChar))
throw "You did not enter an alphabetic value.";
}
catch(inputError) {
window.alert("You can only enter letters into this field.");
retValue = false;
}
finally {
return retValue;
}
}
function validateNumeric(keyPressEvent) {
if (navigator.appName == "Microsoft Internet Explorer")
var enteredKey = keyPressEvent.keyCode;
else if (navigator.appName == "Netscape")
var enteredKey = keyPressEvent.charCode;
var enteredChar = String.fromCharCode(enteredKey);
var retValue = true;
try {
if (!/\d/.test(enteredChar) && !/\W/.test(enteredChar))
throw "You did not enter a numeric value.";
}
catch(inputError) {
window.alert("You can only enter numbers into this field.");
retValue = false;
}
finally {
return retValue;
}
}

/* ]]> */
</script>
</head>

<body>
<h1>Challenge Questions</h1>
<form action="" enctype="application/x-www-form-urlencoded">
<select>
<option value="maiden" onkeypress="return validateAlphabetic(event)">What is your mother's maiden name</option>
<option value="pet" onkeypress="return validateAlphabetic(event)">What is the name of your favorite pet?</option>
<option value="city" onkeypress="return validateAlphabetic(event)">What city were your born in?</option>
<option value="security" onkeypress="return validateNumeric(event)">What is your social security number?</option>
<option value="siblings" onkeypress="return validateNumeric(event)">How many siblings do you have?</option>
</select><br />
<input type="text" size="25" />
</form>

</body>
Reply With Quote

Hello all,
I thought I'd share something that I don't see talked about much on the forums.
I've been doing a bunch of AJAX development at work. We're really strapped for processing speed on our client (we build the machines our clients use) and therefore we've needed to find ways of speeding everything up.

One of the things we decided on within the first week of our current project was to completely scrap XML in favor of JSON for sending data back and forth. JSON is JavaScript Object notation. Many of you have already seen it, it looks like this:

Code:

{'prop1' : 'someValue', 'prop9' : 5};

That defines an object with 2 properties, prop1 and prop9, with the respective values "someValue" and 5. Compare that to XML:

Code:

<obj>
  <prop1 value="someValue" type="String" />
  <prop2 value="5" type="Integer" />
</obj>

That's a bit more bloated, maybe not too noticeable, but the example is a small one. If you take large amounts of data, and multiple objects, XML can get incredibly bloated, and bloat on the wire slows down your app. That's the first reason we switched.

The second reason we switched is that we save time on the processing. We all know what it's like to get at XML data. Import the document, get the node, get the value, get the next node, get the value. And building XML documents can take just as long: Create document, create root node, create node, create attribute node, set value, append child, repeat... All that processing for something so simple.

JSON on the other hand is a subset of javascript, so check this out.

Code:

var data = "{'prop1':'someValue', 'prop2':5}";
var obj = eval("(" + data + ")");
alert(obj.prop1); // *** Alerts 'someValue' ***

The string fits right into JavaScript in one function call. Granted, eval can be expensive, but if you test this out yourself, it's far cheaper than building and deconstructing XML in the JavaScript engine.

There are 2 simple JSON parsing libraries that we use in development: JSON.php and json.js; these provide the necessary functions to serialize any PHP object into JSON, and serialize any JavaScript object into JSON. You can get them at the links below. We are also following the specification for JSON-RPC, defined in the last link below.

We found this to be incredibly fast when compared to XML, and we haven't regretted it yet. Granted, we're not doing full blown web services where the the javascript modifies itself based on the service's self-definition, complete with namespaces and function signatures, but we transfer a lot of data quickly and efficiently to provide our users with the best experience possible.

I recommend examining this further if you do AJAX development. Hopefully this helped somebody.

http://json.org/
http://mike.teczno.com/json.html
http://json-rpc.org/

And now for the "VS" part of this post: Anyone with experience in using both XML and JSON that wants to argue the mertis of either technique? I support JSON for almost all AJAX applications currently. I haven't found a good reason to use XML, and the negatives for using XML (bloat and processing speed) have currently knocked it completely from my "viable options" list. Anyone care to discuss?

My shoutbox is constantly getting hacked the JavaScript code is below. I suspect they are exploiting the same origin policy. The hackers are using administrator's usernames and spamming lots of offensive messages into the database. Any help would be much appreciated, thank you.

Code:

/***************************/
//@Author: Adrian "yEnS" Mato Gondelle & Ivan Guardado Castro
//@website: www.yensdesign.com
//@email: yensamg@gmail.com
//@license: Feel free to use it, but keep this credits please!					
/***************************/

$(document).ready(function(){
	//global vars
	var inputUser = $("#nick");
	var inputMessage = $("#message");
	var loading = $("#loading");
	var messageList = $(".content > ul");
	
	//functions
	function updateShoutbox(){
		//just for the fade effect
		messageList.hide();
		loading.fadeIn();
		//send the post to shoutbox.php
		$.ajax({
			type: "POST", url: "shoutbox.php", data: "action=update",
			complete: function(data){
				loading.fadeOut();
				messageList.html(data.responseText);
				messageList.fadeIn(2000);
			}
		});
	}
	//check if all fields are filled
	function checkForm(){
		if(inputUser.attr("value") && inputMessage.attr("value"))
			return true;
		else
			return false;
	}
	
	//Load for the first time the shoutbox data
	updateShoutbox();
	
	//on submit event
	$("#form").submit(function(){
		if(checkForm()){
			var nick = inputUser.attr("value");
			var message = inputMessage.attr("value");
			//we deactivate submit button while sending
			$("#send").attr({ disabled:true, value:"Sending..." });
			$("#send").blur();
			//send the post to shoutbox.php
			$.ajax({
				type: "POST", url: "shoutbox.php", data: "action=insert&nick=" + nick + "&message=" + message,
				complete: function(data){
					messageList.html(data.responseText);
					updateShoutbox();
					//reactivate the send button
					$("#send").attr({ disabled:false, value:"Shout it!" });
				}
			 });
		}
		else alert("Please fill all fields!");
		//we prevent the refresh of the page after submitting the form
		return false;
	});
});

I have written a little bit of javascript which displays a popup div.

The essence of the idea is simple, and works like this:

In the javascript:
Code:

function popup(markup)
{  
  var div = document.createElement("div");
  div.innerHTML = markup;
  document.body.appendChild(div);
}

And in the PHP:

PHP Code:
$markup = "<h3>Help</h3><p>You clicked on help, so here it is.</p>";

echo '<a href="javascript:popup('.htmlentities($markup, ENT_QUOTES).');">help</a>'; 


Of course, there's a whole load more code (e.g. I have a mechanism for displaying the pop-up near the mouse and for allowing the user to close the pop-up, etc, etc, etc), but that is irrelevant to my question.

Note also that $markup can contain anything I want - e.g. it could contain a form.

Note also that the server populates $markup with predictable content - it is NOT populated by the user.

Are there any security risks inherent in the code as I have posted it? (i.e. barring the fact that $markup could be used for code injection, but I have accounted for that and mitigated against it).

I'm trying to get a return of
Code:

[
   ["red","green","blue"]
   ,["blue","red","green"]
]

from a text file that contains
Code:

red,green,blue
blue,red,green

Using the following function
Quote:
Originally Posted by Old Pedant
Code:

function WRITE_FILE_AS_JSON(file)
 {
  fso = Server.CreateObject("Scripting.FileSystemObject");
  myPath=Server.MapPath("timecards/" + file);
  if(!fso.FileExists(myPath))return;
  myfile = fso.OpenTextFile( myPath, read);
  var lines = myfile.readAll().split("\n");
  Response.Write("[\n");
  for ( var i = 0; i < lines.length; ++i )
  {
      Response.Write('   ' + (i >0 ? ',' : '' ) + '["' + lines(i).replace(/\,/g,'","') + '"]\n');
  }
  Response.Write("]\n");
  myfile.Close();
  Response.End();
 }

The darn thing keeps returning Quote:
500 (Internal Server) Error
as a result of the line Response.Write(' ' + (i >0 ? ',' : '' ) + '["' + lines(i).replace(/\,/g,'","') + '"]\n');
And I don't know how to fix that line...

Hi

I have some JSON strings and I want to embed it into my website. The problem is that I don't know how to parse JSON string data into html code. After a long search it seem that there is just a few references and manuals about JSON.

Could someone explain to me how to use this function and also with as many examples as possible for understanding, how to put it into html page.

Thank You

All,
Say I have the following code:
Code:

<!DOCTYPE html>
<html>
<head>
  <style>img{ height: 100px; float: left; }</style>
  <script src="http://code.jquery.com/jquery-1.7rc2.js"></script>
</head>
<body>
  <div id="images">

</div>
<script>
$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?",
  {
    tags: "cat",
    tagmode: "any",
    format: "json"
  },
  function(data) {
    $.each(data.items, function(i,item){
      $("<img/>").attr("src", item.media.m).appendTo("#images");
      if ( i == 3 ) return false;
    });
  });</script>

</body>
</html>

This came from the jQuery website. What I would like to do is change the link to something like this:
https://graph.facebook.com/me/friend...ss_token=12345

The data that comes back is something like:
Code:

{
   "data": [
      {
         "review_comment": "Here is a comment",
         "id": "12"
      },
      {
         "review_comment": "Testing With more",
         "id": "34"
      },
      {
         "review_comment": "Third comment",
         "id": "643"
      },
      {
         "review_comment": "More Comments",
         "id": "120"
      },
      {
         "review_comment": "Testing",
         "id": "3455"
      }
]
}

What I would like to do is basically read all of the review_comment tags and basically rotate these to display them on the webpage. So have "Here is a comment" be displayed for like 10 seconds and then fade out and have "Testing with More" fade in and be displayed for another 10 seconds etc.

What is the best way to do this? I'm not sure how to change my JSON code above to acheive this. Would I need to basically put the comments in a div and then use jQuery to fade in the divs in and out? Any help you could provide would be greatly appreciated!!

I am making a dynamic google map and need to pass in a JS Object that has latitude, longitude, address, name, and a link. The JS Object will be getting those values from a DB and may have up to 15 recordsets. I need to know how to separate that out into it's entities to include in the Map API regardless of how many recordsets there are.

hey guys im trying to create this script which will show array depending on what option has been selected on the select box...but the only thing being returned is "unidentified"....can anyone explain where i am going wrong please...thank you

Code:

<!DOCTYPE html>
<html>
<head>
  <script type="text/javascript" src="/ajax/jquery/libary/jquery.js"></script>
</head>
<body>
<?php 
$game_type = array();
$division  = array();

if ($_POST['game'] == 1)
{
	$game_type[] = array('value' => '1',
		                 'text' => 'TDM'
	);
	
	$game_type[] = array('value' => '1',
		                 'text' => 'CTF'
	);
	
    $division[] = array('value' => '1',
		                 'text' => 'Divison 1'
	);
}
elseif ($_POST['game'] == 2)
{
	$game_type[] = array('value' => '1',
		                 'text' => 'CTF'
	);
	
    $division[] = array('value' => '1',
		                 'text' => 'Divison 2'
	);
}

json_encode($game_type);
json_encode($division);
?>
<form>
<script>	
$(document).ready(function(){
	$("select#game").change(function(){

		var post_string = "game=" + $(this).val();
		
		$.ajax({
			  type: 'POST',
			  data: post_string,
			  cache: false,
			  dataType: 'json',
			  url: 'json.php',
			  timeout: '2000',
		        error: function() {
		        	alert("Error has occured");
		        },
			  success: function(data) {
		        	$.each(data, function(i, j){    
		        		var row = "<option value=\"" + j.value + "\">" + j.text + "</option>";
						$(row).appendTo("select#sub_category");
          
			     });   
			  }
	      });
	});
});

//$('#game_type').html('<input type=\"checkbox\" value=\"test\" /> TDM'); 
//$('#division').html('<input type=\"checkbox\" value=\"test\" /> Division 1'); 
</script>
<select name="game" id="game">
	<option value=""></option>
	<option value="1">Counter Strike</option>
	<option value="2">COD</option>
</select>

<div id="game_type">
</div>
<div id="division">
</div>
<select name="sub_category" id="sub_category">
	<option value="">-- Select First Value --</option>
</select>
</form>

</body>
</html>

I've been using the JSON.stringify method to convert my JSON object to a string to pass via AJAX but I've read now that it is not supported in most browsers. What then should I use?

hello
i am using a json file to import some content into a div like this:
Code:

$.getJSON('json/main_profile.json', function(data) {
 $('#info_title').html(
'<h1>' + "General Information " + '</h1>'
);
});

but the problem appears when i try to replace the json file with a url, like this:
Code:

$.getJSON("http://interfaces-server.insource.local/users/145198", function(data) {
 $('#info_title').html(
'<h1>' + "General Information " + '</h1>'
);
});

why works with the file but not with the link??

thanks