keeping a innerhtml value from a javascript after a html form submit

Question

I am using below javascript to collect values from some textboxes,do some calculations and display the result as a innerhtml content

window.onload = function () {
    var left = document.getElementById('mem_count');
    var right = document.getElementById('siz_single');
    var result = document.getElementById("disp_siz");
    function check(a, b, elem) {

        var txt = '';
        if (a === 0 && b === 0) {

        } 
        else if (a !== 0 && b === 0) {
         txt = "Enter size of single device in above column"

        }
        else if(a == 0 && b !== 0){

        txt = "Enter Meta member count in above column "
        }

        else  {
            var c = 1 +a        
            txt = "Your meta device size is " + (c*b) +" MB" + " = " + (c*b/1024) +" GB ";
        }
disp_siz.innerHTML = txt;

    }

    mem_count.onkeyup = calc;
    siz_single.onkeyup = calc;

    function calc() {
        var a = parseFloat(mem_count.value) || 0;

        var b = parseFloat(siz_single.value) || 0;
        check(a,b, this);
    }
}

and the output will be display in between the div

<div id="disp_siz"><-----above output will come here----></div>

This div is part of a html form. I am able to keep all my other form values in same field after form submission. But not able to display above output. It just clearing my values. Is there anyway I can echo this javascript variable value to the same field after form submision ?

If the page refreshes, it is like cleaning a whiteboard, you got to start over. If the fields are there, trigger the function to run. — epascarello
– epascarello, Commented Sep 30, 2013 at 20:36

epascarello · Accepted Answer · 2013-09-30 20:38:10Z

1

First Option:

Set it on the serverside.

Second Option:

If the page refreshes, it is like cleaning a whiteboard, you got to start over. If the fields are there, trigger the function to run.

Add calc(); to the end of the onload function.

    ...
    ...

    function calc() {
        var a = parseFloat(mem_count.value) || 0;

        var b = parseFloat(siz_single.value) || 0;
        check(a,b, this);
    }
    calc();  //<-- added this to trigger the calculation
}

Another problem:

And you should not reference an element by their id directly. You should use

document.getElementById("disp_siz").innerHTML = txt;

answered Sep 30, 2013 at 20:38

epascarello

208k20 gold badges206 silver badges246 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Bucket · Accepted Answer · 2013-09-30 20:30:35Z

0

You're referencing a variable (disp-siz) that doesn't exist. Use the variable you created earlier, result.

result.innerHTML = txt;

answered Sep 30, 2013 at 20:30

Bucket

7,5599 gold badges38 silver badges48 bronze badges

1 Comment

acr Over a year ago

: I have changed it to result.innerHTML = txt;. Still after form submit that value not showing up

Collectives™ on Stack Overflow

keeping a innerhtml value from a javascript after a html form submit

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related