I have an html page which is made of 2 divs ( left panel and right panel ). left div is loaded with values from backend. On selection of a value on the left div, i want to load a html page on the right div and want to pass a parameter with the url of page being loaded. I am using jquery for loading the right div with the html page and i am passing the parameter too in the url ( like ("#.editor").load("editor.html?method="+m) ).
Now My question is how do i access the value 'method' in the other html page. I tried using window.location.href to access the value with no avail. Kindly help. I have pasted the code below.
<!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=UTF-8" />
<link type="text/css" href="./methodeditor.css" rel="stylesheet" />
<link type="text/css" href="../../css/ui-lightness/jquery-ui-1.8.14.custom.css" rel="Stylesheet" />
<script type="text/javascript" src="../../js/jquery-1.5.1.min.js"></script>
<script type="text/javascript" src="../../js/jquery-ui-1.8.14.custom.min.js"></script>
<title>Method editor</title>
<script>
function gethtml(m){
$(".editor").load('editor.html?method='+m );
}
function save(){
var editor = document.getElementById("editor");
var win = editor.contentWindow;
var form = win.document.getElementById("editor");
form.submit();
}
function getmethods() {
$.get ("listmethods.php" , function(data) {
var methods = JSON.parse(data);
for (var i=0; i< methods.length; i++){
$(".list").append("<div id=" + methods[i] + " class= clickable ><tr><td>" + methods[i] + "</td></tr></div>");
}
});
}
$('.clickable').live('click', function() {
var m = this.id;
gethtml(m);
});
</script>
</head>
<body>
<div class="methodeditor">
<div class="list">
<script>
getmethods();
</script>
</div>
<div class="editor" >
<script>
gethtml('default.xml');
</script>
</div>
<div class="buttons">
<input type="button" value="save" onclick="save()" />
</div>
</div>
</body>
</html>