Home › Toolset Professional Support › [Resolved] Edit buttons in list view to popup CRED form
This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.
Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.
Sun | Mon | Tue | Wed | Thu | Fri | Sat |
---|---|---|---|---|---|---|
- | 7:00 – 14:00 | 7:00 – 14:00 | 7:00 – 14:00 | 7:00 – 14:00 | 7:00 – 14:00 | - |
- | 15:00 – 16:00 | 15:00 – 16:00 | 15:00 – 16:00 | 15:00 – 16:00 | 15:00 – 16:00 | - |
Supporter timezone: Europe/London (GMT+00:00)
Tagged: Views plugin
This topic contains 9 replies, has 2 voices.
Last updated by Bruno Simon 7 years ago.
Assisted by: Nigel.
Tell us what you are trying to do? Place an edit link for each CP listed in view that will open my CRED editing form in a popup.
Is there any documentation that you are following? https://toolset.com/documentation/user-guides/displaying-cred-editing-forms/
Hello, for editing my CP, I have created a CRED form that is displayed in a popup (embedded in the form code), meaning I do not use a layout/template to display it. When I try to edit the post-link in the view loop wizard, Toolset returns the following message: "Create a new Layout that will include the CRED editing form. You can start from scratch or copy the template you use to display the content and modify it."
I'd like to simply add a link to my CRED editing form, where the popup code is embedded and, of course, that said forms is related to the listed CP.
What can I do?
Thanks.
Languages: English (English ) Spanish (Español )
Timezone: Europe/London (GMT+00:00)
Hi there
CRED edit forms can either be displayed directly on the post itself (i.e. in a template displaying the single post), or, if being linked to from the post, must be inserted in a template (a Views Content Template or a Template Layout).
Those are the only two options.
I'm not sure what you are using for your popups. It may be possible for you to include whatever generates the popup in the same template where you locate the form, but I suspect this is not what you want, because that means clicking the link and the page reloading and the a popup appearing.
If you want something like a modal you would include the form directly where you display the post, but hidden, until a user clicks a link you add (according to the requirements of your popup solution) that reveals and opens the form in the poup. The "link" won't be an actual link that leaves the page, just something to trigger the required JavaScript, so you wouldn't be using the CRED edit link shortcode for that.
So, insert the CRED form directly where you show the post (i.e. in the Loop Output section of a View) and add whatever markup your popup solution requires, including a button or link to trigger the JavaScript that will be used to open it.
Hi Nigel,
Thanks for the comprehensive reply. Indeed I have included the CRED shortcode in my CP layout, so that when viewing a particular post the author can trigger the popup CRED editing form from it. BTW, the popup code is directly embedded in the CRED form, so that a shortcode to that form can work anywhere.
However, having tried the same (as you also seem to suggest) in the view loop, the CRED form does not relate to the listed post but to the first in the list, although I get as many links as there are posts listed.
Hence my trouble...
Languages: English (English ) Spanish (Español )
Timezone: Europe/London (GMT+00:00)
Hi Bruno
That doesn't sound right, about the CRED forms in the View all editing the same—first—post.
How are you inserting the form, just with a cred_form shortcode, like this?
[cred_form form="edit-project"]
No extra parameters?
I think I should take a look if that's the case.
I will mark your next reply as private so that I can get log-in credentials from you—you may want to create a temporary admin user for me to use that you can later delete. And be sure to have a current backup of your site, even though I don't intend to break anything.
Can you also confirm which View and form we are discussing?
Languages: English (English ) Spanish (Español )
Timezone: Europe/London (GMT+00:00)
Hi Bruno
The category filters were not working because at some point after inserting the category filter it seems like you edited the Query Filter section that corresponds to the filter so that it was no longer basing the filter on the taxonomy URL parameter generated by the filter control. I've edited the Query Filter so that it is aligned with the filter control you inserted.
Regarding the forms and the links.
I edited the CRED form.
First observation is that you wrap it in wpv-loop tags. I'm not sure what you were hoping to achieve here but it is the wrong context for these and will achieve nothing helpful, so I removed them.
Next, the links are wrong because you haven't specified a URL for the link, you just use the #anchor for the href which means it is relative to the current page. You need to insert the URL of the current post before that, using the wpv-post-url shortcode. Try that and you should find it generating the correct URLs in the links.
Hi Nigel,
Thank you for solving the category filter problem!
Indeed, I thought the wpv loop tags were necessary for the form to get the parent post information when opening the form directly from a post, which by the way works with # in the href. For instance, the link generated within the post by the CRED shortcode is: hidden link
which seems to get the post url from somewhere.
When I replace this # by [wpv-post-url] as in
<a class="open-popup-link" href="[wpv-post-url]auction-Editer-popup"><i class="fa fa-pencil-square-o"></i> Editer cette annonce</a>
, the link generated by the CRED shortcode becomes: hidden link, which is almost the same but without a #, which actually does not trigger the popup (nothing happens).
Even weirder, if leave the # after [wpv-post-link] as in
<a class="open-popup-link" href="[wpv-post-url]#auction-Editer-popup"><i class="fa fa-pencil-square-o"></i> Editer cette annonce</a>
, the generated link is exactly the same as when using only #, but the popup does not work anymore: hidden link
That however seems the way to go as the links in view table are now corresponding to each listed post, although the popups do not open either...
If you care looking at the form again, there are now two lines of code; the first one being based on your suggestion and the second being the old one.
I am not sure what to do next.
Thanks
Languages: English (English ) Spanish (Español )
Timezone: Europe/London (GMT+00:00)
Hi there
I was just thinking about how your pop-up works when I realised where I went wrong, I was thrown by how you've included the pop-up in the edit form itself.
So, you View lists the posts in a table, and it also includes the entire edit form for each post, which is then hidden using CSS, until such time as the edit link is pressed which triggers the JS required to reveal the form.
The problem is that in your CRED form you have a wrapper DIV with an ID of "auction-Editer-popup" which is the same for every form. You cannot have more than one unique ID on the same page, and clicking any edit button would be likely to open the first such ID found.
Your forms need to have unique IDs (and the link at the end of the form needs to use that unique ID).
That's easy enough, you just append the wpv-post-id shortcode to your ID.
I've done that and the forms seem to work correctly now, if you could verify.
Brilliant! thanks Nigel.
Now your remark makes me realize that my approach comes at a huge performance cost, since the longer the lists, the more edit CRED forms are loaded. I took this idea from Beda's suggestion here https://toolset.com/forums/topic/display-content-in-a-popup/ and found it a particular elegant solution...not realizing that it would be so heavy for lists.
Do you think there is any way to generate said links or buttons triggering a popup CRED without loading all forms on the list itself?
Thanks.
PS: is there any styling advice or standard css available for Views different options (list, bootstrap frid, table, etc.)? I looked at the Toolset classifieds reference site, but all the styling belongs to the Toolset starter template.
Languages: English (English ) Spanish (Español )
Timezone: Europe/London (GMT+00:00)
That's not possible unfortunately, which is probably why Beda suggested what he did.
Pop-ups just reveal something hidden that is already on the page.
You would need a custom solution where opening a pop-up retrieved the CRED form via an ajax request, but that isn't supported by CRED, you would need to craft a solution yourself or find someone to do it for you (e.g. one of the Toolset contractors: https://toolset.com/contractors/).
Regarding styling, Views outputs content in different formats (e.g. Bootstrap grids) but does nothing more than provide the bare minimum markup and styles, the styling is left to the theme or custom styles you add. If you are looking to reproduce some of the styling of the reference sites I suggest you use your browser tools to examine the CSS and copy just what you need.
Ok, thanks again.