JavaScript - Javascript - Checkbox Update Document Text

Hi,

may I ask how do you display a line or a sentence when you click the checkbox?

In Jquery, there are following two concepts

1. Document.ready
2. Window.onload

How can i get to know when document is ready to use using pure javascript?

I have am currently taking over as the developer for this web site, and the developer who left the project unfinished wrote a script. What it does is takes posts from vBulletin forums, for instance News posts, and then it grabs the posts by ID and Title and writes the title on the home page of the web site. The problem right now that I have is the test wraps, you can see what I mean here http://www.netcodeilluminati.com/v2

If you look on the left, I want to make the text cut off after a certain amount of characters with "..." at the end as if there is more to the title but you can't see it.

Here is the script:


for (x = 0; x < 5; x++)

{

document.write("<li><div class=\"li_icon\"><img src=\"images/icons/text.png\" alt=\"text\" /></div><div class=\"li_text\">");

document.write("<a href=\"../forums/showthread.php?t="+threads[x].threadid+"\">"+threads[x].title+"</a></div></li>");

}


I was wondering how I could go about doing this.

Thanks for any future help.

-Kevin

In my program there is table which is retrieved and then there radio buttons, after selecting any radio button other columns get exapanded into textboxes to edit info.
Now for expansion I have used div<id = > tag for each textbox and
In javascript I have a function for showing textbox after clicking a radio button.In that I have used ,

arr.length=Length of the rows in table


function edit1(el)
{
for(var i=0;i<arr.length;i++)
{
if(el.value==arr[i].value)
{
//document.getElementById("test[" + i + "]").value Not workking
//document.getElementById('dname['+ i + ']').style.display = block"; Not working
document.getElementById('dname').style.display = "block";
document.getElementById('dmarks').style.display = "block";
break;
}
else
{
document.getElementById('dname').style.display = "none";
document.getElementById('dmarks').style.display = "none";
}

}//end for

}//end if
}


In HTML,

while($row1=mysql_fetch_array($rs1))
{
echo "<tr>";
/*<td>44:<div id=d4 style="display:none;"><input type=text name=t4 id=idtext></div></td></tr><br>*/

?>
<td><input type="radio" name="select" value="<?php echo $row1['rollNo'];?>" onClick='updateRec(this);'><?php echo $row1['rollNo']; ?>
<input type="radio" name="select" value="<?php echo $row1['rollNo'];?>" onClick='hiding(this);'>hide</td>

<td><?php echo $row1['name']; ?><div id="dname[]" style="display:none;"><input type=text name="tname[]"></div></td>
<td><?php echo $row1['marks']; ?><div id="dmarks[]" style="display:none;"><input type=text name="tmarks[]"></div></td>
</tr><br>

<?php } // end while
?>
</table><br><br>

Here I have to take array of div id's = "dname[]" but don't know the syntax for
document.getElementById('dname').style.display = "block"; in which dname is array

Plz help.

I'm currently working on an HTML executor and would like users to be able to put javascript in their code if they wish to do so. Currently I have their input sent to an iframe via document.body.innerHTML. The problem, though, is that user submitted javascript doesn't work (with the exception of anything placed in the onload attribute of an image). Any suggestions?

Here is my validation script from dreamweaver i also have it in php for server side. But I trying to get a checkbox to make a text field required when you select it. Right now I have it so when you hit submit whether the text field is filled out or whether the checkbox is selected or not the error message comes up no matter what i do please help.

the link to the page is http://www.mark-10.com/inquiries2

Code:

function validateCheckbox() {
if(document.forms["form1"].sales.checked) {
  if(document.forms["form1"].telephone.value.length < 12) { // xxx-xxx-xxxx
    return false	;
   }
  else {
    return true;
   }
}
}

