/    Sign up×
Community /Pin to ProfileBookmark

Get cells by className to equal innerHTML of cell id ‘subtotal’

I’m trying to grab all the cells created with insertrow function and the className ‘rowtotal’ and get their innerHTML to equal that of a cell with id ‘subtotal’. This is a simplified html code of single cell inserted rows:

[U][B]index.html[/B][/U]

[code=html]
<tfoot> <tr id=”footsubtotal”> <td id=”subtotal”>$ 75.00</td>
//all cells of class “rowsubtotal” must have same innerHTML as this.
</tr>
</tfoot>
<tbody>
<tr class=”itemrow”>
<td class=”rowsubtotal”>$ 15.00</td>
</tr>
<!–3rd inserted row at row index 0 innerHTML should be ‘$ 75.00’–>
<tr class=”itemrow”>
<td class=”rowsubtotal”>$ 20.00</td>
</tr>
<!–2nd inserted row at row index 0 innerHTML should be ‘$ 75.00’–>
<tr class=”itemrow”>
<td class=”rowsubtotal”>$ 40.00</td>
</tr>
<!–1st inserted row at row index 0 innerHTML should be ‘$ 75.00’–>
<tr class=”dummy”>
<td class=”message”>Thank You</td>
</tr>
</tbody>

[/code]

These functions are not working and I’m not sure I can get javascript functions that will.

[U][B]product.js[/B][/U]

