Learn VBA & Macros in 1 Week!

JavaScript - Problem Creating Labels To Dynamically Generated Output

Full Excel VBA Course - Beginner to Expert

Problem Creating Labels To Dynamically Generated Output	View Content

Hello!

Im having problem generating the labels for content created by the following function:
Code:

function setOutput(){
    if(httpObject.readyState == 4){
		var answer = httpObject.resultsponseText.split(",");
		var results = document.getElementById("resultsultadosScan1");
		var article = document.createElement("div");
		var weight = document.createElement("div");
		var price = document.createElement("div");
		article.className = "article";
		weight.className = "weight";
		price.className = "price";
                document.getElementById('outputText0').value = httpObject.innerHTML= answer[0];
		document.getElementById('outputText1').value = httpObject.innerHTML= answer[1];
		document.getElementById('outputText2').value = httpObject.innerHTML= answer[2];
		article.innerHTML = httpObject.innerHTML= answer[0];
		weight.innerHTML = httpObject.innerHTML= answer[1];
		price.innerHTML = httpObject.innerHTML= answer[2];
		results.appendChild(article);
		results.appendChild(weight);
		results.appendChild(price);
    }
 
}

A friend wrote this sample script to achieve generation of labels on my script, but I have been trying for hours with no luck, can someone take a look and tell me the correct usage of this script:

Code:

function createLabel() {
    var target = document.getElementById("target");
    var label = document.createElement("label"); 
    var text = document.createTextNode("Article"); 
    label.appendChild(text);
    target.appendChild(label); 
}

Can you help me with the correct "combination" using my script above, a "real life" example?

Thanks a lot!

Full Excel VBA Course - Beginner to Expert

Javascript Dynamically Generated Form

Similar Tutorials

View Content

I'm new here and this is my first post, I hope I can find help here.

How can i dynamically generate this type of form element in javascript, including the table rows and columns enclosing the form elements and whenever that 'Add More' button is clicked, a new instant of the same form will generated and select drop down list populated.

I have try to google for solution, but without success.

I code in PHP, but i need it to integrate in my code.

Thanks for your help.

Triggring Event On An Element Of A Dynamically Generated Iframe

Similar Tutorials

View Content

Hello friends,
I want to trigger click event on an iframe's element through the main window, Doing it both ways, with or without jquery, will be usable for me. Basically, what I want to do is, I have developed a website http://www.ipjugaad.com, and on every document download page, I have placed an fb like button, what I want to do is that the like button should be automatically clicked when a user click on download button on my website. Give me some idea about how to do it?

Dynamically Creating An Array In A For Loop

Similar Tutorials

View Content

ok so I am trying to create a function that creates an array comprised of filenames based on a given range. I.E if 2-8 is selected and a foldername of UMCP/ and a common name of college is also given, the function should return and array such as [UMCP/college2.jpg,UMCP/college3.jpg.....UMCP/college8.jpg]. Here is what I've got but the alert that should tell me the filename of the first image says it is undefined, how can i fix this?

Code:

function getArrayPhotosNames (total,count,first,last) {
				/*window.alert("get Array Photo Names");*/
				
				var folderName = document.getElementById("photofold").value;
				var Alias = document.getElementById("commonName").value;
				
				for (var i=0; i>=total; i+=1) {
					var imageNum = i+first;
					var filename = folderName + Alias + imageNum + ".jpg";
					window.alert("image will be stored as"+filename);
					photosArrayGlobal[i]= filename;
				}
				
				
				window.alert("the first photo is" +photosArrayGlobal[0]);
				var countnum = count.value;
				if (count === 0) {
					window.alert("randomize time")
					var randomArray = photosArrayGlobal.sort( randomize() );
					var randomPhoto= document.getElementById("myImage");
					randomPhoto.setAttribute("src", randomArray[photoIndexGlobal]);
				}
				else {
					var firstPhoto=document.getElementById("myImage");
					firstPhoto.setAttribute("src", photosArrayGlobal[photoIndexGlobal])
				}
				
				
			}

Dynamically Creating Html 5 Canvas....

Similar Tutorials

View Content

Evening all.

Here's a snippet:

Code:

			canvases[i] = document.createElement('canvas');
			canvases[i].style.width = '3px';
			canvases[i].style.height = '100%';
			canvases[i].getContext("2D");
			canvases[i].fillRect(1,0,1,table_height);

I'm trying to dynamically create a canvas element. Later in the script it gets attached to the DOM, and this works fine if the last two lines are missing. I end up with a canvas element that is 3px wide and 100% of the containing div tall. However, the last two lines make it crash, with the error report 'canvases[i].fillRect is not a function'. If I change the last two lines to

Code:

			var drawing = canvases[i].getContext("2D");
			drawing.fillRect(1,0,1,table_height);

it says 'drawing is null'. Something seems to be going wrong with the getContext bit, because setting the height and width work fine. Any ideas? It behaves the same if I append the canvas element to the DOM before trying to do the drawing as well. This is in FF4.0.1 with a xhtml1-strict.dtd doctype and valid html.

Thanks,

Chris

Need Help With Creating Links In A Dynamically Created Div

Similar Tutorials

View Content

im trying to create a script for greasemonkey (tried getting help from their discussion forums, but no one ever answers), but its still written in javascript.

so here is what im trying to do. Ive got a dynamically created division that aligns to the right of the browser window. Now im trying to put links inside it as you normally would with like a document.write statement or other methods.
The only problem is, any method i try wont work for me.

