Kier's Scratchpad Add on

[Chris D]

I am using Kier's Scratchpad add on as the base for a comments system on a project I'm working on.

So far I've extended it to be included in multiple pages, I've added bbcode support and included the standard XenForo rich text editor.

I have also added permissions and the ability to delete and edit comments based on those permissions.

Deleting is working great. To an extent, editing is working but the part that isn't (for editing) is AJAX.

My edit function loads the rich text editor in an overlay - much the same as editing a post.

The form action takes you to the same function that posts a new comment. I would expect that, at least, the comments would refresh behind the overlay to include the new comment in a lovely AJAX style. Instead what happens is seemingly nothing.

The editor stays on the screen, the overlay doesn't close and it doesn't look as if anything has happened. Yet if you refresh the page the edit has indeed happened.

So tl;dr

Desired result is to save the changes to the comment, close the overlay and refresh the list of comments with the updated message.

Any clues?

 

[jadmperry]

Sounds interesting. Any demo site?

 

[Sadik B]

Hi Chris

You should post the templatecode of your edit form and the JS file you are using.

Typically for aJax refresh to happen
- You have to have the AutoValidator class applied to your form
- And a New class applied to the form (starting with Uppercase) which you register to a Xenforo namespace in your javascript file
- Your action class should have the noredirect if condition and return the data which you want to load through aJax on the page
- Your JS file should receive the ajaxData and insert it into the page template with whatever sliding effect you desire.

You can look at Scratchpad.js file and the post note method which do all the above in Kier's Addon.

 

[Chris D]

Sounds interesting. Any demo site?

It's not ever going to see the light of day, unfortunately. It's a big custom project I'm working on which will not be released publicly.

Maybe I'll be able to showcase it once it's finished and live.

Hi Chris

You should post the templatecode of your edit form and the JS file you are using.

Typically for aJax refresh to happen
- You have to have the AutoValidator class applied to your form
- And a New class applied to the form (starting with Uppercase) which you register to a Xenforo namespace in your javascript file
- Your action class should have the noredirect if condition and return the data which you want to load through aJax on the page
- Your JS file should receive the ajaxData and insert it into the page template with whatever sliding effect you desire.

You can look at Scratchpad.js file and the post note method which do all the above in Kier's Addon.

Thank you. In terms of inserting a new post, this is all working fine. I've just solved one of my issues. I've worked out how to close the overlay and clear its cached data:

overlay.close().getTrigger().data('XenForo.OverlayTrigger').deCache();

I just need to get more proficient with Javascript and AJAX. The code quite clearly doesn't handle the case where the comment already exists and just needs to be updated. As far as the AJAX is concerned, that comment is already there and inserted so it doesn't need to be inserted again.

EDIT: In addition to that, I can now also clear the editor's contents when a new post is inserted (previously it used to stay there...)

 

[Chris D]

I've dug around and solved the problem the best I can.

I will revisit it at some point to make it better, but it works right now

 

[Bob]

pretty much the same system I use for comments in sportsbook and showcase. Also have likes and report along with alert functionality and newsfeed functionality.

 

[DRE]

Sounds cool.