Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #31680 > unrolled thread

How to send dynamically generated document elements to a server side script for data saving?

Back to article view | Back to comp.lang.javascript

Contents

  How to send dynamically generated document elements to a server side script for data saving? justaguy <lichunshen84@gmail.com> - 2016-11-10 17:45 -0800
    Re: How to send dynamically generated document elements to a server side script for data saving? JJ <jj4public@vfemail.net> - 2016-11-11 21:43 +0700
      Re: How to send dynamically generated document elements to a server side script for data saving? Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2016-11-11 16:29 +0100
        Re: How to send dynamically generated document elements to a server side script for data saving? justaguy <lichunshen84@gmail.com> - 2016-11-11 11:39 -0800
        Re: How to send dynamically generated document elements to a server side script for data saving? justaguy <lichunshen84@gmail.com> - 2016-11-11 11:39 -0800
          Re: How to send dynamically generated document elements to a server side script for data saving? justaguy <lichunshen84@gmail.com> - 2016-11-11 12:12 -0800
            Re: How to send dynamically generated document elements to a server side script for data saving? justaguy <lichunshen84@gmail.com> - 2016-11-11 12:28 -0800
      Re: How to send dynamically generated document elements to a server side script for data saving? justaguy <lichunshen84@gmail.com> - 2016-11-11 11:38 -0800

#31680 — How to send dynamically generated document elements to a server side script for data saving?

What I intend to do:
The page allows the user to add dynamic elements (and some of such elements would automatically have an image file associated with it).
that is, it allows a user to
document.createElement('span') etc.

I then, have a function to map all the document elements to a FORM element, specifically a Textarea tag with an id and name.

Problem:
I'm getting objects, instead of objects properties.
See below
[object HTMLHtmlElement][object HTMLHeadElement][object HTMLScriptElement]
...
So, what do I need to do to make it happen?

Thanks.


JavaScript looks like below:
// prepare page/document data for FORM submission
var prep = function() {
	// document.getElementById('myData').innerHTML = document.all;
	// turn them into array
	arr = [].slice.call(document.all);
	console.log("array length: " + arr.length);

	// copy each into FORM textarea field
	for (e = 0; e < arr.length; e++) {
		document.getElementById('myData').innerHTML += arr[e];
	}
	
};


Part of the HTML page looks like the following:
<textarea id="myData" name="myData" style="display:none"></textarea>

	<br/>
	<button onclick="prep(); console.log('verify: ' + document.getElementById('myData').innerHTML);return false;">Verify Data prior to submission</button>

[toc] | [next] | [standalone]

#31695

On Thu, 10 Nov 2016 17:45:24 -0800 (PST), justaguy wrote:
> What I intend to do:
> The page allows the user to add dynamic elements (and some of such elements would automatically have an image file associated with it).
> that is, it allows a user to
> document.createElement('span') etc.
> 
> I then, have a function to map all the document elements to a FORM element, specifically a Textarea tag with an id and name.
> 
> Problem:
> I'm getting objects, instead of objects properties.
> See below
> [object HTMLHtmlElement][object HTMLHeadElement][object HTMLScriptElement]
> ....
> So, what do I need to do to make it happen?
> 
> Thanks.

That's because an element object won't become a HTML code string when the
object is converted to string. You need to use its outerHTML property if you
want its HTML code.

[toc] | [prev] | [next] | [standalone]

#31699

JJ wrote:

> On Thu, 10 Nov 2016 17:45:24 -0800 (PST), justaguy wrote:
>> What I intend to do:
>> The page allows the user to add dynamic elements (and some of such
>> elements would automatically have an image file associated with it). that
>> is, it allows a user to document.createElement('span') etc.
>> 
>> I then, have a function to map all the document elements to a FORM
>> element, specifically a Textarea tag with an id and name.
>> 
>> Problem:
>> I'm getting objects, instead of objects properties.
>> See below
>> [object HTMLHtmlElement][object HTMLHeadElement][object
>> [HTMLScriptElement]
>> ....
>> So, what do I need to do to make it happen?
>> 
>> Thanks.
> 
> That's because an element object won't become a HTML code string when the
> object is converted to string. You need to use its outerHTML property if
> you want its HTML code.

However, this wish is probably based on a flawed approach as the attributes 
of the element, and its descendants and their attributes, are available as 
and via properties in the document tree.  By contrast, serialization of 
element objects using the “outerHTML” property will rarely yield appropriate 
results, as it will yield results that you have no control over (unless you 
parse them again, but then why did you serialize in the first place?).

-- 
PointedEars
FAQ: <http://PointedEars.de/faq> | SVN: <http://PointedEars.de/wsvn/>
Twitter: @PointedEars2 | ES Matrix: <http://PointedEars.de/es-matrix>
Please do not cc me. / Bitte keine Kopien per E-Mail.

[toc] | [prev] | [next] | [standalone]

#31702

So, what's the solution if any? Tks.

[toc] | [prev] | [next] | [standalone]

#31703

So, what's the solution if any? Tks.

[toc] | [prev] | [next] | [standalone]

#31704

Data url!

[toc] | [prev] | [next] | [standalone]

#31705

Meant data url ?

[toc] | [prev] | [next] | [standalone]

#31701

Thanks.

[toc] | [prev] | [standalone]

Back to top | Article view | comp.lang.javascript

csiph-web