|
JavaScript - Problem With Passing Object As Argument
PHP Code:
function $(x) { return document.getElementById(x); } function test(x) { alert(x.id); } function init() { var o = {}; o.id = "a"; $("one").addEventListener("click", function () {test(o);}); o.id = "b"; $("two").addEventListener("click", function () {test(o);}); o.id = "c"; $("three").addEventListener("click", function () {test(o);}); } window.onload = init; I have some code similar to this. When the HTML elements with id's "one", "two", or "three" are clicked, they all alert "c", but I want them to alert the respective values (a, b, and c). How can I pass the object by value and not by reference? I guess in this simple example you would just define two more objects, but my code is actually within a for-loop. The object properties are changed each iteration (ideally each iteration creates a new object) and then passed to the function. Similar TutorialsI started Javascript yesterday. I am trying to make the function Captain Obvious simply say what button you are pressing in an alert box, but after I click the button, nothing happens at all, no error message or anything. I have tried it with no argument inside the script call, and then it sort-of works. The alert box comes up saying: "You have clicked on a button that says "undefined"." I am pretty sure that means that I am having a problem passing the argument when I call it, but to be honest I have no clue lol Code: <head>
<script type="text/javascript">
function CaptainObvious('choice')
{
alert("Captain Obvious:You have clicked on a button that says ''"+choice+"''.");
alert("Just fulfilling my public duties.")
}
</script>
</head>
<body>
<form>
<input type="button" value="Apple" onclick=CaptainObvious("apple")>
</form>
Any ideas? I have the following code: [CODE] rtn += "<div class='crowelem' style='width:100px;'>"+panel.genSendButton(current.readNode())+"</div>"; [CODE] This is in a loop that generates rows in a DIV. current.readNode() is returning an object from a linked list, the method genSendButton looks like this: [CODE] MatchRequest.prototype.genSendButton = function (obj) { var rtnstr = null; if(obj.msNotified == 0) { rtnstr = "<input type='button' value = 'Notify' onClick=\"javascriptanel.sendNotification("+obj+")\"/>"; } else { rtnstr = "<input type='button' value='Already Notified' disabled='true' onClick=\"javascriptanel.sendNotification('"+obj.msID+"')\"/>"; } return(rtnstr) ; } [CODE] If you step into this code in a debugger, obj is correctly passed into genSendButton as an object of the appropriate class. The code in the if(obj.msNotified == 0) clause generates an error. The var obj resolves to NPanlel: (this happens to be the class of the object). Regardless of how I try to pass obj into the method sendNotification it doesn't resolve to an object. Can anyone shed any light on where my omission of intelligence is occurring? Any help would be greatly appreciated. Mrbub Hi Everyone, I have the following problem that I have been trying to figure out for a few hours now and am hoping someone can give me a help out. I am opening a popup - this popup is solely to take an image url and as such has one field. On this 1st popup I have a 'button' which when clicked launches a 2nd popup window containing a file browser. The user selects the file by double clicking on the image they want, the url is passed back to the 1st popup, poulating the field and the 2nd popup is closed. Work perfectly in FF etc.. but in IE7 and IE8 it will not work. I am using the following function, linked to the button in the 1st popup, to open the 2nd popup window pass across the name of the field and the window object to the 2nd window. Code: function popupTwoInit(file_path, field_name, win) {
var w = window.open(file_path, null, 'toolbar=yes,menubar=yes,width=900,height=600');
w.fileFileField = field_name;
w.fileFileWin = win;
}
Where w is holding the window object created by the window.open, field_name is the name of the field on the popup that I wish to pass back a value to and win is the window object of the 1st popup. I am using this function as the callback to poulate the field in the 1st dialog after an image in the 2nd dialog has been selected: Code: filebrowser_callback(url) {
window.fileFileWin.document.forms[0].elements[window.fileFileField].value = url;
window.fileFileWin.focus();
window.close();
}
So this function accesses the passed through window object and field name from the window.open function, populates the field, gives the 1st popup focus and closes the 2nd popup. I thought about using opener in the 2nd popup to access the window object and field in the 1st popup but opener seems to refer to the main page in the browser - perhaps because I am using 2 popups OR I have got that wrong. Like I say works perfectly in FF but IE is always undefined for both 'window.fileFileWin' & 'window.fileFileField' which seems to suggest that the object is not interpreted by IE in the first function? I am a PHP developer with limited Javascript knowledge so any help would be great. Thanks very much. Hello, I am trying to execute a javascript function passed as argument. I am not sure of the exact way to do it. <html> <head> <script type="text/javascript"> var checkLink = function(linkId, enabledFunction){ var linkidObj = document.getElementById(linkId); if(linkidObj.className=="activelinktext" ) { enabledFunction(); return false; } else if(linkidObj.className=="inactivelinktext") { return false; } alert("*inside CheckLink*"+enabledFunction); }; </script> </head> <body> <a class="inactivelinktext" onclick="checklink(this,"javascript:goback();")"> </body> </html> Thanks, -Vijay Hi, I am facing a problem in passing replace() function as an argument in user defined java function, can any one help me how to resolve it? intention is to pass a file path to my user defined function, but before passing the path i want to replace the character '\' to '\\' I am posting my javascript function he <a href="#" onclick="OpenDocPreview('<%# Eval("PATH")%>'.replace(/\\/g,"\\\\"), '<%# Eval("Filename")%>')"><%# Eval("DocTitle") %></a> function OpenDocPreview(url, docname) { alert('message from search base : ' + url + ' ' + docname); } thank you, My question is commented in the script: Code: function Love(){
var req = {
ring : 'gold',
money : 'a lot',
commitment : 'long-term'
}
this.loveReqs = function(){
return req;
}
}
var you = new Love();
var details = you.loveReqs();
details.ring = "silver";
console.log(details.ring);
var me = new Love();
var details = me.loveReqs();
console.log(details.ring); // why does this return gold and not silver if req is passed by reference and we already changed its value above and so it's pointing to the same memory position?
Hey all, This is a problem that I've tried various ways round - consider the following code: Code: if (window.XMLHttpRequest)
{
this.xhr = new XMLHttpRequest();
}
else if (window.ActiveXObject)
{
this.xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
this.xhr.onreadystatechange = function () {
if(this.readyState == 4) {
if(this.status == 200) { editor.loadObject.doLoad(); }
else window.console.log("Loader: Loader Error code " + xhr.status);
}
}
the code is called from my "loader" object which in turn is loaded from another object in this case "editor" (editor initiates the loader object by this.loadObject = new loader(this.ident + "loader");). In the example above I have had to hard-code the variable "editor" (i.e. the original object) because when I define this.xhr.onreadystatechange as a function, anything outside the function is outside of it's scope, so I can't for example define this.callerObject and put it in place of editor. This is a nuisance as you can imagine - Any ideas how to do this? Many thanks Edd I'm used to java so I keep wanting to us something like someOtherObject.someMethod(this); function someOtherObject = function(){} someOtherObject.prototype.someMethod = function(object){ object.doSomething(); } I can't seem to get it to work I'm not trying to pass a DOM object, I'm trying to pass a custom function object. Any help would be greatly appreciated i am getting a problem while passing parameter to another 'jsp' through hidden variables.I am getting null while requesting the parameter in 'mywindow.jsp' my code goes like this <form name="name" enctype="multipart/form-data"> <input type="hidden" name="flag" id="flag" value=""/> ........ </form> setting its value in javascript.. like this.. <script type="text/javascript"> function openNewWindow(){ var flag1="1"; document.getElementById("flag").value=flag1; document.tstForm.action = "Mywindow3.jsp"; document.tstForm.method = "POST"; document.tstForm.submit(); } </script> in mywindow.jsp:: <% String strFlag = request.getParameter("flag"); out.println("strFlag:"+strFlag); %> i am getting "null" as value of strFlag.I need to use enctype as "multipart/form-data" to submit form. Hey, I want javascript to print the name of an object down Code: <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script>
function getobjectname(obj){
var linkname = obj.getName();
document.writeln(linkname);
}
</script>
</head>
<body>
<a name="hello world" onclick="getobjectname(this)" style="cursor:pointer">click me</a>
</body>
</html>
This is not working, can anybody help me? ---------- Sorry for my bad English, I'm Dutch I have two versions of this document. The first version uses only JavaScript and the standard PROMPT(). It works very well, but I would like to insert the name prompt into the page using the input command. For some reason the variable loaded in the HTML statement doesn't get passed to the JavaScript. Any ideas would be appreciated! This is only a small test page. Sorry I don't know about the [code] tag... <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="generator" content="CoffeeCup HTML Editor (www.coffeecup.com)"> <meta name="created" content="Sat, 10 Sep 2011 19:40:31 GMT"> <meta name="description" content=""> <meta name="keywords" content=""> <title>Enter golfers name</title> <!--[if IE]> <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> <SCRIPT LANGUAGE="JavaScript" type="text/javascript" src="script1.js"></SCRIPT> <SCRIPT LANGUAGE="JavaScript"> function GetPage(){ document.write("OK") var lab = ""; var result = fullname.toUpperCase(); var word=result.split(" "); fname = word[0] lname = word[1] alpha = lname.slice(0,1); lab = fname.concat("_") lab = lab.concat(lname) if(word[2]){ ext = word[2] lab = lab.concat("_") lab = lab.concat(ext) } var intro = "./Stats_"; page = intro.concat(alpha); page = page.concat("_golfers.html#"); page = page.concat(lab) document.write(page) <!-- window.location.pathname = page } </script> </head> <body> <center> <form action="form_action.asp" method="get"> You can enter the golfersname or select him from the above list.<br><br> <input type="text" name="fullname" /> <button type="submit" onclick="GetPage()">GO</button> </form> </center> <BR><BR><BR> This is the end </body> </html> Hello was following a tutorial online from bucky. and created a new example with different variables and such. My code in my eyes looks absolutely fine but however it does not display can anyone spot the problem? [code] <!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" /> <title>Untitled Document</title> <script type="text/javascript"> function cigerettes (brand, tar, price) { this.brand=brand; this.tar=tar; this.price=price; this.ReducedCost = discount; } function discount() { var reduction = 20; var finalCost = this.price - reduction; return finalCost; } var packet1 = new cigerettes("Mayfair", "2.0 mg", 399); var packet2 = new cigerettes("Sovereign", "3.4 mg", 425); </script> </head> <body> <script type="text/javascript"> document.write(packet1.brand() + " they contain " + packet1.tar() + "of tar " + "the packet cost me " + packet1.price() + ". With discount I got them for: " + packet1.ReducedCost()); </script> </body> </html> [code] I have 2 drag-able containers, they are created in PHP objects which are linked to a file. The working example can be found he 888x7.com The problem that I'm facing is that I can't click test1, and only test2. Now I originally though that it was something to do with them having the same java-script variables, so I renamed all the variables using a unique ID to each object too no success. Here's the code: PHP file: Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<?php
include 'design/compatability.php';
include 'design/meta.php';
?>
<link rel="stylesheet" type="text/css" href="css.css" />
<title></title>
</head>
<body>
<div id="background">
<img src="images/bg1.jpg" class="stretch" alt="" />
</div>
<div id="wrapper">
<?php include 'design/dragdiv.php';
$container = new dragable_box(200, 300, 10, 60, "../designimages/bggrey.png", "test", 1);
$container2 = new dragable_box(590, 400, 10, 10, "../designimages/bggrey.png", "test", 2);
?>
<?php include 'design/toplinks.php'; ?>
</div>
<?php include 'design/footer.php'; ?>
</body>
</html>
Code: <?php
class dragable_box
{
public function __construct($width, $height, $x, $y, $bg, $text, $id)
{
?>
<style type="text/css">
#mydiv<?php echo $id; ?>
{
z-index:10;
background-image:url(<?php echo $bg; ?>);
color:#ffffff;
width: <?php echo $width; ?>px;
height: <?php echo $height; ?>px;
position: absolute;
top: <?php echo $x; ?>%;
left: <?php echo $y; ?>%;
cursor:move;
padding:10px;
}
</style>
<script language="javascript">
var positionx = <?php echo $x; ?>;
var positiony = <?php echo $y; ?>;
var setpositionx = window.innerWidth * positionx / 100;
var setpositiony = window.innerHeight * positiony / 100;
var drag=0;
var xdif=0;
var ydif=0;
var initx=setpositionx;
var inity=setpositiony;
function begindrag<?php echo $id; ?>(event)
{
if(drag==0)
{
floatingd = document.getElementById("mydiv<?php echo $id; ?>");
if(floatingd.style.left=="")
{
floatingd.style.left=initx;
}
if(floatingd.style.top=="")
{
floatingd.style.top=inity;
}
prex=floatingd.style.left.replace(/px/,"");
prey=floatingd.style.top.replace(/px/,"");
drag=1;
xdif = event.clientX-prex;
ydif = event.clientY-prey;
}
else
{
drag=0;
}
}
function mousepos<?php echo $id; ?>(event)
{
floatingd = document.getElementById("mydiv<?php echo $id; ?>");
if(drag==1)
{
floatingd.style.left = event.clientX-setpositionx+"px";
floatingd.style.top = event.clientY-setpositiony+"px";
}
}
</script>
</HEAD>
<BODY onMouseMove="mousepos<?php echo $id; ?>(event)" >
<div id='mydiv<?php echo $id; ?>' onClick="begindrag<?php echo $id; ?>(event)" >
<?php
echo $text;
echo $id;
?>
</div>
<?php } } ?>
I need help being able to select both DIV's, can anyone point me in the right direction? Thanks Hello, I have a code: Code: var device = function(pos_X,pos_Y,serial){
this.pos_x = pos_X;
this.pos_y = pos_Y;
this.serial_number = serial;
this.click = function(){
$("#Control").html("Menu");
};
this.draw = function() {
$("#MainArena").append("<div style='position: absolute; top: "+this.pos_y+"px;
left: "+this.pos_x+"px;' onclick='"+alert('click')+";'>device</div>");
};
this.move = function(newX, newY) {
this.pos_x = newX;
this.pos_y = newY;
};
[...]
<body>
<div id="MainArena"></div><div id="Control"></div>
devices = new device(100,100,1);
devices.draw();
</body>
The main problem is in "onclick" in <div> element. This script generates: <div id="1" style="position: absolute; top: 100px; left:100px;" onclick="undefined;">device</div> I am not very experienced at javascript. Having trouble with some I used for a google map on some of the pages on company site. Appreciate any assistance someone out there could give. If you go to http://www.ghd.com/global/locations/...nsland/cairns/ you can see the error. Get the debug message: an error occurred on this page: Line: 74 Character: 9 Error: GetElementById(....)' is null or not an object The map is actually in a i frame For some reason in ie 6 this script error is popping up when the page loads, but does not when not shown within a iframe http://www.ghd.com/map/cazenovia.html Hello, i'm working on a 3 page survey. When hitting next, previous, or submit it passes the values of all the questions to the next page. I've got the whole thing working correcting except for one thing: When the box is "not" checked it passes no value. I'm needing it to have a value of "1" when checked and a value of "0" when not checked, and currently when its not checked and i pass the info it leaves it blank. I'd post the whole code to one of the pages but it's long , so i'll post the snipits of the code. Code: <script type="text/javascript">
/* <![CDATA[ */
function processQueryString() {
var formData = location.search;
formData = formData.substring(1, formData.length);
while (formData.indexOf("+") != -1) {
formData = formData.replace("+", " ");
}
formData = unescape(formData);
var formArray = formData.split("&");
for (var i=0; i < formArray.length; ++i) {
//document.writeln(formArray[i] + "<br />");
var sDataName = formArray[i].split("=")
switch (sDataName[0]) {
case ".lib_use":
for (var j=0; j < document.getElementsByName(".lib_use").length; ++j) {
if (document.getElementsByName(".lib_use").item(j).value == sDataName[1]) {
document.getElementsByName(".lib_use").item(j).checked = true;
//alert("lib_use set");
}
}
break;
case ".lib_comp":
if (sDataName[1] == 1) {
document.getElementsByName(".lib_comp").checked = true;
document.getElementsByName(".lib_comp").value= 1;
}
else {
document.getElementsByName(".lib_comp").checked = false;
document.getElementsByName(".lib_comp").value= 0;
}
break;
default:
alert("not caught = " + sDataName[0]);
continue;
}
}
}
/* ]]> */
</script>
<input type="checkbox" name=".lib_comp" id="lib_comp" value="1" />
The first case that i showed in my code is a radio button, and it passes correctly, i just wanted to show the "format" i was using in a working sense. The 2nd case is an example of the check boxes. Thanks for looking at this, and giving any suggestions you might have! Hey guys, I've just started with javascript so please, be gentle I am making a wordpress plug-in which puts a banner-rotator on the front page which is able to load both images and flvs'. It has a carousel menuand the images/objects are loaded as you hover over the thumbnails. I have made an js array in a php loop so that every element of the menu list gets assigned a different onMouseOver function when it is generated. Because I was not able to change FlashVars with js I have put the whole object embed code in one variable and insert that in a div with innerHTML when mouseOver. This works fine in firefox but not at all in any other browsers!! What can I do? The website is located at: www.mediapod.org/jwp Here is the code: Code: function wp_main_player() {
global $wpdb;
$noChartsID = $wpdb->get_col($wpdb->prepare("SELECT * FROM wp_term_relationships WHERE term_taxonomy_id = 5"));
$noCharts = count($noChartsID);
?>
<div class="box" style="height:350px;">
<div id="maind" style="height:280px;">
<div id="icont">
<a id="link" href="#"><img name="main" height="280" width="560" src="" /></a>
</div>
<div id="fcont" style="display:none; width:100%; height:100%; background:#fff;">
</div>
</div>
<a class="pprev" style="float:left; width:10px; height:60px; margin-top:10px;" href="javascript:void(0)"></a>
<div class="player" style="float:left; margin-top:11px; width:540px !important;">
<script>
var myCode = [];
</script>
<ul style="float:left;">
<?php
if ($noCharts > 0) {
for ($i = 0; $i < $noCharts; $i += 1) {
$posts = $wpdb->get_row("SELECT * FROM wp_posts WHERE id = $noChartsID[$i]", ARRAY_A);
$link = $wpdb->get_row("SELECT * FROM wp_postmeta WHERE post_id = $noChartsID[$i] AND meta_key ='link'", ARRAY_A);
$link = $link['meta_value'];
$image = $posts['post_content'];
$flv = strpos($image, 'flv:');
if ($flv==1){
$flv = str_replace("-flv:", "", $image);
$flv = substr(rstrstr($flv, '-img:'),0 ,-6);
$image = substr(strstr($image, '-img:'), 5);
?>
<script>
myCode[<?php echo $i; ?>]=<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="560" height="280" id="FlashXMLShoutcastRadioPlayerV4.0" align="middle">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="http://www.mediapod.org/jwp/wp-content/plugins/JRockControll/FLVPlayer_Progressive.swf" />
<param name="menu" value="false" />
<param name="quality" value="high" />
<param name="wmode" value="opaque" ></param>
<param name="FlashVars" value="&MM_ComponentVersion=1&skinName=http://www.mediapod.org/jwp/wp-content/plugins/JRockControll/Corona_Skin_1&streamName=<?php echo $flv; ?>&autoPlay=true&autoRewind=false" />
<param name="bgcolor" value="#111111" />
<embed bgcolor="#111111" wmode="opaque" src="http://www.mediapod.org/jwp/wp-content/plugins/JRockControll/FLVPlayer_Progressive.swf" menu="false" FlashVars ="&MM_ComponentVersion=1&skinName=http://www.mediapod.org/jwp/wp-content/plugins/JRockControll/Corona_Skin_1&streamName=<?php echo $flv; ?>&autoPlay=true&autoRewind=false" quality="high" width="560" height="280" name="FlashXMLShoutcastRadioPlayerV4.0" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>;
</script>
<li class="p_img"><img onmouseover="document.getElementById('icont').style.display='none';document.getElementById('fcont').style.display=''; document.getElementById('fcont').innerHTML=myCode[<?php echo $i; ?>]; document.main.src='<?php echo $image;?>'; document.getElementById('link').href='<?php echo $link;?>';" src="<?php echo $image;?>" height="52" width="102" /></li>
<?php
} else {
?>
<li class="p_img"><img onmouseover="document.getElementById('icont').style.display=''; document.getElementById('fcont').innerHTML=''; document.getElementById('fcont').style.display='none'; document.main.src='<?php echo $image;?>'; document.getElementById('link').href='<?php echo $link;?>';" src="<?php echo $image;?>" height="52" width="102" /></li>
<?php
}
}
}
?>
</ul>
</div>
<a class="pnext" style="float:right; width:10px; height:60px; margin-top:10px;" href="javascript:void(0)"></a>
<script type="text/javascript">
jQuery(function() {
jQuery(".player").jCarouselLite({
btnNext: ".pnext",
btnPrev: ".pprev",
speed: 300,
visible: 5
});
});
</script>
</div>
<?php
}
It is an absolute mess Thank you. Hi, every time I try and alert: [ { number:0, secondnumber:0 }, { number:2, secondnumber:1 }, { number:1, secondnumber:2 } ] it just shows [object object], [object object], [object object]. Why is this and what can I do to make the record be shown as it is above in an alert? Thanks. I created a method for displaying an object's properties: Code: renderfunction = false;
function showProperty (object, property)
{
document.write ('<td class="type">' + (typeof object[property]) + '</td>'
+ '<td class="name">' + property + '</td>');
document.writeln('<td class="value">' +
(
(typeof object[property] != 'function')
? object[property]
:(
(property != 'showProperties')
? (
renderfunction
? object[property]()
: ('<span class="self">NOT RENDERED</span>')
)
: ('<span class="self">THIS</span>')
)
)
+ '</td>');
document.writeln('<td class="hasOwnProperty" >'
+ (
object.hasOwnProperty(property)
? "Local"
: "Inherited"
)
+ '</td>');
if (typeof object[property] == 'function')
{
document.writeln ('<td class="function">' + object[property] + '</td>');
}
else
{
document.writeln ('<td class="function"> </td>');
}
}
As long as renderfunction = false, the object is fine coming out of this function. However, if I change renderfunction to true, all my properties become undefined. Why isn't this working as I expect it to? How should I fix it? Thanks in advance, -Brian. I can't get any info from Firebug except that one line, uncaught exception [object Object]. The code fully worked, then I needed to make it dynamically create Sortables from the scriptaculous library based on how many X were in a table in my database, which I've done, and I'm thinking it may be a simple slight parse error of some type, I'm not too good with Javascript, because now my script barely works. I've double checked the script's source code, the PHP variables are exactly what they should be. Code: print<<<HERE
Sortable.create('sortlist$box', { tag: 'img', overlap:'horizontal',constraint:false, containment: $list, dropOnEmpty: true,
onChange: function(item) {
var list = Sortable.options(item).element;
if(changeEffect) changeEffect.cancel();
changeEffect = new Effect.Highlight('changeNotification', {restoreColor:"transparent" });
},
onDrop: function(item) {
var thing=Sortable.options(item).element.identify();
var anchors = document.getElementById(thing).childNodes.length-2;
if(anchors > 20){
alert('This box had 20 creatures in it already, your last action has not been saved.');
window.location.reload();
}
else{
new Ajax.Request("saveImageOrder.php", {
method: "post",
parameters: { data: Sortable.serialize("sortlist$box") }
});
}
}
});
HERE;
$box++;
}
?>
});
</script>
if you solve this I'll send ya $10 via paypal |
|||||||