heres my code, maybe someone could give me some things i could try.
Code:

function QuickLinks() 
{ 
	var body = document.body;
	var div2 = document.createElement("div");
	div2.setAttribute('class','QL');
	div2.setAttribute('style','background-color: #692510;width: 200px;height: 500px;top: 2cm;position: absolute;right: 5px;z-index: 4;');
	var links = document.createTextNode("where i want my links"); //now with that statement it just writes text, ive tried document.write and many other methods and nothing seems to work.
	div2.appendChild(links);  //this just inserts the links into the div.
	body.appendChild(document.createElement('br'));
	body.appendChild(div2);
}

QuickLinks();

Dynamically Creating Elements Inside A Table

Similar Tutorials

View Content

Forgive me, I come from a ColdFusion background and DOM manipulation is not one of my strongest assets. I am trying to dynamically create (and also delete) a row inside a table, which contains three cells that each have three form elements (a input box, a select drop-down box that is populated by a query to a database, and a textarea).

Now all the JavaScript/jQuery examples I've seen for dynamically creating elements are very basic, nothing this complex. Could I get some help?!

This is what I'm trying to dynamically create so that the user can add more options but also delete them. Would the jQuery clone() function be a good choice for this?
Code:

<tr>
	<td>
		<input type="text" id="rejectName" />
	</td>
	<td>
		<select id="divSelectReason">
			<option value="" selected="true">Enter Rejection Reason</option>
			<cfoutput query="queryReasonReturn"> 
				<option>#codeAndReason#</option>
			</cfoutput>
		</select>
	</td>
	<td>
		<textarea id="editReason" cols="30"></textarea>
	</td>
</tr>

Now when a row is dynamically created I also have to access those values as well, so I would assume using a variable that counts each row created, and appends that iteration to the name of that particular element.

Creating Fields Dynamically Upon Clicking And Data From Mysql Tables

Similar Tutorials

View Content

I have here a code that will automatically generate two text fields (Title & Price) when "Add another article" is pressed. I got this from the web, but I want instead of using a text field, I want it to create a drop down menu based on a mysql table, then update the price automatically (also based on the mysql table) on the other text field once a selection has been made on the drop down menu.

Code:

<link rel="stylesheet" type="text/css" media="screen" />
        <style type="text/css"></style>
        <script type="text/javascript">
            var elCount = 2;
            function add() {
                var parent = document.getElementById('parent');
                var article = document.createElement('DIV');
                article.id = 'article_' + elCount;
                article.name = 'article_' + elCount;                                     // NEW LINE
                var article_title_label = document.createElement('LABEL');
                article_title_label.appendChild(document.createTextNode('Title ' + elCount + ': '));
                var article_title_text = document.createElement('INPUT');
                article_title_text.id = 'article_' + elCount + '_title';
                article_title_text.name = 'article_' + elCount + '_title';                // NEW LINE
                var article_textarea_label = document.createElement('LABEL');
                article_textarea_label.appendChild(document.createTextNode('Price ' + elCount + ': '));
                var article_textarea = document.createElement('INPUT');
                article_textarea.id = 'article_' + elCount + '_price';
                article_textarea.name = 'article_' + elCount + '_price';                // NEW LINE
                article.appendChild(article_title_label);
                article.appendChild(article_title_text);
                article.appendChild(article_textarea_label);
                article.appendChild(article_textarea);
                parent.appendChild(article);
                elCount++;
            }
        </script>
<body>
                  <div id="parent">
                        <div id="article_1">
                            <label for="article_1_title">Title 1: </label><input type="text" name="article_1_title" id="article_1_title" />
                            <label for="article_1_price">Price: </label><input type="text" name="article_1_price" id="article_1_price" />
                       </div>
                  </div>

any ideas? Thanks

Script Generated Button Code Creating Corrupted Code

Similar Tutorials

View Content

I'm trying to get my Client Side Firefox DHTML app to display a list of eBooks. For this, i have the following files

F:\Textbooks.html
F:\eBooks.txt
F:\FirstBook.txt
F:\SecondBook.txt
F:\ThirdBook.txt

textbooks.html is my DHTML app
eBooks.txt is the Library file with a listing of all of my eBooks.
Inside of eBooks.txt is the following data:
-----------------
FirstBook.txt,
SecondBook.txt,
ThirdBook.txt,
-----------------

FirstBook.txt to ThirdBook.txt are my actual ebooks.

The problem that i'm having is that When i try to click on any buttons other than the FirstBook button, i get the following error:

