/    Sign up×
Community /Pin to ProfileBookmark

Is this a JS problem

Hi guys, my programming is a pasttime but still important to me. The following
code is a payment doc. allowing partial payments. Balances are put in “prevbal”
field. Complete payments get a “P” code. When the paidamt is keyed in, the
current date is autoinserted. If a recurring debt the amtdue stays the same.
If it is, the amtdue is calculated. I’m unsure if the failure is in the
javascript or not? The code using the JS follows:

==============================================================================

The javascript follows:

[CODE] function $_(IDS) { return document.getElementById(IDS); }
function calculate_paid()
{
var status = document.getElementById(“status”);
var pd = document.getElementById(“pd”);
var payec = document.getElementById(“payec”);
var paidamt = document.getElementById(“paidamt”);
var amtdue = document.getElementById(“amtdue”);
var prevbal = document.getElementById(“prevbal”);
var shipamt = document.getElementById(“shipamt”);
var datepaid = document.getElementById(“datepaid”);

var dateNow = new Date();
var dayNow = dateNow.getDate();
var datePaid = (dateNow.getMonth()+1)+”-“+dateNow.getDate()+”-“+dateNow.getFullYear();
datepaid.value = datePaid;
var owed.value == parseFloat(amtdue.value) + parseFloat(shipamt.value) + parseFloat(prevbal.value) – parseFloat(paidamt.value);
if(status==”N”){amtdue.value = owed.value;}
if(owed==”0.00″) { pd.value = “P”; shipamt=”0.00″, prevbal=”0.00″;}
}
[/CODE]

========================================================================

[code=php]<td><input type=’text’ readonly size=15 name=’acctno’ value='” . $row[‘acctno’] . “‘ ></td>
<td><input type=’text’ readonly size=25 name=’bname’ value='” . $row[‘bname’] . “‘></td>
<td><input type=’text’ readonly size=25 name=’purpose’ value='” . $row[‘purpose’] . “‘></td>
<td><input type=’text’ size=7 id=’paidamt’ name=’paidamt’ value='” . $row[‘paidamt’] .”‘
onblur=’calculate_paid(this)’></td>
<td><input type=’text’ size=7 id=’amtdue’ name=’amtdue’ value='” . $row[‘amtdue’] . “‘ ></td>
<td><input type=’text’ size=7 id=’prevbal’ name=’amtdue’ value='” . $row[‘prevbal’] . “‘ ></td>
<td><input type=’text’ size=10 id=’datepaid’ name=’datepaid’ value='” . $row[‘datepaid’] . “‘ ></td>
<td><input type=’text’ size=3 id=’pd’ name=’pd’ value='” . $row[‘pd’] . “‘ ></td><br />
<td><input type=’submit’ name=’update’ value=’Make Payment’ />
</tr>”;
}
echo “</table>
<input type=’submit’ name=’update’ value=’Update Record’ />
</form>”;
}
else{echo “invalid entry<br />Select another?<br />”;}
}
if(!empty($_POST[“update”]))
{
$sql = “UPDATE oocust SET
amtdue = ‘” . mysql_real_escape_string($_POST[‘amtdue’]) . “‘,
paidamt = ‘” . mysql_real_escape_string($_POST[‘paidamt’]) . “‘,
datepaid = ‘” . mysql_real_escape_string($_POST[‘datepaid’]) . “‘,
pd = ‘” . mysql_real_escape_string($_POST[‘pd’]) . “‘
WHERE acctno='”.$_POST[‘acctno’].”‘”;
mysql_query($sql) or die(mysql_error());
echo “Success!”;
}
?>
[/code]

[code=html]<form method=”post” action=”#”><br />
<input type=”text” name=”acctno”/> <p>
<input type=”submit” name=”submit” value=”Select”/>
</form></body></html>
[/code]

to post a comment
JavaScript

5 Comments(s)

Copy linkTweet thisAlerts:
@deathshadowJul 20.2014 — var owed.value

Where is owed defined? Is that a global? You can't assign a property to an undefined object.

also, it's damned confusing when you have variables of the same name where the only difference is case, try to avoid doing that.

... and if a value is readonly, why is it in a input in the first place?

if(status=="N"){amtdue.value = owed.value;}

uhm, you defined status as the node object, did you mean to do status.value there?

&lt;td&gt;&lt;input type='text' size=7 id='amtdue' name='amtdue' value='" . $row['amtdue'] . "' &gt;&lt;/td&gt;
&lt;td&gt;&lt;input type='text' size=7 id='prevbal' name='amtdue' value='" . $row


Two text inputs with the same name?

It might also be better on the php side if you flipped your quotes and stopped using string additions -- singles and comma delimits are faster, cleaner and more predictable.

Really it's all a bit confusing what you're trying to do here. Would probably help a lot to diagnose more of your issues if we could see where that function is even being called from.
Copy linkTweet thisAlerts:
@12StringsauthorJul 21.2014 — ]

Following is my current code. you'll see that I've used criticism. No change in result


function $_(IDS) { return document.getElementById(IDS); }

function calculate_paid()

{ var status = document.getElementById("status");

var pd = document.getElementById("pd");

var payec = document.getElementById("payec");


var paidamt = document.getElementById("paidamt");

var amtdue = document.getElementById("amtdue");

var prevbal = document.getElementById("prevbal");

var shipamt = document.getElementById("shipamt");

var datepaid = document.getElementById("datepaid");

var dateNow = new Date();

var dayNow = dateNow.getDate();

var paydate = (dateNow.getMonth()+1)+"-"+dateNow.getDate()+"-"+dateNow.getFullYear();

datepaid.value = paydate;

prevbal.value = parseFloat(prevbal.value) + parseFloat(amtdue.value) +

parseFloat(shipamt.value) - parseFloat(paidamt.value);


if(status=="N"){amtdue.value = owed.value;}

uhm, you defined status as the node object, did you mean to do status.value there?
[/QUOTE]


if(status.value=='N'){amtdue.value = prevbal.value;}

if(prevbal=='0.00') {pd.value = 'P';}

}
================================================



