Snippet, JQ UI Dialog a aktualizace dat přes AJAX

Mám seznam uživatelů a chci jednoho z nich smazat nebo aktualizovat data, edit/delete formulář mám řešen přes JQuery UI Dialog a potřebuji, aby se mi po kliknutí na editaci uživatele X otevřelo dialogové okno, načetly se přes ajax z DB(mysql) data o uživateli X a poté se přes snippet do formuláře doplnily již načtená data

template users

{block content}

{snippet itemsContainer} {$user_detail} {/snippet}

<!-- create/update reservation dialog -->
<div id="edit-dialog" title="Create new user">
    <p class="validateTips">All form fields are required.</p>
    <form>
        <fieldset>
            <label for="name">Jméno</label>
            <input type="text" name="name" id="name" value="" class="text ui-widget-content ui-corner-all">
            <label for="password">Přijmení</label>
            <input type="text" name="lastname" id="lastname" value="" class="text ui-widget-content ui-corner-all">
            <label for="email">Email</label>
            <input type="text" name="email" id="email" value="" class="text ui-widget-content ui-corner-all">
            <label for="persno">Personal number</label>
            <input type="text" name="persno" id="persno" value="" class="text ui-widget-content ui-corner-all">

            <label for="persno">Role</label>
            <select>
                <option value="user">User</option>
                <option value="admin">Admin</option>
            </select>
        </fieldset>
    </form>
</div>

<div id="delete-dialog">
    Opravdu si přejete smazat tohoto uživatele ?
</div>

<div class="row">
    <div class="col-sm-12">

        <h4>Seznam uživatelů</h4>
        <button id="create-user">Create new user</button>

        <table class="t_style_1">
            <thead>
                <tr><th>Personal No.</th><th>Email</th><th>First name</th><th>Last name</th><th>Role</th><th>Edit</th><th>Delete</th></tr>
            </thead>
            <tbody>

                {foreach $all_users as $usr}
                    <tr>
                        <td>{$usr->persNo}</td>
                        <td>{$usr->email}</td>
                        <td>{$usr->firstName}</td>
                        <td>{$usr->lastName}</td>
                        <td>{$usr->role}</td>
                        <td>
                            <img src="{$baseUri}/images/settings-20.png" class="{$usr->persNo}" id="edit-btn">
                        </td>
                        {if $usr->persNo != $actLogUserPersNo}
                            <td>
                                <img src="{$baseUri}/images/cross-20.png" class="{$usr->persNo}" id="delete-btn">
                            </td>
                        {/if}
                    </tr>
                {/foreach}
            </tbody>
        </table>

    </div>
</div>
{/block}

{block scripts}
{include parent}
<script src="{$basePath}/js/jquery-ui.min.js"></script>
<script src="{$basePath}/js/setup.js"></script>
{/block}

{block head}
<link rel="stylesheet" href="{$basePath}/css/jquery-ui.min.css">
<link rel="stylesheet" href="{$basePath}/css/jquery-ui.structure.min.css">
<link rel="stylesheet" href="{$basePath}/css/jquery-ui.theme.min.css">
{/block}

setup.js

• tady by mě zajímalo jestli neexistuje lepší, hezčí a efektivnejší způsob zápisu(generování) url u ajaxového požadavku

$(function () {
    $.nette.init();
});

function preLoad(id) {
    $.nette.ajax({
        type: 'GET',
        url: "/~user/x/www/setup/users?do=renderUserData",
        data: {
            "user_pers_id": id
        },
        success: function(data){
            //alert(data);
        }
    });
}

$(function () {
    $("img#edit-btn").click(function () {
        var id = $(this).attr('class');
        $("#edit-dialog").load(preLoad(id)).dialog("open");
    });

    $("img#delete-btn").click(function () {
        var id = $(this).attr('class');
        $("#delete-dialog").dialog("open");
    });

    $("#edit-dialog").dialog({
        autoOpen: false,
        modal: true,
        draggable: false,
        resizable: false,
        width: 350,
        title: "Edit User",
        buttons: {
            "Save": function () {
                $(this).dialog("close");
            },
            Cancel: function () {
                $(this).dialog("close");
            }
        }
    });

    $("#delete-dialog").dialog({
        autoOpen: false,
        title: "Delete User",
        resizable: false,
        draggable: false,
        modal: true,
        buttons: {
            "Delete User": function () {
                $(this).dialog("close");
            },
            Cancel: function () {
                $(this).dialog("close");
            }
        }
    });

    $("#create-user").button().on("click", function () {
        $("#edit-dialog").dialog("open");
    });

});

presenter Setup (výňatek obsluhy Users)

namespace App\Presenters;

use Nette;

class SetupPresenter extends ProtectedPresenter {

    /** @var Nette\Database\Context */
    private $database;

    public function __construct(Nette\Database\Context $database) {
        $this->database = $database;
    }

    public function renderUsers() {
        $this->template->all_users = $this->database->table('user')->select('*')->order('id')->fetchAll();
        $this->template->actLogUserPersNo = $this->user->identity->persNo;
        $this->template->user_detail = 'zero';
    }

    public function handleRenderUserData($user_pers_id) {

        if ($this->isAjax()) {
            $this->template->user_detail = 'Prekresleno';// $this->database->table('user')->select('*')->where('persNo', $user_pers_id);
            $this->redrawControl('itemsContainer');
        }
    }
}

Ajax response vrátí

{"state":[],"snippets":{"snippet--itemsContainer":" zero"}}

a já potřebuji aby vrátil „Prekresleno“