Best way to set up AJAX/JQuery process?

You could just use a template to build the row in your view and make the template available to your JavaScript by posting it to a hidden input. For example:

PHP Code:

<?php

$rowTemplate = '
<tr>
    <td id="{staffid}-s-fname">{fname}</td>
    <td id="s-lname-{staffid}">{lname}</td>
    <td id="s-dept-{staffid}">{dept}</td>
    <td><input id="{staffid}-s-edit" name="btn_add" type="submit" class="s-edit btn btn-sm btn-primary" value="Edit" /></td>
    <td><a href="{edit_url}">Edit</a></td>
</tr>';
?>
    <tbody id="staff-table-body">
        <?php
        foreach ($data as $staff)
        {
            $detail_id = $staff['staffid'];
            echo str_replace(
                array('{staffid}', '{fname}', '{lname}', '{dept}', '{edit_url}'),
                array($staff['staffid'], $staff['fname'], $staff['lname'], $staff['dept'], site_url("staff/edit_staff/{$staff['staffid']}")),
                $rowTemplate
            );
        }
        ?>
    </tbody>
</table>
<input type='hidden' id='rowTemplate' value='<?php echo $rowTemplate; ?>' /> 


Then it's just a matter of performing the same replacement on the value of #rowTemplate via JavaScript. This should be a relatively small amount of code in both languages, and you at still only define the actual HTML once.

Hi mwhitney,

That's a clever solution, thanks.

I might be able to get away with a

Code:

window.location.reload(true);

in the js but, if not, I'll implement your suggestion.