Welcome Guest, Not a member yet? Register   Sign In
Jquery multi-line form
#1

[eluser]bohara[/eluser]
Hello,
I am trying to move a rails app over to ci. I need to create a form that allows users to add line items to the form and then submit it the the database.

The form will initially display one line item, and then I would have a link below that says "Add another" This would insert another row of the form items below the first, and could be repeated for as many as needed by the user.

In rails this is done using partials, so I split that portion of the form into its own view. I just don't know how do add it dynamically using jquery. I can only see How to include HTML, and what I need to insert looks like this:
Code:
<fieldset>
    &lt;?$this->load->view("reminders/line_item");?&gt;
    <div id="row">**Insert next line here</div>
</fieldset>
        
<p><a href="#">Add another</a></p>


My other question is how to set the line items to be inserted via the controller. Does each line need a unique ID, or can I just loop over the results on insert.

Hope this makes sense.
Thanks in advance for any help on this.
#2

[eluser]bohara[/eluser]
I am working on this and will post details when I have it figured out.
#3

[eluser]bohara[/eluser]
I've got it figured out. Although i'm sure their is a better solution via ajax, which is next on my list. But this works for now.

Here is the front end view code. The script tags were removed however.
Code:
&lt;html&gt;
&lt;head&gt;
&lt;title&gt;Site.com - &lt;?php echo $title;?&gt;&lt;/title&gt;
    &lt;link href="&lt;?= base_url();?&gt;stylesheets/screen.css" rel="stylesheet" type="text/css" /&gt;
    
    
    
        $(document).ready(function(){
            $row = 0;
            $(".addRow").click(function(){
                $row = $row + 1;
              $('#row').append('<tr><td> \
                &lt;input type="text" name="quantity[' + $row + '][1]" value="" maxlength="2" size="2"  /&gt;</td> \
                <td><select name="bulb_type_id[' + $row + '][2]"> \
                    <option value="1">Option 1</option> \
                    <option value="2">Option 2</option> \
                    <option value="3">Option 3</option> \
                </select></td> \
                <td>&lt;input type="checkbox" name="required[' + $row + '][3]" value="1"  /&gt;</td> \
                </tr>');
          });
        });
    
    
&lt;/head&gt;
&lt;body&gt;

<table cellspacing="0">
<thead>
    <tr>
        <th>Qty</th>
        <th>Option</th>
        <th>Required ?</th>
    </tr>
</thead>
<tbody id="row">
    <tr>
        <td>    
            &lt;input type="text" name="quantity[0][1]" value="" maxlength="2" size="2"  /&gt;
        </td>
        <td>    
            &lt;? echo form_dropdown('bulb_type_id[0][2]', $bulb_types); ?&gt;
        </td>
        <td>    
            &lt;input type="checkbox" name="required[0][3]" value="1"  /&gt;
        </td>
    </tr>
</tbody>
</table>
#4

[eluser]bohara[/eluser]
Here is the controller insert function:

Code:
function add()
{
    $this->load->helper('form', 'database');
    
    // Insert reminder
    $data = array
    (
        'company_name' => $_POST['company_name'],
        'notes' => $_POST['notes'],
    );
    
    $this->db->insert('reminders', $data);
    
    // Insert line_items
    $query = $this->db->query('SELECT id FROM reminders ORDER BY id DESC LIMIT 1');
    
    $row = $query->row_array();
    
    $reminder_id = $row['id'];
    
    for ($i = 0; $i <= count($_POST['bulb_type_id'])-1; $i++) {
        
        $sql = array(
        'id' => $id,
        'bulb_type_id' => $_POST['bulb_type_id'][$i][2],
        'shatterproof' => $_POST['required'][$i][3],
      );

    $result = $this->db->insert('line_items', $sql);
  }
}




Theme © iAndrew 2016 - Forum software by © MyBB