JavaScript - Increasing/decreasing Related Variables

Hi Friends,
i have a smal task i.e
i have textbox1 ,botton,textbox2 when i enter 21 value then i click button its get in sama row values in textbox2.
i have xml file like this
<DATAPACKET >
<ROWDATA>
<R_ID>101</R_ID>
<R_NAME>R-12</R_NAME>
<R_TEMP>4.266</R_TEMP>
<R_COLOR>White</R_COLOR>
</ROWDATA>
<ROWDATA>
<R_ID>20</R_ID>
<R_NAME>R-22</R_NAME>
<R_TEMP>4.266</R_TEMP>
<R_COLOR>Green</R_COLOR>
</ROWDATA>
<ROWDATA>
<R_ID>21</R_ID>
<R_NAME>R-32</R_NAME>
<R_TEMP>4.266</R_TEMP>
<R_COLOR>White</R_COLOR>
</ROWDATA>
<ROWDATA>
<R_ID>104</R_ID>
<R_NAME>R-134A</R_NAME>
<R_TEMP>4.246</R_TEMP>
<R_COLOR>Light Blue</R_COLOR>
</ROWDATA>
<ROWDATA>
<R_ID>21</R_ID>
<R_NAME>R-290</R_NAME>
<R_TEMP>4.246</R_TEMP>
<R_COLOR>White</R_COLOR>
</ROWDATA>
<ROWDATA>
<R_ID>31</R_ID>
<R_NAME>R-401A</R_NAME>
<R_TEMP>4.246</R_TEMP>
<R_COLOR>Pink</R_COLOR>
</ROWDATA>
<ROWDATA>
<R_ID>32</R_ID>
<R_NAME>R-401B</R_NAME>
<R_TEMP>4.264</R_TEMP>
<R_COLOR>White</R_COLOR>
</ROWDATA>
<ROWDATA>
<R_ID>108</R_ID>
<R_NAME>R-402A</R_NAME>
<R_TEMP>4.426</R_TEMP>
<R_COLOR>Light Greem</R_COLOR>
</ROWDATA>
<ROWDATA>
<R_ID>129</R_ID>
<R_NAME>R-402B</R_NAME>
<R_TEMP>4.266</R_TEMP>
<R_COLOR>White</R_COLOR>
</ROWDATA>
<ROWDATA>
<R_ID>110</R_ID>
<R_NAME>R-404A</R_NAME>
<R_TEMP>4.246</R_TEMP>
<R_COLOR>Orange</R_COLOR>
</ROWDATA>
<ROWDATA>
<R_ID>121</R_ID>
<R_NAME>R-407A</R_NAME>
<R_TEMP>4.267</R_TEMP>
<R_COLOR>White</R_COLOR>
</ROWDATA>
<ROWDATA>
<R_ID>122</R_ID>
<R_NAME>R-408A</R_NAME>
<R_TEMP>4.267</R_TEMP>
<R_COLOR>White</R_COLOR>
</ROWDATA>
<ROWDATA>
<R_ID>113</R_ID>
<R_NAME>R-409A</R_NAME>
<R_TEMP>4.267</R_TEMP>
<R_COLOR>White</R_COLOR>
</ROWDATA>
<ROWDATA>
<R_ID>134</R_ID>
<R_NAME>R-407C</R_NAME>
<R_TEMP>4.264</R_TEMP>
<R_COLOR>White</R_COLOR>
</ROWDATA>
<ROWDATA>
<R_ID>115</R_ID>
<R_NAME>R-410A</R_NAME>
<R_TEMP>4.426</R_TEMP>
<R_COLOR>White</R_COLOR>
</ROWDATA>
</DATAPACKET >
then i try this hear i get all values
function gettxt() {
results = new Array;
var searchterm = document.getElementById("searchme").value;
if (searchterm == null || searchterm == "") {
alert("Enter textbox value");
return false;
}
var istrlen1 = searchterm.length;
var tempname1;
if (istrlen1 == 1) {
tempname1 = searchterm;
}
if (istrlen1 == 2) {
tempname1 = searchterm;
}
if (istrlen1 == 3) {
tempname1 = searchterm;
}
if (istrlen1 == 4) {
tempname1 = searchterm;
}
for (i = 0; i < x.length; i++) {
var name = x[i].getElementsByTagName("R_ID")[0].firstChild.nodeValue;
var name1 = x[i].getElementsByTagName("R_NAME")[0].firstChild.nodeValue;
var exp = new RegExp(tempname1, "i");
if (name.match(exp) != null) {
y = y + 1;
results.push(name1);
}
}
textbox2.value = results;
}
i try the above code hear small problom when i enter 21 and click button its display 21,121,123... related values i dont want like that
for example textbox1=21 buttonclick textbox2=R-32,r-407A,r-408A like that i dont want like that
i want textbox1=21 buttonclick textbox2=R-32 only in same row value
please any one knows well in js please resolve my problom

