I have a SafeCracker form where I've hard-coded the Matrix fields to customize the way they are displayed. It is working fine as an entry form, but I'm having trouble using it as an edit field.
My safecracker tag is wrapped in a channel entries tag, so I can get the values of the form fields when editing, but using the code below, when I have multiple matrix rows, the edit field just shows a single row, but with multiple values within each field.
Is there a way to get it to display multiple rows when editing?
<div class="name_relationship">
<input type="hidden" name="form_name_relationship[row_order][]" value="row_new_0" />
<label for="">Name</label>
<input type="text" name="form_name_relationship[row_new_0][col_id_14]" value="{form_name_relationship}{name}{/form_name_relationship}"/>
<label for="">Relationship</label>
<input type="text" name="form_name_relationship[row_new_0][col_id_15]" value="{form_name_relationship}{name}{/form_name_relationship}"/>
</div>
<p><a href="#" class="button radius tiny addname">+ Add Name</a> <a href="#" class="button radius tiny remname">– Remove Name</a></p>
<script>
$(".addname").live('click',function(e){
e.preventDefault();
var $name_relationship = $("div.name_relationship:eq(0)");
var $clone = $name_relationship.clone().html().replace(/row_new_0/g,'row_new_');
$("div.name_relationship:last").after('<div class="name_relationship">'+$clone+'</div>');
})
$(".remname").click(function(e){
e.preventDefault();
if($("div.name_relationship").length > 1)
{
$("div.name_relationship:last").remove();
}
})
</script>