[CODE]
function checksubtotal(){
var subtotal=document.getElementById(‘subtotal’).innerHTML;
var rowsubtotals=document.getElementsByClassName(‘rowsubtotal’);
for(var i=0; i< rowsubtotals.length; i++){
var rowsubtotal=rowsubtotals[i];
if(rowsubtotal.innerHTML!==subtotal){ //comparison ‘!==’ ???
rowsubtotal.innerHTML=subtotal; }
else{ rowsubtotal.innerHTML=subtotal; }}//throws syntax error?

function deleterow(a) { // remove row
var row=a.parentNode.parentNode;
row.parentNode.removeChild(row);
var sTotal=sumsubtotal();
//don’t know what this is but seems to work??
EvalSound4(); checksubtotal();
//doesn’t work??

[/code]

Not sure if this is the wrong approach, might have to use a
!match syntax. Any help greatly appreciated?

to post a comment
JavaScript

7 Comments(s)

Copy linkTweet thisAlerts:
@pactor21Oct 21.2011 — Would you mind rephrasing what you want to accomplish through the script?
Copy linkTweet thisAlerts:
@THEFOOLauthorOct 21.2011 — [CODE]
function checksubtotal(){
var subtotal=document.getElementById('subtotal').innerHTML;
//the cell who's innerHTML must be duplicated in cells of className 'rowsubtotal'
var rowsubtotals=document.getElementsByClassName('rowsubtotal');
//all the cells with className 'rowsubtotal'
for(var i=0; i< rowsubtotals.length; i++){
var rowsubtotal=rowsubtotals[i];
if(rowsubtotal.innerHTML!==subtotal){ //comparison '!==' ???
rowsubtotal.innerHTML=subtotal; }
else{ rowsubtotal.innerHTML=subtotal; }}//throws syntax error?

function deleterow(a) { // remove row
var row=a.parentNode.parentNode;
row.parentNode.removeChild(row);
var sTotal=sumsubtotal();
//don't know what this is but seems to work??

EvalSound4();
checksubtotal();//doesn't work??
}
[/CODE]


Hope that helps, sorry I'm finding it very difficult to express what I feel I have already explained. " [B]I want all cells of className 'rowsubtotal' to have the same innerHTML as cell id 'subtotal'[/B] "?
Copy linkTweet thisAlerts:
@pactor21Oct 21.2011 — [CODE]
function checksubtotal(){
var subtotal=document.getElementById('subtotal').innerHTML;
//the cell who's innerHTML must be duplicated in cells of className 'rowsubtotal'
var rowsubtotals=document.getElementsByClassName('rowsubtotal');
for(var i=0; i< rowsubtotals.length; i++){
var rowsubtotal=rowsubtotals[i];
if(rowsubtotal.innerHTML!==subtotal){ //comparison '!==' ???
rowsubtotal.innerHTML=subtotal;
}
else{
rowsubtotal.innerHTML=subtotal;
}
}
[/CODE]

First of all, you NEED to use proper indentation in your code. I did it for you to see why there is a syntax error. (All I did is the indentation to your code.)

You didn't close your function braces, and that is what causes the syntax error at the end of the function.

And for the content of the for loop,
[CODE]var rowsubtotal=rowsubtotals[i];
if(rowsubtotal.innerHTML!==subtotal){ //comparison '!==' ???
rowsubtotal.innerHTML=subtotal;
}
else{
rowsubtotal.innerHTML=subtotal;
}[/CODE]


What is the point of if else clause when they do the same thing all over? I guess I can just display what's in the subtotal cell where you need it using jQuery, but not with native javascript. I'm working on it.
Copy linkTweet thisAlerts:
@pactor21Oct 21.2011 — Check out the jsfiddle below although i'm guessing that's not exactly what you want.

jsFiddle
Copy linkTweet thisAlerts:
@THEFOOLauthorOct 21.2011 — Wow [COLOR=blue][B]pactor21 [/B][/COLOR][COLOR=black]that is close. Is that Jquerry. I'm trying to avoid using library. The other thing is I need to run the function in the deleterow function so I don't have to guess that a 'rowsubtotal' exists. I'll check it out. I'm guessing that you're using '?' javascript prototype query? There is hope then that I can do this with javascript alone??



[/COLOR]
Today 01:12 PM pactor21 Check out the jsfiddle below although i'm guessing that's not exactly what you want.

[COLOR=#660000]jsFiddle[/COLOR] Today 12:54 PMpactor21

Also thanks for the closing brackets stuff. I try to write my functions so that I can post and read them without forcing scroll.
Copy linkTweet thisAlerts:
@THEFOOLauthorOct 22.2011 — [INDENT]Ok. after opening a brace before the if statement and taking out the else statement thanks to [B][COLOR=#0000ff]pactor21[/COLOR][/B] at webdeveloper.com, I got the first inserted row and last inserted row containing cells of className 'rowsubtotal' innerHTML to match the innerHTM of cell id 'subtotal' in the table but any rows in between row index 0 and row index -1 or last are unchanged.

[B][U]The script[/U][/B]
<i>
</i>function checksubtotal(){
var subtotal=document.getElementById('subtotal').innerHTML;
var rowsubtotals=document.getElementsByClassName('rowsubtotal');
for(var i=0; i&lt; rowsubtotals.length; i++){ //loop only gets first and last
var rowsubtotal=rowsubtotals[i];
}
if(rowsubtotal.innerHTML!==subtotal){ // may need comparison '!match subtotal' ?
rowsubtotal.innerHTML=subtotal;
}
}
function deleterow(a) {
// remove row
var rowsubtotals=document.getElementsByClassName('rowsubtotal');
var row=a.parentNode.parentNode;
row.parentNode.removeChild(row);
var sTotal=sumsubtotal();
checksubtotal();//only changes first and last rows cells className 'rowsubtotal' ?
EvalSound4();
}

[B][U]HTML RESULT[/U][/B]
[code=html]
<tfoot>
<tr id="footsubtotal">
<td id="subtotal">$ 75.00</td>
//all cells of class "rowsubtotal" must have same innerHTML as this.
</tr>
</tfoot>
<tbody>
<tr class="itemrow"><td class="rowsubtotal">$ 75.00</td></tr>
<!--3rd inserted row at row index 0 innerHTML equals '$ 75.00' or innerHTML of 'subtotal'-->
<tr class="itemrow"><td class="rowsubtotal">$ 20.00</td></tr>
<!--2nd inserted row at row index 0 innerHTML should be '$ 75.00' but doesn't ?-->
<tr class="itemrow"><td class="rowsubtotal">$ 75.00</td></tr>
<!--1st inserted row at row index 0 innerHTML equals '$ 75.00' or innerHTML of 'subtotal'-->
<tr class="dumy"><td class="message">Thank You</td></tr>
</tbody>
[/code]

I'm realy thinking a comparison by match of the innerHTML of 'subtotal' might get the for loop getting all the cells of className 'rowsubtotal' to equal cell id 'subtotal' innerTML. Will check it out.?

[COLOR=blue][B]pactor21 [/B][/COLOR][COLOR=black]any ideas on matching the innerHTML?[/COLOR]

[/INDENT]
Copy linkTweet thisAlerts:
@THEFOOLauthorOct 22.2011 — Wow [B][COLOR="Green"]Taywin[/COLOR][/B] that got it. God, Allah and Budah bless you! So simple and it was the the third and final '}' closing brace that got all cells of className 'rowsubtotal' to equal the innerHTML of cell id 'subtotal'. This is the script that works.

[B][U]SCRIPT THAT WORKS[/U][/B]
[CODE]
function checksubtotal(){
var subtotal=document.getElementById('subtotal').innerHTML;
var rowsubtotals=document.getElementsByClassName('rowsubtotal');
for(var i=0; i< rowsubtotals.length; i++){
if(rowsubtotals[i].innerHTML!==subtotal){
rowsubtotals[i].innerHTML=subtotal;
}}}
function deleterow(a) {
// remove row
var rowsubtotals=document.getElementsByClassName('rowsubtotal');
var row=a.parentNode.parentNode;
row.parentNode.removeChild(row);
var sTotal=sumsubtotal();
checksubtotal(); //Finaly works!!!
EvalSound4();
}
[/code]

[B][U]HTML RESULT[/U][/B]?
[code=html]
<tfoot>
<tr>
<td id="subtotal">$ 75.00</td>
</tr>
<tr>
<td id="message">Muchos Mas Gracias!</td>
</td>
</tr>
</tfoot>
<tbody>
<tr class="itemrow">
<td class="rowsubtotal">$ 75.00</td>
</tr>
<tr class="itemrow">
<td class="rowsubtotal">$ 75.00</td>
</tr>
<tr class="itemrow">
<td class="rowsubtotal">$ 75.00</td>
</tr>
<tr class="itemrow">
<td class="rowsubtotal">$ 75.00</td>
</tr>
<tr class="itemrow">
<td class="rowsubtotal">$ 75.00</td>
</tr>
<tr id="dummy">
<td id="client Message">Thank You very Much <b>Taywin</b></td>
</tr>
</tbody>
[/code]

Thanks again [B][COLOR="Green"]Taywin[/COLOR][/B] from [B][COLOR="Red"]DaniWeb.com[/COLOR][/B]???
×

Success!

Help @THEFOOL 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,
)...