I posted this once, but it disappeared, and I have no notifications that I did anything wrong. I read the rules before posting and wasn't breaking any so I am not sure why it disappeared but here goes again.

I am trying to learn Javascript (particularly OOP) from a series of screencasts by Douglas Crockford. I have developed a theoretical "game" to build to illustrate it to myself better, and learn by example.

I must be misunderstanding how inheritance works, because my code is not producing the results I thought it would.

Here is what I have, followed by an explanation of my understanding.
Code:

$(function() {

function object(o) {
	function Funct() {}
	Funct.prototype = o;
	return new Funct();
}


soldier = {
      pointsCost: 0,
      movement: "1 Infantry Block",
      validTargets: {},
      weapons: {
			"Main Weapon": {
				"Weapon Type": "M4 Carbine",
				"Fire Range": 12
			},
			"Secondary Weapon": {
				"Weapon Type": "JCP .45",
				"Fire Range": 3
			}
		}
};

var rifleman = object(soldier); 
rifleman.pointsCost += 10;
rifleman.validTargets.target1 = "Infantry"
rifleman.weapons["Secondary Weapon"]["Weapon Type"] = "";
rifleman.weapons["Secondary Weapon"]["Fire Range"] = "";


var heavyGunner = object(soldier);
heavyGunner.pointsCost += 20;
heavyGunner.validTargets.target1 = "Infantry";
heavyGunner.validTargets.target2 = "Light Armor";
heavyGunner.weapons["Main Weapon"]["Weapon Type"] = "SAW M249";
heavyGunner.weapons["Main Weapon"]["Fire Range"] = 12;
heavyGunner.weapons["Secondary Weapon"]["Weapon Type"] = "";
heavyGunner.weapons["Secondary Weapon"]["Fire Range"] = "";
 
var sniper = object(soldier);
sniper.pointsCost += 30;
sniper.validTargets.target1 = "Infantry";
sniper.weapons["Main Weapon"]["Weapon Type"] = "Savage .308";
sniper.weapons["Main Weapon"]["Fire Range"] = 20;
sniper.weapons["Secondary Weapon"]["Weapon Type"] = "JCP .45";
sniper.weapons["Secondary Weapon"]["Fire Range"] = 3;

 
var demolitions = object(soldier);
demolitions.pointsCost += 30;
demolitions.validTargets.target1 = "Infantry";
demolitions.validTargets.target2 = "Light Armor";
demolitions.validTargets.target3 = "Artilery";
demolitions.validTargets.target4 = "Structures";
demolitions.weapons["Main Weapon"]["Weapon Type"] = "SMAW MK153";
demolitions.weapons["Main Weapon"]["Fire Range"] = 16;
demolitions.weapons["Secondary Weapon"]["Weapon Type"] = "M1014 Combat Shotgun";
demolitions.weapons["Secondary Weapon"]["Fire Range"] = 1; 


var infantry = { 

    rifleman: rifleman, 
    
    heavyGunner: heavyGunner, 
     
    sniper: sniper, 
     
    demolitions: demolitions 
 
};



console.log(infantry);

});

I start by creating an object function that accepts an object passed in, and sets it to the prototype of a constructor (that would allow me to create a new object linked to, and inheriting from, the initial passed in object)

I initialized a solider object literal, and pass that into the object function while creating 4 new objects (rifleman, heavyGunner, sniper, demolitions)
These four should inherit from and customize upon the soldier object.

The way I understood inheritance is that the new objects (example. rifleman) would inherit properties from the old object (i.e. soldier) and change or add properties, affecting only the new (rifleman) object but not changing the old(solider) object.

this works ok somewhat in my example, until it comes to nested objects.
In the above example I have objects as values for some Object's properties. (i.e. validTargets and weapons) When I change or add these, all of the new objects seem to inherit the last declarations, from demolitions, as if demolitions is actually changing that part of the soldier object so that the other's inherit those properties.

From my viewpoint, I expected these values to not be changed and that the 4 infantry types had no link to each other, but only to the soldier object.

I apparently misunderstood something, or coded something wrong.

