1,105,328 Community Members

[object HTMLInputElement] instead of value? WTF?

Member Avatar
gotboots
Junior Poster in Training
60 posts since Jun 2011
Reputation Points: 2 [?]
Q&As Helped to Solve: 4 [?]
Skill Endorsements: 0 [?]
 
0
 

Hi all,

I have recently made a ajax script that works completely. It updates the database as required on click of the FU anchor. In the middle of the form I also have a yes | no option that copies the billing address to the shipping address, which also works.

The problem is once I have clicked yes to update the shipping as billing, then click FU, then I refresh to check its working, the shipping address comes up with

[object HTMLInputElement]

How do I get it to update with the actual value?

Heres my code:

form:

<form method='post' action=''>

<h1>Customer</h1>
<table width='100%'>
<tr><td align='right'>CustID</td><td><input type='text' name='custID' value='' id='custID' style='width:auto;'><div style='float:right;'><input type='submit' name='submit' value='Create'>  <input type='submit' name='submit' value='Update'>   <input type='submit' name='submit' value='Delete'><a onclick='fastupdate()'>FU</a></div></td></tr>
  <tr><td align='right' style='width:170px;'>Customer name</td><td><input type='text' name='custName' id='custName' value='' style='width:100%;'></td></tr>

  <tr><td align='right'>Status</td><td><input type='text' name='status' id='status' value='' list='status' style='width:100%;'></td></tr>
<tr><td align='right'>IP</td><td><input type='text' name='ip' id='ip' value='' style='width:100%;'></td></tr>
  <tr><td align='right'>Date in</td><td><input type='text' id='dateIn' name='dateIn' value='' style='width:100%;'></td>
  <tr><td align='right'>Lead</td><td><input type='text' id='lead' name='lead' value='' style='width:100%;'></td></tr>
  <tr><td align='right'><a href='../mail?safeemail=&safename='>Email</a></td><td><input type='text' id='email' name='email' value='' style='width:100%;'></td></tr>
  <tr><td align='right'>Cell</td><td><input type='text' id='cell' name='cell' value='' style='width:100%;'></td></tr>

  <tr><td align='right'>Work</td><td><input type='text' id='work' name='work' value='' style='width:100%;'></td></tr>
  <tr><td align='right'>Home</td><td><input type='text' id='home' name='home' value='' style='width:100%;'></td></tr>
  <tr><td align='right'>Time</td><td><input type='text' id='time' name='time' value='' style='width:100%;'></td></tr></tr>

<tr><td align='right'>Billing address</td><td><input type='text' id='ba' name='ba' value='' style='width:100%;'></td></tr>
  <tr><td align='right'>Billing suburb</td><td><input type='text' id='bs' name='bs' value='' list='suburbs' style='width:100%;'></td></tr>
  <tr><td align='right'>Billing city</td><td><input type='text' id='bc' name='bc' value='' list='cities' style='width:100%;'></td></tr>

  <tr><td align='right'>Billing = Shipping?</td><td align='center'><a onclick='basa()'>Yes</a> | <a onclick='nobasa()'>No</a></td></tr>
  <tr><td align='right'>Shipping address</td><td><input type='text' id='sa' name='sa' value='' style='width:100%;'></td></tr>
  <tr><td align='right'>Shipping suburb</td><td><input type='text' id='ss' name='ss' value='' list='suburbs' style='width:100%;'></td></tr>
  <tr><td align='right'>Shipping city</td><td><input type='text' id='sc' name='sc' value='' list='cities' style='width:100%;'></td></tr>
  <tr><td align='right'>Details</td><td><textarea name='details' id='details' rows='5' cols='40' style='width:100%;'></textarea></td></tr></table></form>

billing to shipping function:

function basa()
{
var ba=document.getElementById("ba").value;
var bs=document.getElementById("bs").value;
var bc=document.getElementById("bc").value;
document.getElementById("sa").value=ba;
document.getElementById("ss").value=bs;
document.getElementById("sc").value=bc;
}
function nobasa()
{
document.getElementById("sa").value="";
document.getElementById("ss").value="";
document.getElementById("sc").value="";
}

and the ajax script:

function fastupdate()
{
var custID = document.getElementById("custID").value;
var custName = document.getElementById("custName").value;
var status = document.getElementById("status").value;
var ip = document.getElementById("ip").value;
var dateIn = document.getElementById("dateIn").value;
var lead = document.getElementById("lead").value;
var email = document.getElementById("email").value;
var cell = document.getElementById("cell").value;
var work = document.getElementById("work").value;
var home = document.getElementById("home").value;
var time = document.getElementById("time").value;
var ba = document.getElementById("ba").value;
var bs = document.getElementById("bs").value;
var bc = document.getElementById("bc").value;
var ba = document.getElementById("sa").value;
var bs = document.getElementById("ss").value;
var bc = document.getElementById("sc").value;
var details = document.getElementById("details").value;

xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
	alert(xmlhttp.responseText);
	/*
    document.getElementById("fastupdate").innerHTML=xmlhttp.responseText;
	*/
    }
  }
xmlhttp.open("GET","fastupdate.php?custID="+ custID +"&custName="+ custName +"&status=" + status +"&ip=" + ip +"&dateIn=" + dateIn + "&lead=" + lead + "&email=" + email + "&cell=" + cell + "&work=" + work + "&home=" + home + "&time=" + time + "&ba="+ ba +"&bs="+ bs +"&bc="+ bc +"&sa="+ sa +"&ss="+ ss +"&sc="+ sc + "&details=" + details,true);
xmlhttp.send();
}

the fastupdate.php works fine, along with the ajax script, the trouble is it is entering the copied text from billing to shipping into the database as
[object HTMLInputElement]


Can anybody solve this?

Member Avatar
Airshow
WiFi Lounge Lizard
2,798 posts since Apr 2009
Reputation Points: 333 [?]
Q&As Helped to Solve: 393 [?]
Skill Endorsements: 11 [?]
Team Colleague
 
0
 

Boots,

In this block of code from fastupdate(), it appears that you copied and pasted three lines of code and forgot to edit the left hand side of the statements.

...
var ba = document.getElementById("ba").value;
var bs = document.getElementById("bs").value;
var bc = document.getElementById("bc").value;
var ba = document.getElementById("sa").value;
var bs = document.getElementById("ss").value;
var bc = document.getElementById("sc").value;
...

As it stands, the behaviour will differ from browser to browser. Some will throw an error.

Airshow

You
This article has been dead for over three months: Start a new discussion instead
Post:
Start New Discussion
View similar articles that have also been tagged: