Modifying content on user profile

Hey guys,

Iā€™ve ran into quite a challenge for me. I have user profiles on my site, generated by a template via a route, and each user profile has posts on it. The posts come in snippets, with page names like ā€˜user/post-nameā€™. Each post snippet has an ā€œEditā€ button to change the post text.

Iā€™m stuck at figuring out how to handle the post editing. When the ā€œEditā€ link (or in my case div) is clicked, an overlay with a form is displayed on the profile page. I have no idea how I could retrieve the post page details in order to display the text value in the form textarea.

Can this be done via the controller provided the edit button is not a form element which could submit stuff? Is there a way to use the data attributes on the Edit element?

Iā€™d use a route to handle the logic and send the page via a data attribute.

Thanks for the tip, but Iā€™ve been thinking about this and Iā€™m not sure how to do it.

Since itā€™s the same URL pattern, how do you do it? Because you hit ā€˜profiles/user4321ā€™, you hit Edit, an overlay is opened via jQuery and after you edit the content you hit ā€˜Saveā€™, which is supposed to close the overlay. Iā€™m also not sure how to retrieve the right page since the snippet looks something like this:

<div class="box padSmall article">
    <div class="userDetails">
        <?php echo $site->user($uid)->avatar()->crop(44) ?>
        <p><strong class="focus"><?php echo $site->user($uid)->displayName() ?></strong><br><span class="secondaryDesc"><?php echo $post->date('d/m/Y H:i', 'dateCreated') ?></span>
        </p>
    </div>
    <div class="content">
        <?php echo kirbytext($post->text()) ?>
        <?php if($file = $post->file()): ?>
            <a href="<?php echo $file->url() ?>"><?php echo $file->resize(500); ?></a>
        <?php endif ?>
    </div>
    <?php if($site->user()) : ?>
        <?php if($site->user()->current()->username() === $uid || $site->user()->hasRole('admin')): ?>
            <div class="controls">
                <a href="<?php echo url('delete-post/' . $uid . DS . $post->dirname()) ?>" class="postLink">Delete</a>
                <div id="<?php echo 'posts' . DS . $uid . DS . $post->dirname() ?>" class="postLink modify">Edit</div>
            </div>
        <?php endif ?>
    <?php endif ?>
</div>

This is a basic outline:

Button with data page attribute

<button data-page="<?php echo url() . '/edit-post/' . $post->uri()) ?>" class="postLink modify">Edit</button>

JavaScript get route URL from data-page attribute

var element = $('.modify');
var url = element.data('page');
// in your ajax call, you can now use this url

In your route, get the uri of the page from the pattern

c::set('routes', array(
  array(
    'pattern' => 'edit-post/(:all)',
    'method' => 'POST',
    'action' => function($uri) {
      $page = page($uri);
      // fetch content of page field and send back as json response
    }
  )
));