function MM_validateForm() { //v4.0
  if (document.getElementById){
    var i,p,q,nm,test,num,min,max,errors='',args=MM_validateForm.arguments;
    for (i=0; i<(args.length-2); i+=3) { test=args[i+2]; val=document.getElementById(args[i]);
      if (val) { nm=val.name; if ((val=val.value)!="") {
        if (test.indexOf('isEmail')!=-1) { p=val.indexOf('@');
          if (p<1 || p==(val.length-1)) errors+='- '+nm+' must contain an e-mail address.\n';
        } else if (test!='R') { num = parseFloat(val);
          if (isNaN(val)) errors+='- '+nm+' must contain a number.\n';
          if (test.indexOf('inRange') != -1) { p=test.indexOf(':');
            min=test.substring(8,p); max=test.substring(p+1);
            if (num<min || max<num) errors+='- '+nm+' must contain a number between '+min+' and '+max+'.\n';
      } } } else if (test.charAt(0) == 'R') errors += '- '+nm+' is required.\n'; }
    }
	 if(!validateCheckbox()) {
       errors+="If checkbox checked, please include telephone number";
     }
if (errors) alert('The following error(s) occurred:\n'+errors);
    document.MM_returnValue = (errors == '');
} }




//-->

New to this. This code works in IE but does not work in firefox. It just stays on the same page and does nothing. Please Help!

Code:

<table>
<CFFORM action="mypage.cfm METHOD="post" name="Login" rel="nofollow" target="_blank" id="go"> 
    
  
  <cfinput type="hidden" name="decrypted" value="#decrypted#">

  <tr>
        <td>
               <a  class="K" HREF="javascript:document.go.submit();">My Page</a>
        </td>
  </tr>
  
  <tr>
        <td >
                <table>
                          <tr>
                                <td>
                                       <a HREF="javascript:document.go.submit();"><img border="0" src="images/icon.PNG"  align="left" /></a> 
                                </td>
                          </tr>
                </table>
        </td>
   </tr>
   
</CFFORM>
</table>

I've written the following html,
<html>
<head>
<script type="text/javascript">
function createpage(){
var first = document.getElementById('first').value
var second = document.getElementById('second').value
var third = document.getElementById('third').value
var j = window.open('random');
var new_page = '<html><head><script type="text/javascript">function open_win() { window.open(first) window.open(second) window.open(third) } </script></head><body onLoad = "open_win()"></body></html>';
j.document.write(new_page);
j.document.close();
}
</script>
</head>
<body>
<form action="">
<p>
First Link: <input type="text" id="first" name="first"/>
Second Link: <input type="text" id="second" name="second"/>
Third Link: <input type="text" id="third" name="third"/>
<input type=BUTTON value="Submit" name="mySubmit" onClick="createpage();return false;">
</p>
</form>
</body>
</html>

With the intention to eventually implement it into a website that "mashes" several URLs together into a tinyurl that, upon being opened, creates several tabs of the content the creator wanted in the single URL. Does that make sense?
In order to best do this I figured a page with a random character string (I haven't yet implemented this part, for now 'random' holds the place of the new page/link) would have to be created that would launch all the tabs and then close itself.

Here's what it should do...
1) User enter 3 URLs into three forms:
First Link: <input type="text" id="first" name="first"/>
Second Link: <input type="text" id="second" name="second"/>
Third Link: <input type="text" id="third" name="third"/>

2) User clicks Submit button that calls "createpage()" function that's declared in the <head>er. The first part of this function declares the links that were inputted as variables first, second, and, third.
<script type="text/javascript">
function createpage(){
var first = document.getElementById('first').value
var second = document.getElementById('second').value
var third = document.getElementById('third').value
3) "createpage()" function then declares a new window named 'random' to variable j (I have random.html stored in the same folder as this project. It is empty.)
var j = window.open('random')


4) Next "createpage()" creates a variable that stores a full page's html code that includes a script that launches each link individually with window.open().
var new_page = '<html><head><script type="text/javascript">function open_win() { window.open(first) window.open(second) window.open(third) } </script></head><body onLoad = "open_win()"></body></html>';

5) "createpage()" writes the code (stored in variable 'new_page') to document 'random' with j.document.write(new_page);

