Disable a Checkbox after selected

[xomoraf]

HI, please will you help me?

I need disable a checkbox wirh javascript after it had been selected, I did the next code:

I selected a rows from Postgres DB for create the checkbox. I use a Perl languaje in Linux Centos 7, the code is next:

while(my $ref_alarm = $sth->fetchrow_hashref()) {
        ($gabinete)=$ref_alarm->{'gabinete'};
        ($alarma)=$ref_alarm->{'descrip_alarma'};
        print "<input type='checkbox' name='alarma' id='alarma' value='$alarma' onclick=**'alarma_reg(this.value);'**/>$alarma</input>";
        print "<br>";
}

I had been use javascript for disable the checkbox that had been selected:

function **alarma_reg**(p_alarma) {
                //Get the checkbox
                document.getElementById("p_alarma").disabled = true;
                alarma_operada+=p_alarma + ',';
                document.getElementById("ver_alarmas").value=alarma_operada;
        }

But the option selected is not disable, please could you help me?

Regards
Xo

[Gandalf]

Hi @xomoraf welcome to the forums.

[off-topic]
When you post code in the forum, you need to format it. To do so you can either select all the code and click the </> button, or type 3 backticks ``` on a separate line both before and after the code block.

I have done it for you this time.
[/off-topic]

[xomoraf]

Will You help me?

Regards

[m_hutley]

//Get the checkbox
                document.getElementById("p_alarma")

print "<input type='checkbox' name='alarma' id='alarma'

one of these things is not like the other~

[xomoraf]

Regards, Mr. m_hutley.

Thanks a lot for had answered my question, I updated the script but I didn’t have the result:

print “<input type=‘checkbox’ name=‘alarma’ id=‘alarma’ value=‘$alarma’ onclick=‘alarma_reg(this.value);’/>$alarma”;

function alarma_reg(alarma) {
//Get the checkbox
var alarma_sel=alarma;
alarma_operada+=alarma_sel + ‘,’;
.
document.getElementById(‘alarma_sel’).disabled = true;
}

The checkbox continue enable for check or unchek, but after the checkbox selected it will be disable:

Please, Will you help me?

Thaks a lot.
~
~

[m_hutley]

@xomoraf

document.getElementById(‘alarma_sel’)

You have put ‘alarma_sel’ in quotes. That means its looking for an element with id “alarma_sel”.

@xomoraf

print “<input type=‘checkbox’ name=‘ alarma ’ id=‘ alarma ’ value=’$alarma’

your input has id “alarma”.

“alarma” != “alarma_sel”, so your getElementById will not find this element.

tell it to getElementById(“alarma”) and it will work.

[xomoraf]

HI, I had ben chaged to alarma

But the script disabled only the first element if I selected it or other. I don’t understand, the javascript code is:

function alarma_reg(alarma) {
//Get the checkbox
alarma_operada+=alarma + ‘,’;
document.getElementById(“ver_alarmas”).value=alarma_operada;

            document.getElementById('alarma').disabled = true;
    }

And the HTML created was:

input type=“checkbox” name=“alarma” id=“alarma” value=“400kV Measurement STATUS” onclick=“alarma_reg(this.value);” disabled=“”>400kV Measurement STATUS

input type=“checkbox” name=“alarma” id=“alarma” value=“AC Supply MCBs STATUS” onclick=“alarma_reg(this.value);”>AC Supply MCBs STATUS

input type=“checkbox” name=“alarma” id=“alarma” value=“AC Voltage STATUS” onclick=“alarma_reg(this.value);”>AC Voltage STATUS

input type=“checkbox” name=“alarma” id=“alarma” value=“Auto Reclose Function STATUS” onclick=“alarma_reg(this.value);”>Auto Reclose Function STATUS

I didn’t understand why put disable only the first row when I hadn’t been selected.

[James_Hibbard]

Hi,

When you post code, can you please format it. You can do this by highlighting the code block, then hitting the </> symbol in the editor.

As to what you posted, this is likely being caused by the fact that you have several elements with the same ID. Each ID should be unique to a page.

[xomoraf]

Thanks a lot James, sorry I don’t understand how ’ highlighting the code block, then hitting the </> symbol in the editor’ :

I had been modify the code:

Now,

each ID is diferent

only the attribute name is the same: alarma

input type=‘checkbox’ name=‘alarma’ id=$alarma value=‘$alarma’ onclick=‘alarma_reg(this.value);’/>$alarma</input

function alarma_reg(alarma) {
alarma_operada+=alarma + ‘,’;
document.getElementById(“ver_alarmas”).value=alarma_operada;
document.getElementById(“alarma”).disabled = true;
}
TEST:
document.getElementById(“400kV Measurement STATUS”).disabled = true
I had been execute it but is the checkbox is not disabled

Please, will you help me.

Regards
Xo

[xomoraf]

Thanks a lot James the program is ok.

[James_Hibbard]

@xomoraf

I don’t understand how ’ highlighting the code block, then hitting the </> symbol in the editor’

No problem.

Here’s what I mean in simpler terms.

Don’t post unformatted code. It is hard to read.

This is unformatted:

input type=“checkbox” name=“alarma” id=“alarma” value=“AC Voltage STATUS” onclick=“alarma_reg(this.value);”>AC Voltage STATUS

You should format your code.

To do this, highlight the code block with your mouse,

Then , in the toolbar press the `</> button.

---

Then you get a better result.

input type="checkbox" name="alarma" id="alarma" value="AC Voltage STATUS" 
onclick="alarma_reg(this.value);">AC Voltage STATUS

Hope that helps