[Resolved] Dynamic value of bookmark form submit button based on bookmark status

[Author]

Posts

[rithvikU]

Hey 🙂

Here is the link to the archive page where I have implemented the feature: hidden link
You can create an account to reveal the bookmark buttons, or I can generate some login details for you and share if you set the next reply to private.

I am trying to set up bookmark functionality by following https://toolset.com/forums/topic/favorites-view/ .
I have managed to replicate all the functionality except implementing jquery to dynamically set the value of the submit button upon page load as mentioned here: https://toolset.com/forums/topic/favorites-view/page/2/#post-581277

Instead of seeing bookmarked posts with "-" value in the button and others with "+" value, all the bookmark buttons show "-".
Note: you need to hover over the entries to reveal the bookmark button.

This is the code for my form:

[credform]
[wpv-for-each field="wpcf-bookmark-id"]
[wpv-conditional if="( [types field='bookmark-id'][/types] eq [wpv-current-user info='id'] )"]
[cred_generic_field field='remove-favorite' type='hidden' class='']
{
"required":0,
"validate_format":0,
"default":"1"
}
[/cred_generic_field]
[/wpv-conditional]
[/wpv-for-each]
[cred_field field='form_submit' output='bootstrap' urlparam='' value='+' class='bm-btn']
[/credform]

And this is the jQuery:

jQuery(window).bind("load", function() {
jQuery( "form[id^='cred_form_1606']").find("input[type='submit']").val(jQuery( "input[name='remove-favorite']").length ? "-" : "+");
});

I can verify that the bookmark functionality is working, but I seem to have done something wrong with the jQuery and I was hoping you could help me implement this properly.

[Jamal]

Hello and thank you for contacting the Toolset support.

The jQuery part will not work because the form "remove-favorite" is not rendered on the view at all. It is not rendered because you are using the wpv-conditional inside the wpv-for-each which is not supported, as you can see in the documentation hidden link
https://toolset.com/documentation/programmer-reference/views/views-shortcodes/#vf-153482

I wonder why are you implementing the field "wpcf-bookmark-id"? Is that required for the favorites plugin that you are using? I must confess, I did not go through the ticket that you mentioned.

[rithvikU]

Hi Jamal,

You are right about the documentation which only leaves me even more confused because I know the bookmark functionality is working, and the 'remove-favorite' is being created conditionally. Since the 'remove-favorite' field is hidden, I added another checkbox field 'fav' within the conditional group which I can confirm is being created only for posts that have been bookmarked (see all screenshots).

I am implementing bookmark functionality using toolset alone, no other plugins, based on the support thread I linked previously. I understand it is long so if you'd like the short version, please read this or else skip to the next paragraph! I created a repeating custom number field called 'bookmark-id', to store the ID of each user who has bookmarked that post. To create the '+'/'-' bookmark button, I created a form to edit the 'resource' post type, removed everything except the submit button, added the code (as provided by the support exec Christian on the other thread) to create a hidden generic field ('remove-favorite') conditionally for each post if the current post already has the current logged in user's ID in the 'bookmark-id' field. I added the following code to the functions.php file to add or remove the user ID based on the presence or absence of the 'remove-favorite' field.

add_action('cred_save_data_1660', 'toggle_user_favorite_cred',10,2);
add_action('cred_save_data_1606', 'toggle_user_favorite_cred',10,2);
function toggle_user_favorite_cred($post_id, $form_data)
{
  if( isset($_REQUEST['remove-favorite']) ) {
    delete_post_meta($post_id, 'wpcf-bookmark-id', get_current_user_id());
  } else {
    add_post_meta($post_id, 'wpcf-bookmark-id', get_current_user_id(), false);
  }
}

My guess is that the javascript is changing all the bookmark buttons to '-' because that code was written by Christian to be used on a content template with one bookmark button, not an archive page with multiple ones. So when even one of the bookmark buttons/post-edit forms has the 'remove-favorite' field, all of the buttons are having their values changed. I can sort of confirm that becuase when I remove my user ID from the 'bookmark-id' field in all the posts, I see '+' buttons, but when even one post is bookmarked, I see the 'fav' checkbox field on that post alone but all the buttons now read '-' (see screenshots). Could you help me modify the following JS accordingly to be used in an archive page? It would really help make this bookmark functionality work within toolset without needing any other third party plugins! Thank you for your time Jamal 🙂

jQuery(window).bind("load", function() {
jQuery( "form[id^='cred_form_1606']").find("input[type='submit']").val(jQuery( "input[name='remove-favorite']").length ? "-" : "+");
}); 

[Jamal]

Thank you for this feedback. I'll do my best to help you with this issue 🙂

We can't work on the JS part yet. Because the forms(form per post) that we want to modify using this JS are not generated at all. Check this screenshot hidden link
There only 3 forms on the page. The search form at the top, the archive template filters form, and a hidden form for login(probably added by the theme).

So, we'll need to handle the part of the archive template that displays the form. Once the form is generated with each post of the archive, we can adapt the JS code to fix it.

Can you share the part of code from the archive template where you put the form?
Would you like to allow me temporary access to check all of these closely? Your next reply will be private to let you share credentials safely. ** Make a database backup before sharing credentials. **

[Jamal]

My apologies for the late reply, but I was not working today.

The credentials did not work for me. Please double-check from your side and add them in your next reply, or just update them on your previous one.

[rithvikU]

Hi Jamal,

I checked the login details twice again, they are right. I have a feeling you might have missed the " / " at the beginning of my password.. Can you retry please?

EDIT: I noticed that my ftp server IP was wrong, I have corrected it. Please retry with the same details and let me know if you are still facing an issue.

[Jamal]

Thank you 🙂 I also was able to come up with the following code:

jQuery(window).bind("load", function() {
  jQuery( "form.cred-form").each(function(){
    var form = jQuery(this);
    var favs = form.find("input[name='remove-favorite']"); 
    form.find("input[type='submit']").val(favs.length ? "-" : "+");
  })
}); 

Check this screenshot hidden link

[rithvikU]

My issue is resolved now. Thank you!