I am trying to use Matrix within a Safecracker field. I am able to submit entries successfully. However I can only submit one row to the custom matrix field. Even if I have added more than one row in my form and return a successful submission.
Here is the HTML, JS and appended HTML code in question. Help is extremely appreciated. I'm under a serious time crunch and it's the last thing on my list.
HTML Code:
<h4>Add attendees</h4>
<input type="hidden" data-field="ug_reg_attendees" name="ug_reg_attendees[row_order][]" value="row_new_0">
<div class="attendee_group">
<div class="input-prepend">
<span class="add-on"><div class="validation-circle"></div></span>
<input type="text" name="ug_reg_attendees[row_new_0][col_id_52]" placeholder="First Name" />
<div class="message"></div>
</div>
<div class="input-prepend">
<span class="add-on"><div class="validation-circle"></div></span>
<input type="text" name="ug_reg_attendees[row_new_0][col_id_53]" placeholder="Last Name" />
<div class="message"></div>
</div>
<div class="input-prepend">
<span class="add-on"><div class="validation-circle"></div></span>
<input type="email" name="ug_reg_attendees[row_new_0][col_id_54]" placeholder="Email Address" />
<div class="message"></div>
</div>
</div>
<div class="btn pill blue" id="add_attendee">
<div class="topping">Add Attendee <strong>+</strong></div>
</div>
JS:
$("#add_attendee").live("click", function(e) {
e.preventDefault();
var $row = $(".attendee_group:eq(0)").last();
var size = $(".attendee_group").length;
var $clone = $row.clone().html().replace(/row_new_0/g, "row_new_"+size);
$(".attendee_group:last").after("<div class='attendee_group'>"+$clone+"</div>");
});
Outputted code: (when at least 1 row is added)
<div class="input-prepend">
<span class="add-on"><div class="validation-circle"></div></span>
<input type="text" name="ug_reg_attendees[row_new_1][col_id_53]" placeholder="Last Name">
<div class="message"></div>
</div>
<div class="input-prepend">
<span class="add-on"><div class="validation-circle"></div></span>
<input type="email" name="ug_reg_attendees[row_new_1][col_id_54]" placeholder="Email Address">
<div class="message"></div>
</div>