Some minor notes:
-I will be updating most of the "string" values to be objects, so for instance, the validTargets value of "Infantry" would actually be the infantry object, stating that any of the 4 solider types would be a valid target.
- I intend to create weapons as their own viable objects in the future, and pass those objects instead of "strings"
- I intend to extend this (once this is working) to create an armor object that contains armor type units, similar in structure to the infantry object.
- If I can get this all to work, I may make this into a "simple" dice style battle game. but that is way off, I just want to get this nesting of objects to work with inheritance for now.

Thanks in advance for any help you can provide.
Here is a link to the "live" example. (not much different there except if you have firebug you can see the console.log method showing the objects, and how they are inheriting in properly from my POV.)

Link to Live example...


Blue

Hey guys.

I have a weird issue (you kind of have to see it for yourself to understand). If you double click on the next or previous button quickly (within 500 miliseconds of each other) it creates a double of the next slide.

http://insidehb.com/imageofday/

Let me know if you can help.

Thanks.

Hello:
I have a Fire Fox 3.5.2 error console message regarding a DHTML script:
Error: uncaught exception: [Exceptions: ... "Not enough arguments" nsresult
"0x8057001 (NS_ERROR_XPC_NOT_ENOUGH_ARGS)" Location: "JS frame :: (file path) upHandler :: line 102" no data]

The line referenced is:
document.removeEventListener('mouseup', upHandler);

It is part of a drag function that is applied to a container div.

I have successfull used this code block, copied from Orielly's Javascript:
The Definitive Guide, 4th Edition in another project.

The only real difference is that the code in the working use is div tags hard coded. In the one giving me problems, the div tags are written using document.write() in a function that is called in the body of the document when the page loads.
I could supply the code context, but it is several hundred lines.
The project is not available at present on the web to surf to but the
one project that works is
jekillen.com/jekillen/content/web_design/OOP_panel/test_OOP_DEV_ALT.php
The code in question is 'beginDrag'. There is a panel called fortune cookie
which the user can drag, and a panel called 'Advisory' that the user can also
drag around after clicking button labeled 'message'.
Any info, suggestions, advice?
Thanks in advance.
Jeff K

Dear all

I came across the following very simple code for dragging a square around using javascript. It is drawn on the html5 canvas. Despite being very simple it has certainly exposed some gaps in my pretty flakey javascript knowledge. I am generally ok with the idea of drag and drop (i.e. start drag on mouse click, stop drag on mouse release) but my questions are as follows:

(1) I cannot see where the variable e is defined, yet it is used all the time.

(2) In the init funciton at the bottom, an onmousedown listener seems to be attached to the canvas. However it equals the function myDown, but myDown doesn't have parentheses after it. So the myDown function is not actually going to be exectuted. So what is it doing instead?

Thanks in advance. I have tried to research this myself but haven't had any success yet.

Matt



Code:

<!doctype html> 
<html> 
<head> 
<meta charset="UTF-8" /> 
<title>Canvas Drag and Drop Test</title> 
</head> 
<body> 
<section> 

<div> 
<canvas id="canvas" width="400" height="300"> 
This text is displayed if your browser does not support HTML5 Canvas. 
</canvas> 
</div> 

<script type="text/javascript"> 

var canvas; 
var ctx; 
var x = 75; 
var y = 50; 
var dx = 5; 
var dy = 3; 
var WIDTH = 400; 
var HEIGHT = 300; 
var dragok = false; 

function rect(x,y,w,h) { 
 ctx.beginPath(); 
 ctx.rect(x,y,w,h); 
 ctx.closePath(); 
 ctx.fill(); 
} 

function clear() { 
 ctx.clearRect(0, 0, WIDTH, HEIGHT); 
} 

function init() { 
 canvas = document.getElementById("canvas"); 
 ctx = canvas.getContext("2d"); 
 return setInterval(draw, 10); 
} 

function draw() { 
 clear(); 
 ctx.fillStyle = "#FAF7F8"; 
 rect(0,0,WIDTH,HEIGHT); 
 ctx.fillStyle = "#444444"; 
 rect(x - 15, y - 15, 30, 30); 
} 

function myMove(e){ 
 if (dragok){ 
  x = e.pageX - canvas.offsetLeft; 
  y = e.pageY - canvas.offsetTop; 
 } 
} 

