JavaScript - Select Radiobox On Text Field Input

Yeah that was a loooong title. Hopefully it's clear enough

Right now, my div changes opacity if it's moused over qua the following code:

Code:

style="opacity:0.3;filter:alpha(opacity=30)" onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100" onmouseout="this.style.opacity=0.3;this.filters.alpha.opacity=30

but this isn't quite optimal, cause if the user mouses out, it changes back to fade, and the user can't quite see what he's entering. So I would like the div to have opacity=1 when one of the textfields in it is active and opacity=0 when it's not. Is there a way to do that?


//deafdigit

I'm creating a page that calculates a number depending on what value is inputted into a text field. I need to create some javascript that updates this new calculated value and outputs it next to the input field. Anytime the user changes the number, it recalculates the value. My calculation is currently being produced by PHP, however if I need to, I can create javascript as well to recalculate these numbers.

My formulas for all 4 calculations are as follows:

First: Inputted Value * 10
Second: Inputted Value * 20
Third: Inputted Value / 2
Fourth: Inputted Value * 2

Here is my code I'm working with:

PHP Code:
<?php
session_start();
$username = $_SESSION['username'];

include_once('inc/connect.php');

$credquery = mysql_query("SELECT * FROM userstats WHERE username='$username'");
$row = mysql_fetch_assoc($credquery);

$credits = $row['credits'];
$bannercredits = $row['bannercredits'];
$textcredits = $row['textcredits'];

$sitetobanner = $_POST['sitetobanner'];
$sitetotext = $_POST['sitetotext'];
$bannertotext = $_POST['bannertotext'];
$texttobanner = $_POST['texttobanner'];

if (isset($sitetobanner)){

$bannerimp = round($_POST['bannerimp']);
    if ($bannerimp > 1){
        $s = "s";
    }
    if ($bannerimp <= $credits){
        $newcredits = $credits - $bannerimp;
        $newbannercredits = $bannerimp * 10;
        $totalbannercredits = $bannercredits + $newbannercredits;
        
        $updatebanner = mysql_query("UPDATE userstats SET credits='$newcredits', bannercredits='$totalbannercredits' WHERE username='$username'");
        
        $credits = $row['credits'];
        $bannercredits = $row['bannercredits'];
        $textcredits = $row['textcredits'];

        $convertedbanner = "You converted ".$bannerimp." credit".$s." into ".$newbannercredits." banner impressions";
        
    }
    else{
    if ($credits>1){
    $mycredits = $credits - 1;}
    $errorbanner = number_format($mycredits, 0, '.', '');

    }

}


if (isset($sitetotext)){

$textimp = round($_POST['textimp']);
    if ($textimp > 1){
        $s = "s";
    }
    if ($textimp <= $credits){
        $newcredits = $credits - $textimp;
        $newtextcredits = $textimp * 20;
        $totaltextcredits = $textcredits + $newtextcredits;
        
        $updatebanner = mysql_query("UPDATE userstats SET credits='$newcredits', textcredits='$totaltextcredits' WHERE username='$username'");
        
        $credits = $row['credits'];
        $bannercredits = $row['bannercredits'];
        $textcredits = $row['textcredits'];
        
        $convertedtext = "You converted ".$textimp." credit".$s." into ".$newtextcredits." text ad impressions";
        
    }
    else{
    
    if ($credits>1){
    $mycredits = $credits - 1;}
    $errortext = number_format($mycredits, 0, '.', '');
    
    }

}


if (isset($texttobanner)){

$texttobannerimp = round($_POST['texttobannerimp']);
    if ($texttobannerimp > 1){
        $s = "s";
    }

    if ($texttobannerimp <= $textcredits){
        if ($texttobannerimp>=2&&$texttobannerimp>""){
        $newcredits = $textcredits - $texttobannerimp;
        $newbannercredits = $texttobannerimp / 2;
        $totalbannercredits = $bannercredits + $newbannercredits;
        
        $updatebanner = mysql_query("UPDATE userstats SET textcredits='$newcredits', bannercredits='$totalbannercredits' WHERE username='$username'");
        
        $credits = $row['credits'];
        $bannercredits = $row['bannercredits'];
        $textcredits = $row['textcredits'];
        
        $convertedtextimp = "You converted ".$texttobannerimp." text ad impression".$s." into ".$newbannercredits." banner impressions";
        }
        else{
            $convertedtextimp = "You Hag";
        }
    }
    else{
    
    if ($textcredits>1){
    $mycredits = $textcredits - 1;}
    $errortextimp = number_format($mycredits, 0, '.', '');
    
    }
}