6) "createpage()" closes the document.

Without elaboration plz see my code:
Code:

<body>
<script>
var b="s";
</script>

<button target="_blank" onclick="window.open('http://......php?b="javascript:document.write(b);"&id=2&q=<?php print $_GET['q']; ?>','1','');return false;">xyz</button>
</body>

i don understand why this javascript:document.write(b); doesnt work in url...
i know its simple yet it make my hair out of my head. plz count it..

print "<Font face=\"calibri, Arial\"><table id=\"rnatable\" border=2px width=100%>";
print "<th></th>";
print "<th>a</th>";
print "<th>b</th>";
print "<th>c</th>";
print "<th>d</th>";
print "<th>e</th>";
print "<th>f</th>";
print "<th>g</th>";

while($array = mysql_fetch_array($sql_query))
{
$id=$array['a'];
print "<tr id=\"newtr\">";
print "<td><input id=\"check\" type=\"checkbox\" name=\"keyword[]\" value=\"$id\" ></td>";
print "<td>".$array['a']."</td>";
print "<td>".$array['b']."</td>";
print "<td>".$array['c']."</td>";
print "<td>".$array['d']."</td>";
print "<td>".$array['e']."</td>";
print "<td>".$array['f']."</td>";

print "<td>
<a href=\"http://localhost/rnasearch/retrieve.php?a=$id\">bla</a>
</td></tr></font>";

}

print "</table>";
}

this is part of a php searchengine script that i wrote to retrieve data from a database and as you can see the last column that is g contains a link which when clicked takes the user to the second php script which retrieves additional information of that entry, but this is done for only single entries so as you can see i introduced checkboxes so that the user can check any number of checkboxes and retrieve information as per their wish

now to do this i created a <input type=text where i want the value of these checkboxes i.e. $id to be posted in a delimited format so that the user can then click the corresponding button and retrieve the information this is the code

<div id="floatMenu">
<ul class="menu1">
<center><li><form name="senddata" method="POST" action="http://localhost/retrieve.php" style="display:inline;"><input id="fasta" type="text" class="multitext"><input name="Fasta" type="Submit" value="Retrieve Fasta"></form>

this is a css floating menu....so far so good....everything went fine....
after this i had to write a javascript to do this and i've been stuck there searching forums for the last 4 days!

this is the javascript i found from somewhere which came close to doing wht i wanted it to do

window.onload = function () {
var cb = document.getElementById('check');
var fasta = document.getElementById('fasta');
cb.onclick = function () {fasta.value = cb.value + ",";
};};

this script only sends the value of the first checkbox in the table, the others are not found by it, mind you its not the first checkbox selected its the first checkbox that is present in the table

how can i resolve this problem so that even if i have n number of checkboxes in my table, if the user chooses to do so they can retrieve n number of information....please help i've almost lost hope in this!

Hello,
I am not a coder and this has been giving me grief for days

My form is located here on page three of the multi form:
http://www.rocpinions.com/main-form.html

I have been working on this for days and can't figure it out.
I have four check boxes. Dog, Cat, Other, and None of These. If Dog Cat and Other (or any combination of) are checked that is fine but if the check box "None of These" is checked I need it to remove the checks from All other boxes.

This is an example of exactly what I need my form to do jsfiddle.net/srEuM/

Does anyone know how I can accomplish this with RS Form Pro?

Here is the code I am using:

Code:

<script type="text/javascript">
function checkI()
{
 var checkL = document.getElementsByName('form[PetsInHouse][]');
   for (var i=0;i<checkL.length-1;i++)
     if(document.getElementById('PetsInHouse3').checked){
      document.getElementById('PetsInHouse'+i).disabled = true;
      document.getElementById('PetsInHouse'+i).checked = false;
     }
     else {
      document.getElementById('PetsInHouse'+i).disabled = false;
     }
}
</script>

This is how I am calling it in the additional attributes in RS Form Pro

Code:

onclick="checkI();"