function myDown(e){ 
 if (e.pageX < x + 15 + canvas.offsetLeft && e.pageX > x - 15 + 
 canvas.offsetLeft && e.pageY < y + 15 + canvas.offsetTop && 
 e.pageY > y -15 + canvas.offsetTop){ 
  x = e.pageX - canvas.offsetLeft; 
  y = e.pageY - canvas.offsetTop; 
  dragok = true; 
  canvas.onmousemove = myMove; 
 } 
} 

function myUp(){ 
 dragok = false; 
 canvas.onmousemove = null; 
} 

init(); 
canvas.onmousedown = myDown; 
canvas.onmouseup = myUp; 

</script> 

</section> 
</body> 
</html>

Hi friends,

i have xnl file like

<DATAPACKET >
<data1>
<R_ID>101</R_ID>
<R_PRE>38</R_PRE>
<R_PRE2>39</R_PRE2>
<R_TEMP>8.35</R_TEMP>
<R_TENP2>0.64</R_TENP2>
</data1>
<data1>
<R_ID>102</R_ID>
<R_PRE>36</R_PRE>
<R_PRE2>37</R_PRE2>
<R_TEMP>7.23</R_TEMP>
<R_TENP2>1.21</R_TENP2>
</data1>
<data1>
<R_ID>103</R_ID>
<R_PRE>34</R_PRE>
<R_PRE2>36</R_PRE2>
<R_TEMP>7.21</R_TEMP>
<R_TENP2>1.95</R_TENP2>
</data1>
<data1>
<R_ID>104</R_ID>
<R_PRE>32</R_PRE>
<R_PRE2>35</R_PRE2>
<R_TEMP>6.25</R_TEMP>
<R_TENP2>2.30</R_TENP2>
</data1>
<data1>
<DATAPACKET >

then i have textbox...when i type 101 its go and get all data in the row in text area like

101
32
6025
2.30

please give me any idea how to do this