----------------------------------
Error: unterminated string literal
Source File: file:///F:/Textbooks.html
Line: 1, Column: 10
Source Code:
LoadEbook('
----------------------------------

So, unlike clicking on the FirstBook button, these other buttons do not load the eBook data into the DIV for displaying the eBook data.

I use the DOM insepector to checkout the DOM of the button code, and it seems like whitespace maybe is the problem. However, i have removed whitespace from the HTMLdata string, and that's not fixing the problem.

did i forget something silly? LOL

i'm using FireFox 3.5 to develop this App. So obviously this will not work with anything other than Gecko Based browsers.

here is my HTML code:

<html>
<head>
<script language="JavaScript">
var eBookLibrary = "eBooks.txt";
var SystemPath = "f:" + String.fromCharCode(92)

function Init()
{
// Initialize the eBook reader
document.getElementById("EbookCanvas").style.visibility = "hidden";
document.getElementById("EbookToolbar").style.visibility = "visible";
document.getElementById("FileManager").style.visibility = "visible";

// Load the List of eBooks in the Library
LoadBookList();
}

function UpdateEbookList()
{
// Update the Library of Ebooks
alert("Updating eBook Library");

// Go back to the File Manager, and Reload the List of Ebooks
LoadBookList();
}

function LoadBookList()
{
// This will load the list of books that are available
var EbookList = LoadFromDisk(SystemPath + eBookLibrary);
var EbookListArray = EbookList.split(",");

for(var x = 0; x < EbookListArray.length -1; x++)
{
// Strip the Filename Extension off of the eBook File Name
// The Name of the Book is always the first Index in the Array
var BookName = EbookListArray[x].split(".");
// Remove the weird whitespace - it screws things up...i think...
BookName[0] = BookName[0].replace(/(^\s*|\s*$)/g, "");

var HTMLdata = HTMLdata + "<input type='button' value='" + "FirstBook" + "'" + " onClick=LoadEbook('" + EbookListArray[x] + "');><br>";
}

// For some ****ed up reason the first string always generates an 'undefined' even though it's nonsense
// So just delete that from the HTMLdata string, because it's just ugly - LOL
HTMLdata = HTMLdata.replace("undefined", "");
HTMLdata = HTMLdata.replace("", " ");

// Write the HTML data to the DIV
document.getElementById("FileManager").innerHTML = HTMLdata;
}

function LoadEbook(EbookName)
{
// Hide the File Manager and Show the Ebook Canvas
document.getElementById("FileManager").style.visibility = "hidden";
document.getElementById("EbookCanvas").style.visibility = "visible";
document.getElementById("EbookToolbar").style.visibility = "visible";

// Load the Ebook content into the Ebook Reader Pannel

var EbookContent = LoadFromDisk(SystemPath + EbookName);

document.getElementById("EbookCanvas").innerHTML = EbookContent;
}

function LoadFromDisk(filePath)
{
if(window.Components)
try
{
netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
var file = Components.classes["@mozilla.org/file/local;1"].createInstance(Components.interfaces.nsILocalFile);
file.initWithPath(filePath);
if (!file.exists())
return(null);
var inputStream = Components.classes["@mozilla.org/network/file-input-stream;1"].createInstance(Components.interfaces.nsIFileInputStream);
inputStream.init(file, 0x01, 00004, null);
var sInputStream = Components.classes["@mozilla.org/scriptableinputstream;1"].createInstance(Components.interfaces.nsIScriptableInputStream);
sInputStream.init(inputStream);
return(sInputStream.read(sInputStream.available()));
}
catch(e)
{
//alert("Exception while attempting to load\n\n" + e);
return(false);
}
return(null);
}
</script>
</head>

<body onLoad="Init();">

<div id="FileManager" style="position: absolute; top: 0px; left: 0px; visibility: visible;">
The eBook Library's List of Books will be listed here.
Click on one to open it in the eBook Reader
</div>
<br>
<div id="EbookCanvas" style="position: absolute; top: 0px; left: 0px; visibility: hidden;">
</div>
<br>

<div id="EbookToolbar" style="position: absolute; top: 100px; left: 0px;">
<input type="button" value="Open" OnClick="Init();">
<input type="button" value="Update" OnClick="UpdateEbookList();">
<input type="button" value="Exit" OnClick="MainMenu();">
</div>

</body>
</html>

Creating Arrays Dynamically, Need Help Looping An Array To Make Arrays. : (

Similar Tutorials

View Content

I need to loop the alphabet and numbers 0-9 to initialize a few thousand arrays.
This is for my site and is truly needed. http://www.thefreemenu.com
I currently have every array written out and it takes up to much space in my .js file.
The majority of my variables are empty but necessary and need to be there (including empty) for my site to work properly.

Question is the last part

Here's where I'm at.

Code:

var NewVarLetterOrNum = "a";
eval("_oneofseveralnames_" + NewVarLetterOrNum + "='this part works';");
alert(_oneofseveralnames_a);

This creates the variable _oneofseveralnames_a='this part works'

Code:

var newArrayLetterOrNum = "a";
eval("_oneofseveralnames_" + newArrayLetterOrNum + "= new Array();"); 
alert(_oneofseveralnames_a)

This creates the Array _oneofseveralnames_a=new Array(); and all the values in the array are null,
but, now a variable like _nl_a[1]='something' can be used elsewhere because the array exists. This is all that is necessary for now
because I can probably set all the variables to be blank with something like

Code:

i=1
while(i<=20){
_oneofseveralnames_a[i]="1-20";
i++
}
alert(_oneofseveralnames_[20]);

So now you have what I came to understand in the first few hours. Now to the hard part : (

I can't make multiple array's dynamically. I dont' know if its because I don't understand loops or arrays or what and its very fustrating. As for any answer you might be so kind as to provide, if you could dumb it down that would be greatly appreciated.
Code:

var newArray =new Array('a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z')    
i=1
while(i<=26){
	eval("_nl_" + newArray[i] + "= new Array();");
	i++
}
alert(newArray[1]) // Is b, but
alert(_nl_b) //I can't get _nl_b to exist, I tried everything including taking away the quotes around the letters in every test

*/
var _nl_a =new Array()
var _img_a =new Array()
var _h_a =new Array()
var _r_a =new Array()
var _m_a =new Array()
var _yt_a =new Array()
var _i_a =new Array()

The above arrays are all the array _name_ parts I need but for example, a has 10 parts, a,p2_a,p3_a,.. p10_a. I need 10 pages for each letter of the alphabet and numbers 0-9 and a special all1, p2_all1 ... p10_all1. Overall 2200 arrays that need to be declared. Currently they are all written out.
/*

Random Generated Ticker/scroller (marquee) - Stop On Mouseover, And Problem With Font

Similar Tutorials

View Content

Hi all, i'm using this code:

Code:

var r_text = new Array ();

r_text[0] = "Random Text 0";
r_text[1] = "Random Text 1";
r_text[2] = "Random Text 2";
r_text[3] = "Random Text 3";
r_text[4] = "Random Text 4";
r_text[5] = "Random Text 5";
r_text[6] = "Random Text 6";
r_text[7] = "Random Text 7";
r_text[8] = "Random Text 8";


var i = Math.floor(9*Math.random());

   {
   document.write("<Marquee SCROLLAMOUNT=10><FONT-FAMILY: 'Calibri'><FONT-SIZE: 13pt)<B><FONT COLOR='#FFFF00'>" +
   r_text[i] + "</FONT></B></FONT-SIZE></FONT-FAMILY></Marquee>");
	}

This code works as far as me getting a right to left marquee, which, every time the page reloads, generates one of the random pieces of text.

I'd like to add a piece of coding to this so that on mouseover, the marquee will pause, but I don't have a clue what to add, or where.

My other problem:

The text is yellow..size 10, yet whatever font family i specify, will ALWAYS appear in the font Georgia (in the browser im using, Firefox.) in both Opera and IE, it comes out Times New Roman! this is a real rooky problem, but i am a rooky and i'd just like to understand why, and how to ACTUALLY get Calibri.

Any help would be greatly appreciated

Dynamically Adding Onmouseover Problem

Similar Tutorials

View Content

So I have been struggling with a Javascript issues for a couple of days now and can't find an answer anywhere online that has helped.

I have a javascript loop that is looping through all of my <dfn> html tags. These tags are used to show a glossary term on my page. When the user mouses over the term it shows a popup with the term name and the definition. Here is my javascript function:

Code:

function definitionRollover(){
	var j;
	var dfns = document.getElementsByTagName('dfn')
	for (j=0; j<dfns.length;j++){
		var term = dfns[j].innerHTML.charAt(0).toUpperCase() + dfns[j].innerHTML.slice(1);
		var definitionArray = new Array(term, dfns[j].title);
		dfns[j].onmouseover = function(){stm(definitionArray,Style[0])}
		
		dfns[j].onmouseout = function(){htm();};
	}
}

As you can see I am adding a onmouseover event to these <dfn> tags which calls another function (stm) with the definition and term being held in the definitionArray. This works great until I have multiple terms on a page. When I have multiple terms it only shows the last terms definition for all terms. My question is how I can get it to work for all terms. I know that throughout the loop the definitionArray is holding the correct info at the correct time but for some reason it only shows the last one.

I hope that this makes sense and if anyone could give me any tips or leads it would be very much appreciated.

Dynamically Setting Height Of Iframe Problem

Similar Tutorials

View Content

Dynamically Disable Drop-down Menu Options Problem

Similar Tutorials

View Content

My problem has to do with having more then two drop down menus and disabling selected items. In this example whenever anyone selects an option from either of the drop-down menus the opposing drop-down menu greys out the selection:

Code:

<script type="text/javascript"> 

function updateSelect(changedSelect, selectId) {
   var otherSelect = document.getElementById(selectId);
   for (var i = 0; i < otherSelect.options.length; ++i) {
       otherSelect.options[i].disabled = false;
   }
   if (changedSelect.selectedIndex == 0) {
      return;
   }
   otherSelect.options[changedSelect.selectedIndex].disabled = true;
}

</script>

Code:

<select id="subject1" name="indication_subject[]" onchange="updateSelect(this,'subject2');" >
  <option value="1">A</option>
  <option value="2">B</option>
  <option value="3">C</option>
</select>

<select id="subject2" name="indication_subject[]" onchange="updateSelect(this,'subject1');" >
  <option value="1">A</option>
  <option value="2">B</option>
  <option value="3">C</option>
</select>

The above code works perfect. My problem is extending this to even more drop-down menus. I'm not a javascript guy but my logic was thinking something like this:

Code:

ARRAY = "subject1, subject2, subject3"; 

<select id="subject1" name="indication_subject[]" onchange="updateSelect(this,'ARRAY');" >

...either an array to include multiple drop-down menus or what about something like this?

Code:

<select id="subject2" name="indication_subject[]" onchange="updateSelect(this,'subject1, subject2, subject3, subject4');" >

Obviously I know my code solutions don't work, however, I'm hoping they can provide someone with clarity with respect to what I'm trying to accomplish.

I sincerely would appreciate anyone's help on this.

Output Problem

Similar Tutorials

View Content

hi,

The following script is supposed to display an output of 5000 or more lines
but it stucks if output is more than 3000 lines.
so is it possible to achieve such a program..? or does it depend on the computer CPU?

thanks

PHP Code:
<body bgcolor=9999cc>
   <script>

   count=0;
   function yaz()
   {
       document.getElementById("kutu").innerHTML="";
    document.getElementById("bt").value="";
    count=0;

   for(var a=0;a<=4;a++){
   for(var b=0;b<=4;b++){
   for(var c=0;c<=4;c++){
       for(var d=0;d<=4;d++){
    for(var e=0;e<=4;e++){
       for(var f=0;f<=4;f++){
    for(var g=0;g<=4;g++){
       for(var h=0;h<=4;h++){

   if((a<b)&(c<d)&(e<f)&(g<h))
   {
count++;
       document.getElementById("kutu").innerHTML+=count+"--"+a+".."+b+".."+c+".."+d+".."+e+".."+f+".."+g+".."+h+"<br>";
          } }     }}    }} }}
   }
             document.getElementById("bt").value="there are.."+count+"..lines ";
   }

   </script>
    <center>

    <input type="button"id="bt" value="gooo" onclick="yaz()">
   <div id="kutu"align="center" style="border-style:solid;border-width:2;border-color:blue;background-color:pink;width:400;color:green;">
   </div>

     </body>
</html>

Problem In Popup Calender In Dynamically Loading Rows In Java Script

Similar Tutorials

View Content

I have written this code but when i include code for pop calender in a row, then button was disabled, So please help me i just struck in this problem from last one week
Thanking you,
L.Rajesh
rajboy13@gmail.com

my code is

Code:

function addRow()
{
var tbl = document.getElementById('tblMed');
var lastRow = tbl.rows.length;
var iteration = lastRow;
var row = tbl.insertRow(lastRow);

 var cellLeft = row.insertCell(0);
  var sl = document.createElement('input');
  sl.type = 'text';
  sl.name = 'sln' ;
  sl.id = 'sln' + iteration;
  sl.value = iteration;
  sl.size = 3;
  sl.readOnly = true;
  cellLeft.appendChild(sl);

var cellRights= row.insertCell(1);
var elm= document.createElement('input');
elm.type = 'text';
elm.name = 'txtMdesc' ;
elm.id = 'Mdesc' + iteration;
elm.size = 20;
cellRights.appendChild(elm);

var cellRightt= row.insertCell(2);
var elmn= document.createElement('input');
elmn.type = 'text';
elmn.name = 'txtMqty' ;
elmn.onclick = "cal1xx.select(document.forms[0].sdate,'anchor1xx','dd-MM-yy');
elmn.id = 'Mqty' + iteration;
elmn.size = 20;
cellRightt.appendChild(elmn)";

var cellRightu= row.insertCell(3);
var elmno= document.createElement('input');
elmno.type = 'text';
elmno.name = 'txtMbill' ;
elmno.id = 'Mbill' + iteration;
elmno.size = 20;
cellRightu.appendChild(elmno);

}

the button code is :
Code:

</br>
 <fieldset style="width:60%;" align="center"> <legend>


<SCRIPT LANGUAGE="JavaScript">
function deleteRow(b){
    document.getElementById('table_formcontainer').deleteRow(b)
}
function CompareDates1() 
{ 
	var str1  = document.getElementById("start").value;   
	var str2  = document.getElementById("edate").value;  
	var dt1   = parseInt(str1.substring(0,2),10);    
	var mon1  = parseInt(str1.substring(3,5),10);  
	var yr1   = parseInt(str1.substring(6,10),10);   
	var dt2   = parseInt(str2.substring(0,2),10);    
	var mon2  = parseInt(str2.substring(3,5),10);   
	var yr2   = parseInt(str2.substring(6,10),10);   
	var date1 = new Date(yr1, mon1, dt1);    
	var date2 = new Date(yr2, mon2, dt2);    
	if(date2 < date1)  
		{      
			alert("To date cannot be greater than from date");      
			return false;   
		}    
	else   
		{      
			alert("Submitting ...");     
			document.form1.submit();   
		} 
		return true;
}
function addRow()
{
var tbl = document.getElementById('tblMed');
var lastRow = tbl.rows.length;
var iteration = lastRow;
var row = tbl.insertRow(lastRow);

 var cellLeft = row.insertCell(0);
  var sl = document.createElement('input');
  sl.type = 'text';
  sl.name = 'sln' ;
  sl.id = 'sln' + iteration;
  sl.value = iteration;
  sl.size = 3;
  sl.readOnly = true;
  cellLeft.appendChild(sl);

var cellRights= row.insertCell(1);
var elm= document.createElement('input');
elm.type = 'text';
elm.name = 'txtMdesc' ;
elm.id = 'Mdesc' + iteration;
elm.size = 20;
cellRights.appendChild(elm);

var cellRightt= row.insertCell(2);
var elmn= document.createElement('input');
elmn.type = 'text';
elmn.name = 'txtMqty' ;
elmn.onclick = "cal1xx.select(document.forms[0].sdate,'anchor1xx','dd-MM-yy');
elmn.id = 'Mqty' + iteration;
elmn.size = 20;
cellRightt.appendChild(elmn)";

var cellRightu= row.insertCell(3);
var elmno= document.createElement('input');
elmno.type = 'text';
elmno.name = 'txtMbill' ;
elmno.id = 'Mbill' + iteration;
elmno.size = 20;
cellRightu.appendChild(elmno);

}

function delRow1(c)
{
    document.getElementById('tblMed').deleteRow(c)
}

function validate()
{
	
	var tbl = document.getElementById('tblMed');
    var lastRow= tbl.rows.length-1;
   	var a;

    for (a=1; a<=lastRow; a++)
		{
      var def = document.getElementById('sln'+ a);
      var ghi = document.getElementById('Mdesc'+ a);
	   var jkl = document.getElementById('Mqty'+ a);
	   var jkl1 = document.getElementById('Mqty'+ a).value;
       var abc = document.getElementById('Mbill'+ a);
       var gpexpdt2 = document.getElementById('tblMed').value;
      var str11  = document.getElementById("sdate").value; 
      var str12  = document.getElementById("edate").value;
	  var tranday = jkl1.substring(0,2);
      var tranmon = jkl1.substring(3,5);
      var tranyear = jkl1.substring(6,10);
	


	var trandate = new Date(tranyear,tranmon,tranday);
	 var tranday2 = str11.substring(0,2);
	  
          var tranmon2 = str11.substring(3,5);
         


	var tranyear2 = str11.substring(6,10);
	


	var trandate2 = new Date(tranyear2,tranmon2,tranday2);
	var tranday3 = str12.substring(0,2);
	  
          var tranmon3 = str12.substring(3,5);
         


	var tranyear3 = str12.substring(6,10);
	


	
if ((document.getElementById("AC").value == ""))
{
alert ( "Please enter Amount Claimed." );
document.form5.AC.focus();
return false;
}

else if((document.getElementById("Amb").value == ""))
{
alert ( "Please enter Relationship" );
document.form5.Amb.focus();
return false;
}

if ( document.form5.Treat.selectedIndex == "")
    {
        alert ( "Please select Treatment Type" );
		document.form5.Treat.focus();
        return false;
    }

else if((document.getElementById("C10").value == ""))
{
alert ( "Please enter Total " );
document.form5.C10.focus();
return false;
}

else if((document.getElementById("C11").value == ""))
{
alert ( "Please enter Place " );
document.form5.C11.focus();
return false;
}

else if((document.getElementById("start").value == ""))
{
alert ( "Please enter from date" );
document.form5.start.focus();
return false;
}

else if((document.getElementById("edate").value == ""))
{
alert ( "Please enter to date" );
document.form5.edate.focus();
return false;
}
    if (ghi.value.length == "")
	  {
        alert('Please enter Bill No');
        ghi.focus();

        return false;
      }
	  if (jkl.value.length == "")
	  {
        alert('Please enter Date');
	   jkl.focus();
        return false;
      }
	  var trandate3 = new Date(tranyear3,tranmon3,tranday3);
	if (tranmon > 12|| tranmon < 1)
		 {
			 alert('Invalid Month In Date Field .Enter as dd-mm-yy');
        	jkl.focus();
			 return false;
		 }
		 if (tranday > 31|| tranday < 1)
		 {
			 alert('Invalid Date In Date Field Enter as dd-mm-yy');
			 		jkl.focus();
			 return false;
		 }
		 if(trandate2.getTime() > trandate.getTime())
			{
	alert("Bill date should be less than From date");
	jkl.focus();
	return false;
			}
			if(trandate3.getTime() < trandate.getTime())
			{
	alert("Bill date should not  be greater than End date");
	jkl.focus();
	return false;
			}
	
     if (abc.value.length == "")
	  {
        alert('Please enter Amount');
	    abc.focus();
        return false;
      }
	  	
	 
var str3  = document.getElementById("AC").value;
var str4  = document.getElementById("Amb").value;

if(parseInt(str3) > parseInt(str4))
{
alert('Amount Claimed must be less than Amount Balance');
document.form5.AC.focus();
return false;
}	
var alertsay = ""; 
if (form5.Treat.value > 4)
{
alert("Sorry You Can Not This Employee Data In Database..........");
form5.Treat.focus();
return (false);
}
var checkOK = "0123456789";
var checkStr = abc.value;
var allValid = true;
var allNum = "";
for (e = 0;  e < checkStr.length;  e++)
{
ch = checkStr.charAt(e);
for (f = 0;  f < checkOK.length;  f++)
if (ch == checkOK.charAt(f))
break;

if (f == checkOK.length)
{
allValid = false;
break;
}
if (ch != ",")
allNum += ch;
}
if (!allValid)
{
alert("Invalid Data Please enter only digits'");
abc.focus();
return (false);
}
}
 return true;
}
var count =0;
function Check()
	{
if (!validate())
	return true;
	 addRow()
	}
function removeRow1()
{
var tbl = document.getElementById('tblMed');
var lastRow = tbl.rows.length;
if (lastRow > 1) tbl.deleteRow(lastRow - 1);
}
function deleteRow(node) {
if (rowNum > 1) {
var td = node.parentNode; 
while (td.tblMed.toLowerCase() != "tr") 
td = td.parentNode; 
td.parentNode.removeChild(td); 
rowNum = rowNum - 1;
document.form1.count.value = rowNum;
}
else { 
alert ("You cannot delete the last remaining row");
} 
}

</script>

<b><font color="#153E7E"border="1">Bill Details</b></legend><br>
<table id="tblMed" width="75%">
<tr>
<th>Sl.No.</th>
<th align="left">Bill No</th>
<th align="left" onClick="cal1xx.select(document.forms[0].edate,'anchor1xx','dd-MM-yy'); return false;" NAME="anchor1xx" ID="anchor1xx" onFocus="self.status='Select Treatment Start Date';return true; " onBlur="self.status='';return true;">Bill Date(DD-MON-YY)</th>
<th>Bill Amount( <span class="WebRupee">Rs.</span> )</th>

</tr>

</table>
<tr><br/>
&nbsp &nbsp <input name="button" type="button" value="Add  Bill" onClick="Check()"/>

................................................................................................

i want popup calender in 3rd row of the table

please help and if any one got solution then please please mail it to my gmail id : rajboy13@gmail.com

Problem Getting Input/output In A Form

Similar Tutorials

View Content

Hi guys,

I am new to Javascript and I'm trying to set up a form to make simple calculation based on user inputs. I have set up the form and am unable to get the calculation to work despite what I try (this is based on an online tutorial I found though). Is there any where I am going wrong?

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>

<head>
<script type="text/javascript" language="javascript">


function kanban()
{

//variables

A = document.frmone.annualdemand.value;
B = document.frmone.demandVariability.value;
C = document.frmone.weeksHold.value;
D = document.frmone.ContainerSize.value;
E = document.frmone.totalStock.value;


//calculation

F = A/240;
double G = (b/100)+1;
H = g*F;	
c = c*5;
i = c*H;
j = i/d;

document.frmone.totalStock.value = i;
document.frmone.noKanBans.value = j;
}
</script>

<title>Insert Title Here</title>
</head>

<body>


	<form name="kanban" id="frmone">
		Annual Demand: <input type="text" name="annualDemand" value=""/> </br>
		Demand Variation: <input type="text" name="demandVariability" value=""/> </br>
		Stock to Hold (weeks): <input type="text" name="weeksHold" value=""/> </br>
		Size of Container: <input type="text" name="containerSize" value=""/> </br>
		</br>
		<input type="button" name="calculate" value="Calculate" 				
		onclick="kanban()"/> </br>
		</br>
		Total Stock: <input type="text" name="totalStock" value=""/> </br>
		Qty of Kan Bans: <input type="text" name="noKanBans" value=""/> </br>

	</form>

</body>
</html>

Thanks guys.

How To Put The Form Labels On The Right?

Similar Tutorials

View Content

Hi,

Please look at the following comment form:
http://docs.jquery.com/Plugins/Validation

There's a similar one on this page:
http://jquery.bassistance.de/validate/demo/

I'd like to put the labels on the right of text input fields and display the error messages under input fields.
Tried almost anything, but to no avail.

Any help is greatly appreciated!
Rain Lover

Java Script - How To Externalize Labels?

Similar Tutorials

View Content

Hi,

I have this js file which basically is a UI screen. This screen displays lot of labels to the user.
I need to externalize this label from .js file. What i mean by this is, i will be storing my label names in a table and will fetch it from DB before i load the .js file and show it in UI.
How do i make these labels dynamic?? Can i get the labels from DB using a .vb function (.vb file) and call this function in the .js file? Or is this not possible at all.

I am relatively new to java script. So can you let me know what my options are? And any pointers to sample code will also be helpful.

Thanks

I'm Having A Problem Creating A Javascript Form. Can Someone Tell Me Where I'm Going

Similar Tutorials

View Content

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" xml:lang="en" lang="en">
<head>
    <title>
     Project 2
    </title>    
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <meta http-equiv="content-language" content="en-us" />
    <link rel="stylesheet" href="../jsfiles/js_styles.css" type="text/css" />
    
<script type="text/javascript">
/* <![CDATA[ */
function checkForNumber(fieldValue) {
var numberCheck = isNaN(fieldValue);
if (numberCheck == true) {
window.alert("You must enter a numeric value!");
return false;
}
return true;
}
function calculate() 
  var shipping = 0;
  var total = 0; {
  if (document.forms[0].hand_tool.value != document.forms[0].hand_tool.value == true)
    (document.forms[0]item1.value == 20); {
  && document.forms[0].shipping.value == (shipping + 5); {
  && (document.forms[0].total.value = document.forms[0].hand_tool.value + document.forms[0].shipping.value)
      }
    }   
function confirmSubmit() {
  if (document.forms[0].first_name.value = "null") {
  window.alert("You have not entered the requested Customer Information.");
  return false;
  }
  else if (document.forms[0].last_name.value = "none" || document.forms[0].city.value = "" || document.forms[0].state.value = "none") {
  window.alert("You have not entered the requested Customer Information.");
  return false;
  }
  var pmntMethod = false
  for (var j=0; j<3; ++j) {
      if (document.forms[0].credit_card[j].checked == true) {
          pmntMethod = true;
          break;
          }
  }
  if (pmntMethod != true) {
      window.alert("You must select a method of payment.");
      return false;
  }
return true;
}
function confirmReset() {
  var resetForm = window.confirm("Are you sure you want to reset the form?");
  if (resetForm == true)
      return true;
  return false;
  }
/* ]]> */
</script>
</head>

  <body> 
  <!-- Your XHTML here -->
<h1>Purchase Order</h1>
<form action="FormProcessor.html" method="get" enctype="application/x-www-form-urlencoded" onsubmit="return confirmSubmit();" onreset="return confirmReset();">    
<h3>Products</h3>
<table>
<tr>
  <td>  
<p>Hand Tools <br />$20.00<img src="handtools.gif" alt="Hand Tools" class="img" /></p>
  </td>
  <td>
  <select name="hand_tool" size="1">
      <option value="hand_tool">Hand Tool</option>
      <option value="saw">Saw</option>
      <option value="hammer">Hammer</option>
      <option value="screwdriver">Screwdriver</option>
      <option value="wrench">Wrench</option>
      <option value="pliers">Pliers</option>
      </select>
  </td>
  <td>
  <p>Power Tools <br />$30.00<img src="powertools.gif" alt="Power Tools" class="img" /></p>
  </td>
  <td>      
  <select name="power_tool" size="1">
      <option value="power_tool">Power Tool</option>
      <option value="circular_saw">Circular Saw</option>
      <option value="sabre_saw">Sabre Saw</option>
      <option value="drill">Drill</option>
      <option value="belt_sander">Belt Sander</option>
      <option value="table_saw">Table Saw</option>
    </select>
  </td> 
</tr>
</table>
  
<h3>Shipping Fees</h3>
<table>
  <tr>
  <td>Item 1: <input type="text" name="item1" value="" onchange="calculate();" /></td>
  <td>Item 2: <input type="text" name="itme2" value="" onchange="calculate()" /></td>
  </tr>
  <tr>
  <td>Shipping: <input type="text" name="shipping" value="" /></td>
  <td>Total: <input type="text" name="total" value="" /></td>
  </tr> 
</table> 
<h3>Customer Information</h3>
  <p>First Name
    <input type="text" name="first_name" value="FirstName" onclick="document.forms[0].first_name.value = '';" onchange="confirmSubmit();"/>  
  Last Name
    <input type="text" name="last_name" value="LastName" onclick="document.forms[0].last_name.value = '';" onchange="confirmSubmit();" /></p>
  <p>Street Address 1 
    <input type="text" name="address1" value="Address1" onclick="document.forms[0].address1.value = '';" onchange="confirmSubmit();" /></p>
  <p>City 
    <input type="text" name="city" value="City" onclick="document.forms[0].city.value = '';" onchange="confirmSubmit();" />
  State 
    <input type="text" name="state" value="State" onclick="document.forms[0].state.value = '';" onchange="confirmSubmit();" />
  Zip 
    <input type="text" name="zip" value="Zip" onchange="return checkForNumber(this.value);" onclick="document.forms[0].zip.value = '';" /></p>
  <p>Phone
		<input type="text" name="phone" value="Phone" onchange="return checkForNumber(this.value);" onclick="document.forms[0].phone.value = '';" />
	Fax
    <input type="text" name="fax" value="Fax" onclick="document.forms[0].fax.value = '';" onchange="return checkForNumber(this.value);" /></p>
  
  <p>Payment Method? 
  <input type="radio" name="credit_card" />Visa
  
  <input type="radio" name="credit_card" />MasterCard
  
  <input type="radio" name="credit_card" />American Express</p>
  <p>Credit Card Number<input type="text" name="cardNumber" value="CardNumber" size="50" onclick="document.forms[0].cardNumber.value = '';" onchange="return checkForNumber(this.value);" /></p>

<table>
<tr>
  <td>  
<p>Expiration Month</p>
  </td>
  <td>
  <select name="month" size="1" style="width: 200px">
      <option value="months">Month</option>
      <option value="january">January</option>
      <option value="february">February</option>
      <option value="march">March</option>
      <option value="april">April</option>
      <option value="may">May</option>
      <option value="june">June</option>
      <option value="july">July</option>
      <option value="august">August</option>
      <option value="september">September</option>
      <option value="october">October</option>
      <option value="november">November</option>
      <option value="december">December</option>
      </select>
  </td>
  <td>
  
  <p>Expiration Year</p>
  </td>
  <td>      
  <select name="expiration" size="1">
      <option value="2009">2009</option>
      <option value="2010">2010</option>
      <option value="2011">2011</option>
      <option value="2012">2012</option>
      <option value="2013">2013</option>
      <option value="2014">2014</option>
    </select>
  </td> 
</tr>
</table>

<p><input type="image" alt="Graphical image of a submit button" src="submit.gif" onchange="confirmSubmit()" /></p>
<p><input type="reset" value="Reset Purchase Order Form" onchange="confirmReset();" /></p>    
</form>    


<!-- your XHTML validation icon-->  
<p>
    <a href="http://validator.w3.org/check?uri=referer"><img
        src="http://www.w3.org/Icons/valid-xhtml10"
        alt="Valid XHTML 1.0 Strict" height="31" width="88" 
        style="border: 0px;" /></a>
    <a href="http://jigsaw.w3.org/css-validator/check/referer">
    <img src="http://www.austincc.edu/jscholl/images/vcss.png" 
    alt="Valid CSS!" height="31" width="88" style="border: 0px;" /></a>       
</p>

  </body>
  </html>

Problem Creating A Drop Down Menu And Submit

Similar Tutorials

View Content

The code below is a download form,, the number after the P= are the index idents for each file to be downloaded..
The destination_folder is set for C:\temp as default location.

the code below works as needed for one file,,however i need to create a drop down list which will show all file names,and automatically throw the right ident for that file after the P=.
sounds simple enough but there are other sections that are tied to this form so the solution has to use the CFForm_1(this) else i'll have to redo all the other sections as well. as well as javascript
if anyone has a quick and clean way to do this i'd be very appreciative. i've pulled my hair out trying to find examples using this config and none are even close..or don't have a drop down menu
Code:

<form name="CFForm_1" 
action="http://www.XXX.cfm?p=6D6F615CC&rt=2&st=2" method="POST" onsubmit="CFForm_1(this)">

<input name="destination_folder" id="destination_folder" type="text" value="C:\Temp" 
maxlength="200"  size="60"  />
												
<input type="Submit" value="Resume">

thanks in advance, Rick