Johnny Prescott
Johnny Prescott

Reputation: 271

Javascript function cannot be executed twice

I'm kind of new to Javascript and I've bee wondering for hours how to solve my problem. I have a litle function associated to a button. It work once but I cannot get it to execute after the first time.

function CheckEmpty1(){return "false";}

function Generate(){    
    if(CheckEmpty1() == "true"){
        alert("Please fill all mandatory field.\n\nAll missing field are  black colored.\n\nPlease also make sure to make a choice for all radio button.");
    }
    else{
        document.getElementById('TemplateOutput').style.display = "block";
        lol = "lol";
        document.getElementById('TemplateOutput').value = lol;
        lol = "test2";
    }
    return;
}

"TemplateOutput" is a simple textarea centered in the browser. The code is originally more complicated than that but while doing the test to ensure the problem was not coming from somewhere else, it reduced to that but still doesn't work.

The second "lol = "test2";" is just to check that if I make a change to the variable, it is suposed to apply the second time I hit the button.

it seems to be basic for me but I can't figure out why... any help?

thanks.

EDIT:

I think I found the source of my error in my original script. My original code look like this:

function Output(){
    Output = "CSD Troubleshooting: " + Troubleshoot + "\n";
    return Output;
}

function Generate(){
    FillVars();

    GenerateOutput = Output();
    alert(GenerateOutput);

}
function FillVars(){
    Troubleshoot = document.getElementById('Troubleshoot').value;
}

I reduced it to the minimum but it still behave the same way.

The problem is coming from the Output() function because it work fine if I do it like this:

GenerateOutput = document.getElementById('Troubleshoot').value;
alert(GenerateOutput);

or

GenerateOutput = Troubleshoot;
alert(GenerateOutput);

BEHAVIOR: I click the button. The alert is filling like it is suposed to be. The second time I click the button, it just do nothing.

regards,

Upvotes: 0

Views: 1440

Answers (1)

T.J. Crowder
T.J. Crowder

Reputation: 1075457

Updated Answer:

Your edit changes things markedly. The central issue is here:

function Output(){
    Output = "CSD Troubleshooting: " + Troubleshoot + "\n";
    return Output;
}

The first time you run that function, you replace the function with a string. The Output symbol is a reference to the function.

It looks like you might have a Visual Basic background. In JavaScript, you simply do this:

function Output(){
    return "CSD Troubleshooting: " + Troubleshoot + "\n";
}

or if you want it in a variable first, declare the variable (with var) and probably to avoid confusion use a different name:

function Output(){
    var result = "CSD Troubleshooting: " + Troubleshoot + "\n";
    return result;
}

Original Answer:

The second "lol = "test2";" is just to check that if I make a change to the variable, it is suposed to apply the second time I hit the button.

It won't, because your previous

lol = "lol";

...line runs, setting it back to "lol". You'll never see the code put "test2" into the input.

The line

document.getElementById('TemplateOutput').value = lol;

copies the value from lol to the value property. It does not make the value property a reference to the variable lol. Changing the variable later has no effect, because there is no continuing link between it and the value property.

Since the if block in your code will never run, let's just look at the else block. Here, in detail, is what happens:

// 1
document.getElementById('TemplateOutput').style.display = "block";

That looks in the DOM for the element with the id "TemplateOutput", and sets its style object's display property to "block".

// 2
lol = "lol";

That assigns the value "lol" to the lol variable. Unless you've declared lol somewhere you haven't shown, it also creates an implicit global variable. Details: The Horror of Implicit Globals.

// 3
document.getElementById('TemplateOutput').value = lol;

That copies the value "lol" from the lol variable into the value property of the input.

// 4
lol = "test2";

That copies the value "test2" into the lol variable.

Upvotes: 1

Related Questions