if (isset($bannertotext)){

$bannertotextimp = round($_POST['bannertotextimp']);
    if ($bannertotextimp > 1){
        $s = "s";
    }
    if ($bannertotextimp <= $bannercredits){
        $newcredits = $bannercredits - $bannertotextimp;
        $newtextcredits = $bannertotextimp * 2;
        $totaltextcredits = $textcredits + $newtextcredits;
        
        $updatebanner = mysql_query("UPDATE userstats SET bannercredits='$newcredits', textcredits='$totaltextcredits' WHERE username='$username'");
        
        $credits = $row['credits'];
        $bannercredits = $row['bannercredits'];
        $textcredits = $row['textcredits'];

        $convertedbannerimp = "You converted ".$bannertotextimp." banner impression".$s." into ".$newtextcredits." text impressions";
        
    }
    else{
    
    if ($bannercredits>1){
    $mycredits = $bannercredits - 1;}
    $errorbannerimp = number_format($mycredits, 0, '.', '');
    }
}



?>
<html>
<head>
<title>Convert Credits</title>
<script type="text/javascript" language="javascript">
function inputLimiter(e,allow) {
var AllowableCharacters = '';
if (allow == 'NumbersOnly'){AllowableCharacters='0123456789.';}

var k;
k=document.all?parseInt(e.keyCode): parseInt(e.which);
if (k!=13 && k!=8 && k!=0){
if ((e.ctrlKey==false) && (e.altKey==false)) {
return (AllowableCharacters.indexOf(String.fromCharCode(k))!=-1);
} else {
return true;
}
} else {
return true;
}
}

</script>
</head>
<body>
<h1>Convert Credits</h1><br />
Credits: <?php echo $credits; ?><br />
Banner Impressions: <?php echo $bannercredits; ?><br />
Text Ad Impressions: <?php echo $textcredits; ?><br />

<form action="convert.php" method="POST">
    <h3>Credits To Banner Impressions</h3>
    Convert <input type="text" name="bannerimp" id="NumbersOnly" onkeypress="return inputLimiter(event,'NumbersOnly')" value="<?php echo $errorbanner; ?>" onChange=""> credits into BLANK Banner Impressions! 
    <input type="submit" name="sitetobanner" value="Convert"><br />
    <?php echo $convertedbanner; ?>
</form>

<form action="convert.php" method="POST">
    <h3>Credits To Text Ad Impressions</h3>
    Convert <input type="text" name="textimp" id="NumbersOnly" onkeypress="return inputLimiter(event,'NumbersOnly')" value="<?php echo $errortext; ?>"> credits into BLANK Text Ad Impressions! 
    <input type="submit" name="sitetotext" value="Convert"><br />
    <?php echo $convertedtext; ?>
</form>

<form action="convert.php" method="POST">
    <h3>Text Ad To Banner Impressions</h3>
    Convert <input type="text" name="texttobannerimp" id="NumbersOnly" onkeypress="return inputLimiter(event,'NumbersOnly')" value="<?php echo $errortextimp; ?>"> Text Ad Impressions into BLANK Banner Impressions! 
    <input type="submit" name="texttobanner" value="Convert"><br />
    <?php echo $convertedtextimp; ?>
</form>

<form action="convert.php" method="POST">
    <h3>Banner To Text Ad Impressions</h3>
    Convert <input type="text" name="bannertotextimp" id="NumbersOnly" onkeypress="return inputLimiter(event,'NumbersOnly')" value="<?php echo $errorbannerimp; ?>"> Banner Impressions into BLANK Text Ad Impressions! 
    <input type="submit" name="bannertotext" value="Convert"><br />
    <?php echo $convertedbannerimp; ?>
</form>

</body>
</html>

Hi Guys i am a complete novice at ajax or javascript.

I have been studying php for a while now and i know that, i am now starting php oop and that going well but i have never done anything like this.

Anway i am creating a booking system which at the end of the process asks who supplied your voucher which they then select a supplier.

The issue i have is my client wants it so if groupon is selected then an input text box should appear so that the user can input a security code from groupon.

So basically it is

Code:

<select name="supplier" id="supplier">
   <option value="">please select supplier</option>
   <option value="Groupon">Groupon</option>
   <option value="KGB Deals">KGB Deals</option>
   <option value="Other">Other</option>
</select>

So if value="Groupon" then Code:

<input type="text" name="security" id="security" />

should appear next to it.

Could someone please help me as the page cant refresh as it will lose its data which would have taken the user about 10 minutes to fill out

Thanks in advance

Hi, what would be the best way to have a hidden array of possible text directed at a textarea and then if something is not within that array "onfocus", a certain select option is chosen within that form?

Thanks

Hi all,

Thanks for reading. I'm having an issue trying to accomplish the following -