..." and if a value is readonly, why is it in a input in the first place?" [/QUOTE]---- for display

if we could see where that function is even being called from[/QUOTE].

<td><input type='text' readonly size=15 name='acctno' value='" . $row['acctno'] . "' ></td>

<td><input type='text' readonly size=25 name='bname' value='" . $row['bname'] . "'></td>

<td><input type='text' readonly size=25 name='purpose' value='" . $row['purpose'] . "'></td>

// *******************************************************************************

<td><input type='text' size=7 id='paidamt' name='paidamt' value='" . $row['paidamt'] ."'

onblur='calculate_paid(this)'></td>

// *
**
**************************************************************************

<td><input type='text' size=7 id='amtdue' name='amtdue' value='" . $row['amtdue'] . "' ></td>

<td><input type='text' size=7 id='prevbal' name='amtdue' value='" . $row['prevbal'] . "' ></td>

<td><input type='text' size=10 id='datepaid' name='datepaid' value='" . $row['datepaid'] . "' ></td>

<td><input type='text' size=3 id='pd' name='pd' value='" . $row['pd'] . "' ></td><br />

<td><input type='submit' name='update' value='Make Payment' />

</tr>";
Copy linkTweet thisAlerts:
@12StringsauthorJul 22.2014 — death shadow, I hate to make you so damned confused. You know I am trying to advance per your aid. Of the several

forums I've visited over time I've benefitted from this one most. Thanks
Copy linkTweet thisAlerts:
@deathshadowJul 22.2014 — Well, your update still leaves me with more questions -- in a lot of ways I think I need to see even more code, but one thing is sticking out right away here:

&lt;/tr&gt;";
}
echo "&lt;/table&gt;


Can I assume from that you are outputting (or planning on outputting) multiple TR of these inputs? If so, you do know that ID's need to be UNIQUE on the page -- meaning if you have it more than once your code will only ever be able to function on the first row. Looks like you're pulling multiple rows, in which case you should be adding a counter or some other unique per-row identifier to those ID... and the NAME attributes too since if you have more than one row, how are they going to return values at all?

that's also going to make getElementByID VERY difficult to use -- you may end up having to walk the DOM to pull your values instead... which gets very complex; I'd have to see a LOT more of your code to even try to pull that off...

That's the problem with snippets - it's like doing brain surgery through a keyhole without a endoscope.

Often when dealing with making JS work (or CSS for that matter) I'll take and make a flat static HTML file I know is well-formed, and then write the scripting and style to that -- then break up that markup into the PHP. You might want to do that just to remove PHP from the equation so you are certain where to lay the blame.

Also, this is 2014, not 2006, you REALLY shouldn't be using mysql_ anymore, hence the [url=http://php.net/manual/en/function.mysql-connect.php]giant red warning boxes[/url] in the manual.

... and I'd also find some way to make sure acctNo is stored server side in relation to the form instead of client-side; since it would be far too easy to BS someone else's account number from the client-side value. Really that's why it's NOT a good idea to let people edit account values from a listing and instead have one account per edit page. You can HAVE a listing, but to edit them, give them their own dialog.
Copy linkTweet thisAlerts:
@rpg2009Jul 22.2014 — As pointed out having the rendered HTML would be more helpful.

A re-write of your code with comments. Could be improved. Guesswork at this point.

[code=php]// take code out of the global document space and wrap in an 'immediately invoked function expression'.
// simple terms the function executes itself. All variables declared within are local to that function.
// e.g. (function(x, y, z){...stuff here executed immediately....})(10, 20, 30))
(function(doc) {
// Note: My var declarations are seperated by commas. The last dec will have a semi-colon;
// e.g. var x = 1,
// y = 2,
// z = 3;

var getById = function(id) { return doc.getElementById(id); },
payForm = getById ('myForm'), // can access form elements by id. e.g. payForm.shipamt.value

// Simple function to add values. Takes an array as an argument.
addVals = function(vals){
var i = 0,
len = vals.length
total = 0;

for (; i < len; i += 1) { total += parseFloat(Vals); }
return total;
},

/* Alternative method to maybe look in to.
Will take any number of arguments/parameters and add them.

addVals = function(){
// Convert arguments array like object into a proper array.
vals = Array.prototype.slice.call(arguments);
var total = 0;
// Higher Order array iterative method forEach.
vals.forEach( function(val) { total += parseFloat(val); } );
return total;
};

e.g. var mytotal = addVals(amtdue, shipamt, prevbal);
*/

processData = function(){

var dateNow = new Date(),
dayNow = dateNow.getDate(),
datePaid = dateNow.getMonth() + 1 ) + "-" + dateNow + "-" + dateNow.getFullYear(),
pF = payForm; // abbreviating for now.

pF.datepaid.value = daitPaid;
pF.owed.value = addVals([pF.amtdue.value, pF.shipamt.value, pF.prevbal.value]) - parseFloat(pF.paidamt.value);

if (pF.status.value === 'N') { pF.amtdue.value = pF.owed.value; };
if (pF.owed.value === "0.00" ) { pF.paydate.value = "P"; pF.shipamt.value = "0.00"; pf.prevbal.value = "0.00"; }
};

processData();

})(window.document)) // passing window.document into the function[/code]
×

Success!

Help @12Strings spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...