As part of a response I create a form. When the user clicks one
of two buttons I invoke a javascript function:
<input type="button" name="submit" value="Update" onclick="javascript:saveItem()"/>
here is the top of that function----------------

function saveItem () { // save updated Item - from itemsToEdit
alert ("saveItem - entering 208")
alert ("saveItem - " + document.getElementById("EditItemsForm");

The problem is that returns null, as if the form did not exist,
but inspection of the source shows it present.

I presume the problem is that the form has not been created when
the .js is evaluated even though it is there by the time it is
executed.

I have many similar functions that work fine but this is the only
one that references a form created on the fly.

The apparent solution is to move the form definition to a static
part of the script but I don't know how to reference it so that
it appears when the onclick event happens.

--bill

--- SoupGate-Win32 v1.05
* Origin: fsxNet Usenet Gateway (21:1/5)

On Fri, 17 Sep 2021 14:42:15 -0400, bill wrote:

As part of a response I create a form. When the user clicks one
of two buttons I invoke a javascript function:
<input type="button" name="submit" value="Update" onclick="javascript:saveItem()"/>
here is the top of that function----------------

function saveItem () { // save updated Item - from itemsToEdit
alert ("saveItem - entering 208")
alert ("saveItem - " + document.getElementById("EditItemsForm");

The problem is that returns null, as if the form did not exist,
but inspection of the source shows it present.

I presume the problem is that the form has not been created when
the .js is evaluated even though it is there by the time it is
executed.

I have many similar functions that work fine but this is the only
one that references a form created on the fly.

The apparent solution is to move the form definition to a static
part of the script but I don't know how to reference it so that
it appears when the onclick event happens.

--bill

Either the needed element has the wrong ID, or is served within an IFRAME.

--- SoupGate-Win32 v1.05
* Origin: fsxNet Usenet Gateway (21:1/5)

On Sat, 18 Sep 2021 22:40:48 +0700, JJ wrote:

Either the needed element has the wrong ID, or is served within an IFRAME.

Or is within a Shadow DOM.

--- SoupGate-Win32 v1.05
* Origin: fsxNet Usenet Gateway (21:1/5)

On 9/18/2021 11:41 AM, JJ wrote:

On Sat, 18 Sep 2021 22:40:48 +0700, JJ wrote:

Either the needed element has the wrong ID, or is served within an IFRAME.

Or is within a Shadow DOM.

On 9/18/2021 11:41 AM, JJ wrote:

On Sat, 18 Sep 2021 22:40:48 +0700, JJ wrote:

Either the needed element has the wrong ID, or is served

within an IFRAME.

Or is within a Shadow DOM.

to explain in somewhat more detail:
I have 2 nested divs
The user enters data into a text box in the outer div. This
triggers a NEW XMLHtttpRequest which invokes a .php script.
The output of the script lists the search data in the 2nd div
with a button to edit the selected data item.

The button click calls a js function that calls another new
XMLHtttpRequest which is serviced by another php script that puts
the item's data back into a form in the 2nd div

The form contains data elements and a button to call a js script
to save the edited data.

That script fails because it can not find the form.

rather than copy the entire function I list only enough to show
the failure.
------------------------------
function saveItem () {
alert ("saveItem - entering 208")
alert ("saveItem - " +
document.getElementById("EditItemsForm"));

The both alerts are executed with the 2nd showing
"saveItem - " + null

If I change the EditItemsForm to another element that is not
dynamically generated it does not fail; it returns the id.

Thank you very much for taking the time to read this.
-bill

--- SoupGate-Win32 v1.05
* Origin: fsxNet Usenet Gateway (21:1/5)

I now define the form in the main part of the script, without any
input elements and then use the form attribute in the generated
part.

--
Bill Drescher
william {at} TechServSys {dot} com

--- SoupGate-Win32 v1.05
* Origin: fsxNet Usenet Gateway (21:1/5)

On Sat, 18 Sep 2021 14:22:35 -0400, bill wrote:

If I change the EditItemsForm to another element that is not
dynamically generated it does not fail; it returns the id.

Then the `getElementById` is called before the dynamically generated `EditItemsForm` element is created and placed into the document. i.e. `EditItemsForm` is called too soon.

The code which requires the element should be executed after the element has been dynamically generated and placed into the document.

--- SoupGate-Win32 v1.05
* Origin: fsxNet Usenet Gateway (21:1/5)