I have a text field (field1) already displayed on the HTML page. However, there's a link where you can add additional text fields to the page as well. When the link is clicked, the second text field is added successfully (field2), and when the link is clicked again, the third text field (field3) is added successfully. However, the third field does not add itself to the page, and the text for anything greater than a third field also isn't displayed after.

This obviously means that my "fields" variable is not working right, so I'm wondering, would anyone be able to assist me to help me get that variable processing correctly?

Code:

<script language="javascript">

fields = 1;

function addMore() {

if (fields = 1) {

document.getElementById('addedMore').innerHTML = "<input type='text' name='field2' size='25' /> <span>Field 2.</span>";

fields = 2;

} else if (fields = 2) {

document.getElementById('addedMore').innerHTML = "<input type='text' name='field3' size='25' /> <span>Field 3.</span>";
fields = 3;

} else {

document.getElementById('addedMore').innerHTML = "Only 3 fields are allowed.";
document.form.add.disabled=true;

}

}

</script>

Here is the code in my HTML -

Code:

<input type="text" name="field1" size="25" /> <span>Field 1.</span>
<div id="addedMore"></div>
<p class="addMore"><form name="add"><a onclick="addMore()">Add another field.</a></form></p>

Thank you very much.

I have a text field, call it income, that when the input is > 0 I need to dynamically show the next text box, and if it is blank hide the next text box. I would like to use onBlur but can't seem to get it to work.

Can I do this?

Help

Hi all

can someone guide me (total JS newbie) on this presumably pretty easy task?

I have a "parent" page with some text inputs in it (a form). This is what I am after:
-when the user clicks a link it pops open a new window via JS - "child" (this is working).
-in the "child" window there are also some text inputs (another form) (done).
-when the user changes the value for 'testChild_textInput_4' in the child window, then I want it to automatically set this same value, to effectively overwrite, what is currently in 'testParent_textInput_2' in the parent window.

Presumably this involves an onChange event, but it is also OK with me if the needful (the text input's value in the parent window being overwritten) happens upon the child window's form submit. If anyone can show me either trick, I would be thrilled!

I set up a test page to make this all easy to talk about:

http://www.yellow-turtle.com/testDumpMe_parent.html

Please let me know!
Thanks!
-John

I am thinking this should be fairly easy but yet I am not getting far. I want to have a form with a single text imput field for a zip code. Depending on which zip code the user enters will determine which url they will be sent to. If they enter a zip code which is not in the script, they would be sent to a default url.
I am also assuming this can be accomplished with javascript.

Any help is greatly appreciated.

Hello i am using a simple calendar date picker in which when u click a date is displayed in an input field.
Using a javascript i am trying to retrieve data from a second page using this value but probably i am doing something wrong.

1st page:
Code:

<script type="text/javascript">
 function showCustomer(str)
 {
 if (str=="")
   {
   document.getElementById("txtHint").innerHTML="";
   return;
   }
 if (window.XMLHttpRequest)
   {// code for IE7+, Firefox, Chrome, Opera, Safari
   xmlhttp=new XMLHttpRequest();
   }
 else
   {// code for IE6, IE5
   xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
   }
 xmlhttp.onreadystatechange=function()
   {
   if (xmlhttp.readyState==4 && xmlhttp.status==200)
     {
     document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
     }
   }
 xmlhttp.open("GET","check6.asp?q="+str,true);
 xmlhttp.send();
 }
 </script>
</head>
<body>
<form>
    Check in: 
    <input onchange="showCustomer(this.value)" size="22" id="f_date1" /><button id="f_btn1">...</button> 
    <script type="text/javascript">//<![CDATA[
      var cal = Calendar.setup({
          onSelect: function(cal) { cal.hide() },
          showTime: true
      });
      cal.manageFields("f_btn1", "f_date1", "%Y-%m-%d");
    //]]></script>
</form>
 <br />
 <div id="txtHint">here...</div>
</body>
 </html>

and in second one i am trying to get date like this:


Code:

sql_cmd.CommandText = "SELECT dbo.rooms.id, type, image, price,details FROM dbo.rooms, dbo.transactions WHERE dbo.rooms.id=dbo.transactions.roomid and '" & request.querystring("q") & "' not between checkin and checkout"

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<script type="javascript/text">
			<!--
				function clearInputField( input, def )
					input = document.getElementById( input );
					if ( input.value == def ) {
						input.value = '';
					}
				
				}
			-->
		</script>
	</head>
	<body>
		<b>Testing Input</b>
		<input id="input" onclick="JavaScript: clearInputField('input', 'Enter Text');" type="text" size="31" value="Enter Text"  />
	<body>
</html>

This gives me a "Uncaught ReferenceError: clearInputField is not defined" error and I'm not sure why...?

I'm new in web-development. I've searched it but it's not found. I make a input then how i get value of it for javascript value?

I have a script where I move randomly users from one multiple selectfield to another and that part works perfectly, but...

When I want to submit the form I don't get any users passed along, course they are not "selected". I have then read around on the net and I need to create an elemet with a hidden input field where all the randomly selected users is inserted to with comma separation, but dont know how?!?!

This is what I got:
Code:

function randomusers(){
	
	var given = 3, used = {}, randnum, opts = $('#select1 option'), olen = opts.length;
		function ran() { // generate a unique random number
		  randnum = Math.floor(Math.random() * olen);
		  return used['u'+randnum] ? ran() : randnum;
		}
		for (var i = 0; i < given; i++) { // get the correct quantity of randoms
		  used['u'+ran()] = true;
		}
		opts.filter(function(index) { // remove all options that are not one of the randoms
		  return !!used['u'+index];
		}).appendTo('#select2');
	
}

I have tryied to insert this: appendTo('#select2' + '<input type="hidden" name="test[]" value="" />'); but that didn't seem right...

Please help :-)

Hi everyone, im new to javascript and I have created two forms.. a value will be put in the first field and the second field should display either $20 or $35 depending on the value of the first field.

Im doing something wrong here.. but I cant see what. Any help is appreciated.


<!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 content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Distance from Depot</title>
</head>

<body>

<form id="distanceform">
<ul>
<li>
<label for="Distance from EverWarm Depot">Distance from Depot (km):</label>
<input type="text" id="distance" class="large"/>
</li>
</ul>
</form>

<input name="Button1" type="button" value="calculate" onclick="deliverycost()"/>

<form id="deliverycostform">
<ul>
<li>
<label for="Delivery Cost" >Delivery Cost:</label>
<input type="text" id="deliverycost" class="large"/>
</li>
</ul>
</form>

<script>

function deliverycost()
{
/*
Here is the delivery cost:
less than or equal to twenty kilometres is $20.00
greater than twenty kilometres is $35.00
*/

var distance = document.forms["neworder"]["distance"].value;

if(distance<20)
{
document.getElementById('deliverycost').innerHTML="$20";
}
else
{
document.getElementById('deliverycost').innerHTML="$35";
}

}
</script>

</body>

</html>

i was wondering what event would clear an input field that has a value in it...

so a user can type their own value....

any examples?

Below is my previous code I had working in the manner it would change the price, sub_total, tax, sh, total, and total_paid input fields to 0. There are two problems with this...

1. When it outputs to the input fields, the value displays as 0 instead of 0.00.
2. I need to have it only react when the value typed into the input field "trees_sold" is "0". If any higher, I would like it to ignore the statement.

Code:

<!-- Comp all prices to zero value -->
<SCRIPT LANGUAGE="JavaScript">
var trees_sold = 0.00;

function InitSaveVariables(form) {
	price = form.price.value;
	sub_total = form.sub_total.value;
	tax = form.tax.value;
	sh = form.sh.value;
	total = form.total.value;
	total_paid = form.total_paid.value;
}

function CompPrices(form) {
	if (trees_sold == 0.00) {
	InitSaveVariables(form);
	form.price.value = 0.00;
	form.sub_total.value = 0.00;
	form.tax.value = 0.00;
	form.sh.value = 0.00;
	form.total.value = 0.00;
	form.total_paid.value = 0.00;
	}
}
</script>

Code:

<input name="trees_sold" id="trees_sold" size="15" onkeyup="javascript:CompPrices(this.form);" maxlength="15" />

Below is my current code I'm working with that I can't seem to get to function properly. I've modified the first two lines of code here, and am attempting to pull any data that is typed in and automatically take into consideration if it is a "0" value, it reacts as my code below says "if (trees_sold == 0.00)" and if anything else, it will not do anything. This is not working unfortunately.

Code:

<!-- Comp all prices to zero value -->
<SCRIPT LANGUAGE="JavaScript">
form.trees_sold.value = "";
trees_sold = form.trees_sold.value;

function InitSaveVariables(form) {
	price = form.price.value;
	sub_total = form.sub_total.value;
	tax = form.tax.value;
	sh = form.sh.value;
	total = form.total.value;
	total_paid = form.total_paid.value;
}

function CompPrices(form) {
	if (trees_sold == 0.00) {
	InitSaveVariables(form);
	form.price.value = 0.00;
	form.sub_total.value = 0.00;
	form.tax.value = 0.00;
	form.sh.value = 0.00;
	form.total.value = 0.00;
	form.total_paid.value = 0.00;
	}
}
</script>

Code:

<input name="trees_sold" id="trees_sold" size="15" onkeyup="javascript:CompPrices(this.form);" maxlength="15" />

Anyone have any ideas?

Thank you.