i m try this
if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
}
else {// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET", "Refrigerater.xml", false);
xmlhttp.send();
xmlDoc = xmlhttp.responseXML;
x = xmlDoc.getElementsByTagName("ROWDATA");

//x = xmlDoc.getElementsByTagName("data1");

function displayInfo(selBox) {
x = xmlDoc.getElementsByTagName("ROWDATA");
var col = (selBox.options[selBox.selectedIndex].text);
document.getElementById("show").innerHTML = "&nbsp;" + col;
}

Please resolve my problem

Thanks
Venkat.S

What would be the best way to get data for a mobile site. I've tried using Jquery $.ajax to bring in the data from a php file.

It seems to work however it takes some time to load without a way to really give a progress meter. I was wondering what the fastest way to do this would be. For instance it loads and loads then after a long while the alert(); pops up and the data loads into the page.

Ultimately i was thinking i could use the ajax request to read in the data from the mysql database server, then transfer it to localstorage, im using HTML5 primarily for the development also just for reference.

Somewhat new to mobile development i was just wondering if anyone had a starting point for me to look at and go from there.

Code:

$(document).ready(function($){
	var dataret = 0;
	
		$.ajax({
		  type: 'POST',
		  url: 'mobile.php',
		  beforeSend: function(){
		  	$('#status').show();
		  },
		  success: function(data){
		  //initialize localstorage here
		  	alert('success');
		  	
// if it takes as long as it does, a few minutes, at least show a loading bar...
		  	$('#progress').progressbar({
		  		
		  	});
		  
		  },
		  dataType: 'json'
		});
	
	});

Thanks in advance!

Hi All.....I am new to javascript coding ...I am unable to forward from my jsp to servlet file via javascript
below is my code....

[JSP CODE]

<html>
<body>
<form action="Bean" method="get" name="form1">

<ul>
<li><a onclick="javascript:view('vprod')" name="vprod">View</a></li>
</ul>

[Script Code]

function view(value)
{

alert(value);
document.form1.action="/Bean";
document.form1.submit();

}


Please can one help me in this regard.....Thanks in Advance

this is my javascript code:
Code:

var aaa, aab;
aaa = choo.chooserver0.checked;
aab = choo.chooserver1.checked;
k=(aaa==true)?0:(aab==true)?1:(aaa=true&&aab==true)? 'b2' : false ;

now when the checkbox with id chooserver0 is checked, it sets k's value to 0, and when checkbox with id chooserver1 is checked it sets its value to 1, but when both are checked it must set value to b2, but it sets value to 0, why?

and when i write it as:

Code:

var aaa, aab;
aaa = choo.chooserver0.checked;
aab = choo.chooserver1.checked;
k=(aaa=true&&aab==true)? 'b2' :(aaa==true)?0:(aab==true)?1: false ;

when box 1 is checked, it sets k= false, when box2 is checked it sets k= 'b2' and when both are checked it sets k = 'b2'... why is code doing so?

QUESTION 1:

Hello. I would like to know if this is possible with Javascript, and if yes, if someone can please provide me with the code or point me in the right direction.

Let me start of by saying that this is for an eBay listing. I know that they accept basic / limited javascript and if what I am asking is possible, I hope that it can work on eBay listings.

I would like to know if it's possible to determine the dimensions of an image with Javascript from an Image url, and to then resize it or not based on the the size of the image.

So, let's say this is the URL: www.adomainname.com/image.jpg

and let's say that image is 1400 px x 1400 px. I would first like the javascript code to detect that size. I also would like the maximum dimension for any side of the image to be 600 px. If both sides of the image are over 600 px, for both sides to be reduced proportionally to 600 px or lower. If any one side of the image is larger than 600 px, the image is to be resized to 600 px or lower. If both sides are under 600 px, the image is to not be reduced. It would also be nice if it can detect whether the image is portion or landscape based on I guess the larger side, because an image at 600 px in height might be too big, but in width might be o.k.

So, in this example (the 1400 px by 1400 px), the image is to be resized to 600 px x 600 px.

For an image that's 300 px x 500 px, it should remain as such.

For an image that's 400 px x 700 px, it should be resized to 400 / (700 / 600) px by 600 px, which is approximately 343 px x 600 px.

I have looked a bit into this and I see things being mentioned about the image being loaded first completely on the screen, or about using server side language like PHP, and so on, but like I said, keep in mind that this is for eBay, and so I am limited.

Note: The part that I am most interested in is in being able to detect the size / dimensions of the image.

QUESTION 2:

On a side note, does anyone know if it's possible to have a Javascript enlarging function for images, in which when one clicks on an image, it is enlarged, but either in a popup window that's smaller than the one behind it, and possibly centered, or by making the background go dark and then bringing up the enlarged image (is the latter done with Javascript; I have seen this effect for a while now and have always wondered.)

I hope someone can help me!

I have a website that sells a product through a third party merchant - ie a customer clicks my "buy now" button and they are transfered to the merchants payment processing page. once the transaction is complete the customer is sent back to my thank you page where I give them some extra stuff for free.

All pretty normal I guess.

The problem is this - The merchant sends back some url parameters when they transfer the customer to the thank you page and I would now like to use the "customer name" parameter to personalise the thank you page to test if this makes any difference to my return rate.

Now, whilst I am not a complete newbie I haven't got a clue how to achieve this. What I want to do is have the page display:

"Hello [customer] .....etc..."

The customer name parameter is passed as "cname" and is one of about a dozen passed seperated, presumably, by "&"

Thanks for any help!

Paul

Noob here. Please bear with me.http://www.codingforums.com/images/smilies/tongue.gif

<span title="this is the title">....</span>

I need to use variables for the title instad of text.

Please advise. Thank you.

hello i am editing a javascript game and im trying to get a heading (h1) to display the value of a variable in a javascript function however everything i have tried always causes an error.

Any help will be apreciated.

I wrote a script: when the same button is clicked for the first time, it should give a message "Hello World", for the second time "hello Earth". The script is not working.
I don't want anybody to re-write the script, but to look at how i define variables and tell me where I am wrong. I think, this is where the main error is.

my current script just outputs the message "hello world".

my assumption is that functions can alter the value of a global variable.


Thank you very much.


Code:

<!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">
<head>
<title> title</title>
<meta http-equiv="content-type" content="text/html;charset=UTF-8" />
<script type="text/javascript">
var count=0;

function changePar() {
if(count===0) 
first();


if(count===1) 
second();
}


function first() {
document.getElementById("changingParagraph").innerHTML="Hello World";
var count=1;
}

function second() {
document.getElementById("changingParagraph").innerHTML="Hello Earth";
var count=0;
}

</script>

</head>
<body>
<button onclick="changePar()">Click Here</button>
<p id="changingParagraph"></p>
</body>
</html>

Hi All

Please could any one shed some light on the values of thirdVar fourthVar and fifthVar.

Am i correct to say that value of thirdVar is o cromwell

Any help and explanation would be great thanks.


var firstVar = 'oliver'

var secondVar = 'cromwell'

var thirdVar = firstVar.charAt (0) + '. ' + secondVar

var fourthVar = thirdVar.length

var fifthVar = 'The last character is' + thirdVar.charAt (fourthVar) + '!'