John Davidson

Message:

I am creating a menu list with php. I want the user to change name and the discount variable in the list. So here is an image of the list:list with items, so for each list item and subitems, there's a button which must open a popup and pass the variables belonging to that listitem, like names and discount variable into the form input field, so the user can adjust it from the old value. I use javascript to open and close the form, and want it also to put the php variables (obtained from a database) into that form. So here is my piece of code:

javascript:

<script>

function updatepopup(**$name**, $discount){

    document.getElementById("updatedata").style.display = "block";

    document.getElementById("fnaam").value = **$name**";

    document.getElementById("fkort").value = $discount;

}



function closeform(){

    document.getElementById("updatedata").style.display = "none";

}

</script>

php:

<ol class='tree'> "; 

    if ($currLevel == $prevLevel) echo "  ";

    echo '

    <li>

    <label for="subfolder2">'.$category['name'].'</label>

    <label>  '.$category['discount'].'%</label>

    <input type="checkbox" name="subfolder2">



    <form id="updatedata" method="POST">

        <label for="fnaam">Naam: </label>

        <input type="text" id="fnaam" name="fnaam" value="'.$category['name'].'">



        <label for="fkort">Korting</label>

        <input type="number" id="fkort" name="fkort" value="'.$category['discount'].'">

        

        <button id="closebutton" onclick="closeform()">X</button>

        <button type= "submit"> </button>

    </form>



    <button onclick="updatepopup()"><i class="fa-solid fa-pen-to-square"></i></button>

    ';

    if ($currLevel > $prevLevel) { $prevLevel = $currLevel; }

    $currLevel++; 

    createTreeView ($array, $categoryId, $currLevel, $prevLevel);

    $currLevel--;               

    }

}



if ($currLevel == $prevLevel) echo "<li><button>+</button></li></li>

</ol>";

}

?>

So I have read many solutions to pass a string to a javascript function but not a single one would help. I only get something like that done with numbers, but I also want to sent a string into that input field.
So this is what I want to get: what I want

---

My Answer:
function openForm(name, discount) {
document.getElementById("popupForm").style.display = "block";
document.getElementById("nameInput").value = name;
document.getElementById("discountInput").value = discount;
}

function closeForm() {
document.getElementById("popupForm").style.display = "none";
}