I am currently using this code above and it only disables all checkboxes when "None of These" is checked but if I check any of the other boxes I can still check "None of These" and that is not the correct functionality.
This is exactly what I need to do but in the same format I have above.
http://jsfiddle.net/srEuM/

Any help would be greatly appreciated.
Thank you
Deziner

Hi everyone.
I need a Javascript code for the following: i have a checkbox on my page. when this checkbox got checked, an alert like "Are u sure?" must ask if OK or Cancel. if i click OK the checkbox becomes checked, it runs a javascript function (chkIt() )and refreshes the page. if i click Cancel the checkbox should not became checked and my function will not run.

Thanks a lot.

Hello,

i want to build a tax calculator's form,
i want use a checkbox, so when the checkbox "checked" then the total tax will add the "luxury goods tax" on total tax.

this is my code:
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>KasKusbay Order Calculator</title>
</head>
<SCRIPT language = "javascript">

var currency_rates = new Array();
 currency_rates["GBP"]=0.62;
 currency_rates["CAD"]=0.99;
 currency_rates["EUR"]=0.75;
 currency_rates["AUD"]=0.96;

function getCurrencyRates()
{
    var currencyRates=0;
    
    var theForm = document.forms["myform"];
    
     var selectedCurrency = theForm.elements["currency"];
	      
    currencyRates = currency_rates[selectedCurrency.value];
	
    return currencyRates;
}

function addPbm()
{
    var PbmService=0;
    
    var theForm = document.forms["myform"];
    
    var pbm = theForm.elements["pbm"];

    
    if(pbm.checked==true)
    {
        pbmService = [J];
    }
    
    return pbmService;
}

function addPbm()
{
    var PbmService=0;
    
    var theForm = document.forms["myform"];
    
    var pbm = theForm.elements["pbm"];

    
    if(pbm.checked==true)
    {
        pbmService = [J];
    }
    
    return pbmService;
}

function ceiling( num, at )
{
    var temp =  num / at; // 523/50 ==>> 10.46
    return Math.ceil(temp) * at; // ceil(10.46 ==>> 11, 11 * 50 ==>> 550
}

function calculateTotal() 
{
	var X;
    var form = document.myform;
	var A = form.price.value.replace(/[^\d\.]/g, "");
    form.price.value = A;
	var B = form.shipping_cost.value.replace(/[^\d\.]/g, "");
    form.shipping_cost.value = B;
	
	var F = (parseFloat(A) + parseFloat(B)) * getCurrencyRates();
	var C = Number(F) * parseFloat("0.1");
	form.total.value = C.toFixed(2);
	
	var G = Number(F) + Number(C);
	
	var H = Number(G) * parseFloat("0.05")
	form.p2.value = H.toFixed(2);
	
	var I = Number(G) * parseFloat("0.03")
	form.p3.value = I.toFixed(2);
	
	var J = Number(G) * parseFloat("0.2")
	form.p4.value = J.toFixed(2);

	X = Number(C) + Number(H) + Number(I) + addPbm();
    form.total_IDR.value = X.toFixed(2);



//exp: ceiling: document.jslearnform.total_USD.value = Math.ceil(X);
//or decimal: document.jslearnform.total_USD.value = X.toFixed(2);
//or even document.jslearnform.total_USD.value = Math.ceil(X).toFixed(2);
 
}

