4 Replies - 516 Views - Last Post: 01 March 2012 - 09:36 AM

#1 admjhosef  Icon User is offline

  • New D.I.C Head

Reputation: -1
  • View blog
  • Posts: 42
  • Joined: 02-October 10

[problem]Help me in this javascript program

Posted 29 February 2012 - 06:25 PM

i having a problem about this code...

when i click the first button it said undefined.

i want to have a many button

like this but the problem is it said when i click the 1st or 2nd button is undefined

that must when i click the first button the output must

Pencil

then when i click the second button the output must

pencil
ballpen


can you please help me

THANKS in ADVANCE

<BODY>

<FORM name=oform>
<SELECT NAME="SelectBox2" MULTIPLE></SELECT>
<INPUT TYPE=button onclick="UnPopulate()" VALUE="Remove">      <br><br>
<INPUT TYPE="TEST" name="NEWITEM" value = "pencil" readonly = "readonly">
Quantity
<INPUT TYPE="TEST" name="NEWITEM2">
Price
<INPUT TYPE="TEST" name="NEWITEM3">
<INPUT TYPE=button onclick="AddItem()" VALUE="Add Item">      <br><br>



<INPUT TYPE="TEST" name="NEWITEM" value = "Ball pen" readonly = "readonly">
Quantity
<INPUT TYPE="TEST" name="NEWITEM2">
Price
<INPUT TYPE="TEST" name="NEWITEM3">
<INPUT TYPE=button onclick="AddItem()" VALUE="Add Item">      <br><br>
</FORM>

<script LANGUAGE="Javascript"><!--
var frm=document.oform
var field1=frm.SelectBox1
var field2=frm.SelectBox2

var x =0;

function UnPopulate() {
  var t = field2.length-1;

  for(i=t;i >= 0;i--) {
    if (field2.options[i].selected) {
      field2.options[i] = null;
      x--;
    }
  }
}

function AddItem() {
  var l = field2.length;

  newOpt=document.oform.NEWITEM.value;
  newOpt1=document.oform.NEWITEM2.value;
  newOpt2=document.oform.NEWITEM3.value;
  total = newOpt1 * newOpt2;
  
  field2.options[l] = new Option(newOpt,newOpt);
  x++;
}


//--></SCRIPT>

</BODY>


Is This A Good Question/Topic? 0
  • +

Replies To: [problem]Help me in this javascript program

#2 JMRKER  Icon User is online

  • D.I.C Addict

Reputation: 128
  • View blog
  • Posts: 826
  • Joined: 25-October 08

Re: [problem]Help me in this javascript program

Posted 29 February 2012 - 09:55 PM

That is pretty old code you have there.
This is cleaned up a bit, not completely, but it works.

<!doctype html>
<html>
<head>
<script type="text/javascript">
var frm;
var field1;
var field2;
var x =0;

function UnPopulate() {
  var t = field2.length-1;
  for(i=t; i>=0; i--) {
    if (field2.options[i].selected) {
      field2.options[i] = null;
      x--;
    }
  }
}

function AddItem(N) {
  var l = field2.length;
  newOpt=document.oform.NEWITEM[N].value;
  newOpt1=document.oform.NEWITEM2[N].value;
  newOpt2=document.oform.NEWITEM3[N].value;
  total = newOpt1 * newOpt2;                     // Why bother?  'total' never used
  field2.options[l] = new Option(newOpt,newOpt);
  x++;
}

window.onload = function() {
  frm=document.oform;
  field1=frm.SelectBox1;
  field2=frm.SelectBox2;
}
</SCRIPT>
</head>
<BODY>

<FORM name=oform>
<SELECT NAME="SelectBox2" MULTIPLE></SELECT>

<INPUT TYPE=button onclick="UnPopulate()" VALUE="Remove">      <br><br>

<INPUT TYPE="TEST" name="NEWITEM" value = "pencil" readonly = "readonly"> Quantity
<INPUT TYPE="TEST" name="NEWITEM2"> Price
<INPUT TYPE="TEST" name="NEWITEM3">
<INPUT TYPE=button onclick="AddItem(0)" VALUE="Add Item">      <br><br>

<INPUT TYPE="TEST" name="NEWITEM" value = "Ball pen" readonly = "readonly"> Quantity
<INPUT TYPE="TEST" name="NEWITEM2"> Price
<INPUT TYPE="TEST" name="NEWITEM3">
<INPUT TYPE=button onclick="AddItem(1)" VALUE="Add Item">      <br><br>

</FORM>
</BODY>
<html>


Main problem is that you cannot reference frm, field1 or field2 until they have been created.
That was solved by the onload function

Another problem is that you have several elements named NEWITEM, NEWITEM2 and NEWITEM3
that confuse the browser because there are several elements in that named collection.

If you see script with "language = Javascript" or <!-- and //--> commands
you should think "OLD CODE ALERT!!!"
Was This Post Helpful? 0
  • +
  • -

#3 DimitriV  Icon User is offline

  • They don't think it be like it is, but it do
  • member icon

Reputation: 583
  • View blog
  • Posts: 2,738
  • Joined: 24-July 11

Re: [problem]Help me in this javascript program

Posted 29 February 2012 - 09:58 PM

I always coded my HTML buttons like this:
<Input Type = "Button" *parameters follow*>

Was This Post Helpful? 0
  • +
  • -

#4 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 3479
  • View blog
  • Posts: 10,025
  • Joined: 08-June 10

Re: [problem]Help me in this javascript program

Posted 29 February 2012 - 11:45 PM

regarding buttons and <input> elements
  • "test" is not a valid type for <input>
  • quotes around an attribute value may be omitted, if the value does not contain spaces.
  • nevertheless, it is Good Practice to always quote attribute values
  • using the <button> element allows for greater flexibility when definig buttons

Was This Post Helpful? 0
  • +
  • -

#5 JMRKER  Icon User is online

  • D.I.C Addict

Reputation: 128
  • View blog
  • Posts: 826
  • Joined: 25-October 08

Re: [problem]Help me in this javascript program

Posted 01 March 2012 - 09:36 AM

View PostDormilich, on 29 February 2012 - 11:45 PM, said:

regarding buttons and <input> elements
  • "test" is not a valid type for <input>
  • quotes around an attribute value may be omitted, if the value does not contain spaces.
  • nevertheless, it is Good Practice to always quote attribute values
  • using the <button> element allows for greater flexibility when definig buttons


I missed the type="test" assignment.
:withstupid:
Should have been type="text".

See I told you it was OLD CODE! :detective:

This post has been edited by JMRKER: 01 March 2012 - 09:37 AM

Was This Post Helpful? 0
  • +
  • -

Page 1 of 1