Input text inside If

Question

Hello, I am making a form and would like some questions (in input format) appear only if a certain answer is selected in the previous select.

Você trabalha no Desktop ou no Notebook?:
<select name="pc1">
<option selected="selected"> </option>
<option>Desktop</option>
<option>Notebook</option>
</select><br>
No caso de usar Desktop, quantos monitores?:
<input type="text" name="numtela" size="5" /><br>

Instead of the question "In case of using Desktop", I would like the question to appear only if it is selected "Desktop", I imagine something like:

<?php
if ($pc1 = $Desktop) {
No caso de usar Desktop, quantos monitores?:
<input type="text" name="numtela" size="5" /><br>
}
?>

But I could not make it work (I started programming today in php, I know nothing)

Answer 1

In this case, to show or hide a content (called toggle), you can use Javascript instead of php.

first assign a value to each option and give an id to the select, the question and the input.

Test the code below.

//esconde a pergunta e o input
document.getElementById("perguntamonitores").style.display = 'none';
document.getElementById('monitores').style.display = 'none';

function mostrarpergunta() {
    //Se for selecionado o desktop, mostra o <p> e o <input> como bloco(mas pode ser como flex também)
    let select = document.getElementById("desk/note")
    let opcao = select.options[select.selectedIndex].value;
    if (opcao === "desk"){
        document.getElementById("perguntamonitores").style.display = 'block';
        document.getElementById('monitores').style.display = 'block';
    }
}

<p>Você trabalha no Desktop ou no Notebook?</p>
<select name="pc1" id="desk/note" onblur="mostrarpergunta();">
    <option selected="selected"></option>
    <option value="desk">Desktop</option>
    <option value="note">Notebook</option>
</select>
<br>
<p id="perguntamonitores">No caso de usar Desktop, quantos monitores?</p>
<input id="monitores" type="text" name="numtela" size="5" />
<br>

if you want to have a transition or a specific css style to show and hide, I suggest instead of using document.getElementById('id').style.display = 'block'; use the Element.classList

I hope I helped John