</SCRIPT>
<body>
<form name="myform" method="post" action="">
  <table width="93%" border="0" id="form_table2">
    <tr>
    <th width="24%"><p>Price ›</p></th>
    <td width="37%"><p> $
        <input type="text" size="7" id="price" name="price" />
        <select id="currency" name="currency" onchange="calculateTotal()">
          <option value"gbp">GBP</option>
          <option value"cad">CAD</option>
          <option value"eur">EUR</option>
          <option value"aud">AUD</option>
        </select>
        <br />
      Input Price and Currency</p></td>
    <td width="39%" rowspan="3"><p align="right">Duty
      <input type="text" style="background-color: #DCDDDD;" size="12" id="total" readonly name="total" value="" />
    </p>
      <p align="right">Sales Tax
        <input type="text" style="background-color: #DCDDDD;" size="12" id="p2" readonly="readonly" name="p2" value="" />
      </p>
      <p align="right">Income Tax
        <input type="text" style="background-color: #DCDDDD;" size="12" id="p3" readonly="readonly" name="p3" value="" />
      </p>
      <p align="right">Luxury Goods Tax
        <input type="text" style="background-color: #DCDDDD;" size="12" id="p4" readonly="readonly" name="p4" value="" />
      </p></td>
  </tr>
  <tr>
    <th>Shipping Cost ›</th>
    <td> $
      
      <input type="text" size="7" id="shipping_cost" name="shipping_cost" />
      <br /></td>
  </tr>
  <tr>
    <th>Kind ›</th>
    <td><select id="currency3" name="currency2" onchange="calculateTotal()">
      <option value="value""EL">Electronic</option>
      <option value="value""NL">Apparel</option>
    </select>
      <br />
      <input type="checkbox" id="pbm" name="pbm" />
      Luxury Item</td>
  </tr>
  <tr>
    <th>Tax ›</th>
    <td><div align="center">
      <input type="text" style="background-color: #DCDDDD;" size="14" id="total_IDR" readonly name="total_IDR" value="" />
    </div></td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <th> </th>
    <td><div align="center">
      <input type="button" value="Calculate" onclick = "javascript:calculateTotal()" />
      <input type="reset" value="Reset" />
    </div></td>
    <td><div align="center"></div></td>
  </tr>
</table>
</form>
</body>
</html>

But i have problem with the function command, the total tax doesn't appear, seems i made wrong function code on function adPbm().

Code:

function addPbm()
{
    var PbmService=0;
    
    var theForm = document.forms["myform"];
    
    var pbm = theForm.elements["pbm"];

    
    if(pbm.checked==true)
    {
        pbmService = [J]; =====> anyone can help me correct this coding?
    }
    
    return pbmService;
}

Thank you for anyone could help.

Hello,

I'm new to Javascript, but have been programming in PHP and other web codes for 4 years now.

I was wondering how you would check if a checkbox was ticked, upon its selection and then unhide HTML content, and then hide such content when deselected..

So far I have this:

Code:

<script type="text/javascript">
	function Agree() {
		document.getElementById("stepTwo").className = "";
	}
</script>

Which is called by onclick="Agree()" on the select box itself..

I understand an if statement is needed, but how would one go about doing this as my if statements do not appear to be working.

sir i have a problem in is page. i want to have a javascript function that call on checkbox on click event.

if checked firstly a 125 x125 sized checkbox then i want to restrict that all checkbox that i checked later must 125 x 125 sized if i checked 250 x250 sized checkbox then create a alert message pleas select 125 x 125 sized ,
i also have function plz check it

function validate(f) {
var array = new Array();
for(var i = 0; i < document.delet.checkbox.length; i++){
var ele = document.delet.checkbox;

if( ele[i].checked){

var size = document.getElementById(f).value;
array[i]=size;
alert(array[0]);


/*if(array[0] == array[i]){
alert("size is equal");
}else if(){

alert("size is not equal");
}*/

}//end if
}//end for
//if(first_size != second_size){alert(second_size); return false;}
}//end function


this is a one row and repeated in while loop php script,
row code is below.

Code:

<tr bgcolor="<?php echo $color;?>">
        <td align="center">
		<input name="checkbox[]" type="checkbox" id="checkbox" value="<?php echo $aaa['id']; ?>" onclick=" return validate('<?php echo $id; ?>');" /></td>
        
        <td align="center"><?php echo $aaa['imgSize'];?><input type="hidden" id="<?php echo $id; ?>" name="size" value="<?php echo $aaa['imgSize'];?>" /></td>
        
      </tr>
      <?php
}//end while
?>

this is a online page plz check it
http://hkcsy.com/ads