Skip to main content
Known Participant
May 19, 2009
Question

How do I code the insert for this ?

  • May 19, 2009
  • 2 replies
  • 917 views

I use the following code to enter data into a field. Then there is a button where additional input fields popup and data is entered.

<cfinput type="text" name="dateCode">

<div id="additionalDateCode"></div>

<input type="button" value="Add Additional Date Code" onclick="addDateCode()">

This is the corresponding javascript code for the button.

<script type="text/javascript">
   function addDateCode() {
    var input = document.createElement("input");
    input.setAttribute("type","text");
    input.setAttribute("name","dateCode");
    input.setAttribute("required","yes");
    input.setAttribute("size","30");
    input.setAttribute("maxlength","200");
    document.getElementById("additionalDateCode").appendChild(input);
    document.getElementById("additionalDateCode").appendChild(document.createElement("br"));
    input.focus();
   }
</script>

The problem/question I am having is this :

How do I insert each entry/additional entries into a table ? I do not know how to do this.

Thanks

    This topic has been closed for replies.

    2 replies

    Inspiring
    May 20, 2009

    Since you seem to know JavaScrpit my recommendation would be:

    1. Each time they click the "Add Email" button I would use JavaScript InnerHTML to insert a "hidden insert" field (<input type='hidden' name='emailAddresses' value="" > etc.) concatenating the email addresses.
    2. When the user is done entering email addresses then they would click the form submit button. This would send ther form to the CF procesing page with the email addresses in the hidden field FORM.emailAddresses.
    3. The processing page would then loop through the list of email addresses something like this:
      • <cfloop index="strEmailAddress" list="#FORM.emailAddresses">
      • <cfquery name="insertEmail" datasource="dbname">
      • INSERT INTO tblEmails (vchEmailAddress) VALUES ('#strEmailAddress#')
      • </cfquery>
      • </cfloop>

    HTH

    Ken

    Participating Frequently
    May 19, 2009

    I would use the jQuery function html() to build the html dynamically

    instead of createElement. It's much more readable and maintainable.

    Unless I misunderstood you and you were talking about a database table...

    Mack

    Known Participant
    May 19, 2009

    I want to insert each entry (or entries if button is selected) into a table.

    May 19, 2009

    Well, whatever you do, because it is generated in JavaScript, you're going to have to send this data as a POST or GET to a server-side ColdFusion page.

    I would recommend you do this of course via AJAX.

    On your recieving cfm page you would then of course utilise the #form.fieldnames# variable and loop it using CFLOOP to then insert it into your database table. The reason for this, is that from what I can see, your form elements are dynamically created on the fly by your JavaScript. Becasue of this, ColdFusion wont always know how many rows there will be.

    Hope this helps? I can't do any code because I haven't done AJAX stuff myself, but Imagine this is how it would work.

    Mikey.