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

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

How to add/append code to a function?

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

Contents

  How to add/append code to a function? justaguy <lichunshen84@gmail.com> - 2016-04-11 12:42 -0700
    Re: How to add/append code to a function? Ben Bacarisse <ben.usenet@bsb.me.uk> - 2016-04-11 22:01 +0100
      Re: How to add/append code to a function? justaguy <lichunshen84@gmail.com> - 2016-04-12 16:37 -0700

#30261 — How to add/append code to a function?

Hi,

I have an HTML page that is heavy with DOM, that is, I have some table row with several cells, for instance, 
[InstrumentName] [Qty] [Person] [OtherInfo] (as one row)
and have a function, say, AddNewRow(), that allows the user to add additional row(s)
Thus, we have 
[InstrumentName] [Qty] [Person] [OtherInfo] 
[InstrumentName_n] [Qt_n] [Person_n] [OtherInfo_n] 
...

<span id="newrowFlag"></span>
prior to FORM submission.

Now, I'd like to allow the user to add additional field(s). Thus, it may appear like this:
[InstrumentName] [Qty] [Person] [OtherInfo]
+AddField (addField()):
upon click, 
Field Name: <input type="text" name="fieldName" size=15> 
Field Type: <select name="fieldType"> 
<option>Text
<option>Checkbox
</select>

And if the user did click on addField function, how do we add/append this addition to the defined AddNewRow function?

The AddNewRow function's last two lines look like the following:
	parentEl.insertBefore(newrow,p);
}

So, it looks like we need to do two things for the addField function.
(a) dynamically insert the two labels and two fields for a new field.
(b) insert/append new code right before the AddNewRow function's ending }

Is this the way to go?  If so, what's command do we need to use to find the neighboring 
parentEl.insertBefore(newrow,p);
and
}

?

Please note, parentEl.insertBefore(newrow,p); appears several times within this same function.

Thanks.

[toc] | [next] | [standalone]

#30262

justaguy <lichunshen84@gmail.com> writes:

> I have an HTML page that is heavy with DOM, that is, I have some table
> row with several cells, for instance,
> [InstrumentName] [Qty] [Person] [OtherInfo] (as one row)
> and have a function, say, AddNewRow(), that allows the user to add additional row(s)
> Thus, we have 
> [InstrumentName] [Qty] [Person] [OtherInfo] 
> [InstrumentName_n] [Qt_n] [Person_n] [OtherInfo_n] 
> ...
>
> <span id="newrowFlag"></span>
> prior to FORM submission.
>
> Now, I'd like to allow the user to add additional field(s). Thus, it
> may appear like this:
> [InstrumentName] [Qty] [Person] [OtherInfo]
> +AddField (addField()):
> upon click, 
> Field Name: <input type="text" name="fieldName" size=15> 
> Field Type: <select name="fieldType"> 
> <option>Text
> <option>Checkbox
> </select>
>
> And if the user did click on addField function, how do we add/append
> this addition to the defined AddNewRow function?
>
> The AddNewRow function's last two lines look like the following:
> 	parentEl.insertBefore(newrow,p);
> }
>
> So, it looks like we need to do two things for the addField function.
> (a) dynamically insert the two labels and two fields for a new field.
> (b) insert/append new code right before the AddNewRow function's ending }
>
> Is this the way to go?

No.  It's better to make things data-driven rather than edit code on the
fly (which you can't do in this case anyway).

The AddNewRow function should be an action on a form.  The AddNewField
function should modify that form.  AddNewRow uses the form to determine
how many things it needs in a row.

Of course you might also need to edit existing rows to reflect the
presence of the new field.

<snip>
-- 
Ben.

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

#30266

On Monday, April 11, 2016 at 5:01:19 PM UTC-4, Ben Bacarisse wrote:
> justaguy <lichunshen84@gmail.com> writes:
> 
> > I have an HTML page that is heavy with DOM, that is, I have some table
> > row with several cells, for instance,
> > [InstrumentName] [Qty] [Person] [OtherInfo] (as one row)
> > and have a function, say, AddNewRow(), that allows the user to add additional row(s)
> > Thus, we have 
> > [InstrumentName] [Qty] [Person] [OtherInfo] 
> > [InstrumentName_n] [Qt_n] [Person_n] [OtherInfo_n] 
> > ...
> >
> > <span id="newrowFlag"></span>
> > prior to FORM submission.
> >
> > Now, I'd like to allow the user to add additional field(s). Thus, it
> > may appear like this:
> > [InstrumentName] [Qty] [Person] [OtherInfo]
> > +AddField (addField()):
> > upon click, 
> > Field Name: <input type="text" name="fieldName" size=15> 
> > Field Type: <select name="fieldType"> 
> > <option>Text
> > <option>Checkbox
> > </select>
> >
> > And if the user did click on addField function, how do we add/append
> > this addition to the defined AddNewRow function?
> >
> > The AddNewRow function's last two lines look like the following:
> > 	parentEl.insertBefore(newrow,p);
> > }
> >
> > So, it looks like we need to do two things for the addField function.
> > (a) dynamically insert the two labels and two fields for a new field.
> > (b) insert/append new code right before the AddNewRow function's ending }
> >
> > Is this the way to go?
> 
> No.  It's better to make things data-driven rather than edit code on the
> fly (which you can't do in this case anyway).
> 
> The AddNewRow function should be an action on a form.  The AddNewField
> function should modify that form.  AddNewRow uses the form to determine
> how many things it needs in a row.
> 
> Of course you might also need to edit existing rows to reflect the
> presence of the new field.
> 
> <snip>
> -- 
> Ben.

Ok, thanks Ben.

[toc] | [prev] | [standalone]

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

csiph-web