Form in new Listoption column: first row remove <form> tag

PHPMaker General Discussion (PHPMaker)
1

Hi to all,
I’ve added a new column in ListOptions_Load and in ListOptions_Rendered I’ve set the content this way:

$this->ListOptions["MyNewTestColumn"]->Body = '<form action="/test.page"><input type="submit" value="Submit"></form>';

It works fine but NOT IN THE FIRST ROW of the list!!

If I inspect the code I notice that in the first row the <form> tag is not rendered, this is the code rendered in the first row:

<input type="submit" value="Submit">

The <form> tags are missing!

All the others rows are ok, the <form> tags are present and the form works.
Any ideas?
Thanks!

2

You cannot put a form inside a form (the page itself has a form), browsers will remove it.

3

Thanks, so I solved writing a small js function.

Example:
I want to post id (INT value) and bookName (INT value) to a custom PHP file with “Includes common files” enabled.
The function create a form, append it to the document and send it immediately.

First I create the new “MyNewColumn” in ListOptions_Load and then in ListOptions_Rendered I call the function this way:

$parametri = json_encode(array(
"id" => "MyUniqueFormId", // You can use uniqid() if you want
"method" => "post",
"action" => "custom_file_path",
"id" => $this->id->DbValue,
"bookName" => $this->bookName->DbValue
));

$this->ListOptions["MyNewColumn"]->Body = "<a href='#' class='btn btn-sm ew-tooltip btn-primary' title='ToolTip Text' onclick='faiLaForm(`$parametri`);'>POST BUTTON TEXT</a>";

The Js function:

    function faiLaForm(pp) {

        var parametri = JSON.parse(pp);
        parametri[ew.TOKEN_NAME_KEY] = ew.TOKEN_NAME;
        parametri[ew.ANTIFORGERY_TOKEN_KEY] = ew.ANTIFORGERY_TOKEN;

        var form = document.createElement("form");
        form.id = parametri.id;
        form.method = parametri.method;
        form.action = parametri.action;

        for (const [key, value] of Object.entries(parametri)) {
            if (["id", "action", "method"].includes(key)) {
                continue;
            };
            
            var elmtArray = document.createElement("input");
            elmtArray.type = "hidden";
            elmtArray.name = key;
            elmtArray.value = value;
            form.appendChild(elmtArray);

        }

        document.body.appendChild(form);
        document.getElementById(parametri.id).submit();

    }