WordPress.org

Ready to get started?Download WordPress

Forums

Advanced Custom Fields: Validated Field
[resolved] front end forms stop working when plugin is activated (28 posts)

  1. mickfilipe
    Member
    Posted 3 months ago #

    Hi,

    This plugin seems to do exactly what I need but as soon as I activate it my front end forms stop working: when I press submit it does the normal acf validation for empty fields but when all data is there the submit button does nothing. This is both for editing and posting from the front-end. Back-end seems to be ok.

    I'm using this kind of method for my front end forms: http://www.advancedcustomfields.com/resources/functions/acf_form/?version=4

    Any help would be appreciated.

    Thanks

    https://wordpress.org/plugins/validated-field-for-acf/

  2. doublesharp
    Member
    Plugin Author

    Posted 3 months ago #

    I haven't tested this at all on the front end using acf_form() so my initial guess is that either something isn't loading because it isn't is_admin() or that the validation is failing but the CSS selectors to show the errors aren't working.

    Can you try using the Developer Tools in Chrome on the network tab to see if there is a request made to wp-ajax.php with the field info when you try to edit/post? You could also try setting the constant ACF_VF_DEBUG to true in wp-config.php which will load the non-minified javascript allowing you to set a breakpoint in the input.js file to see where it stops working - or perhaps there is simply a JavaScript error?

  3. mickfilipe
    Member
    Posted 3 months ago #

    Hi,

    Many thanks for replying.

    I'm sure it's not a validation problem and I don't even set the field type to validation field. The problem starts as soon as I turn the plugin on: the submit button for my post/edit forms stops working apart from the default js validation (if I leave the fields empty the default js validation will still work).

    Chrome's DT don't capture anything when I click submit and I've also got all WP debugging on and no errors popping up.

    But it could be a problem with my setup as I'm using it a custom theme that I'm building and as I'm a noob it is possible that it might be conflicting with some function.

    Anyway if anyone figures it out I would love to hear about it as this plugin would be quite useful for my site.

    Thanks!

  4. doublesharp
    Member
    Plugin Author

    Posted 3 months ago #

    I did some testing last night and was able to get the validation to work on the front-end with some modifications, a big one being including the JavaScript on the front-end and not just the admin, so I'm not sure why you would be seeing a conflict on the front-end with this plugin enabled. If the JavaScript is being included, then it would likely be intercepting the submit click and not letting it continue due to differences in the CSS selectors that I am currently using for the admin.

    If you're interested I can give you a copy of the dev code so you can give it a try, it will require an additional constant ACF_VF_FRONTEND to be defined and set to true since typically you wouldn't want the javascript included on the front end.

  5. mickfilipe
    Member
    Posted 3 months ago #

    Hey that would be great, if you could link to the dev code or email it to mickfilipe@hotmail.com I would really appreciate it. I'll let you know if it works and if not I'll try to make it work, I'm no php wizard but I'm learning and this will be a good challenge I guess :)

    Cheers

  6. doublesharp
    Member
    Plugin Author

    Posted 3 months ago #

    Sorry for the delay. I had some dental work done and have been taking painkillers the past few days, so not much programming. There are some factors I didn't consider when I did the POC even though it "works", primarily the DOM element ID's, so the is still a bit more to do. I'll let you know once it's ready to demo.

    Thanks!

  7. mickfilipe
    Member
    Posted 2 months ago #

    Hey,

    Many thanks for looking into this and If there's anything I can help you with let me know.

    Cheers!

  8. doublesharp
    Member
    Plugin Author

    Posted 2 months ago #

    Sorry - now my parents are in town so I haven't had a chance to finish testing, plus I'm trying to make some of the global settings easier to manage (options page vs constants).

    If you want to give the dev version a try you can download it from here, then add define( 'ACF_VF_FRONTEND', true ); to your wp-config.php. It would be great if you could let me know either way if it works for you or not.

    Thanks!

  9. mickfilipe
    Member
    Posted 2 months ago #

    Hey, many thanks for sharing the dev version, I'm a bit busy myself at the moment but I'll give it a try as soon as I can and will report on results.

    Thanks!

  10. doublesharp
    Member
    Plugin Author

    Posted 2 months ago #

    If you haven't downloaded it, I just put an updated version at the same link if you care to give it a try. The global settings have now been moved to a settings page in the Admin under "Custom Fields > Validated Field". You want to check the box to enable validation on the front end and save.

  11. mickfilipe
    Member
    Posted 2 months ago #

    Hey sorry I've been quite busy lately and didn't get the chance to test it yet, I will try it tonight and report back.

    Cheers!

  12. mickfilipe
    Member
    Posted 2 months ago #

    Hey man, you're the best! Your awesome plugin is now working with my front end forms :)

    I found a few minor bugs though:

    1 - the failed validation warning red borders have disappeared for any fields which are not using the 'validated field' type from your plugin; And it only works for fields using the 'validated field' type if the user has written down something. If the field is empty only the message pops up at the top;

    2 - The custom error messages for your validated fields are not displaying properly. What I see instead is some weird red mark + a red arrow shape ("class = bit" rings a bell?) Even if custom error message is empty I get this arrow shape and red mark.

    3 - If I type something into a validated field type with a custom php function and it doesn't 'return true' (validated) the validation error message appears twice on top:
    "Validation Failed. One or more fields below are required.
    Validation Failed. See errors below."

    And no custom errors messages show as per point no.2

    I should have some time this week and will try and have a go at fixing these but if you happen to know the cause of any of the issues please let me know.

    Thanks a lot for all your help mate!

  13. waltercruz
    Member
    Posted 2 months ago #

    Hi doublesharp. I ran in the same issue as posted by mickfilipe. There's a stable update planed for the next days?

  14. doublesharp
    Member
    Plugin Author

    Posted 2 months ago #

    Soon, but it might be another week. Currently trying to launch the business that this plugin was originally written for (but not using the front-end piece so it's not blocking) and at the same time clearing brush from some rural land - high tech/low tech diversification.

    Sorry for the holdup, I'm aiming to have a bug free version early next week, but hey, at least it's free :P

    J

  15. gabyferman
    Member
    Posted 2 months ago #

    Hi, any chances i could get the dev files too? I have the same problem, and I need it for some work with a client. Wouldn't mind if there's stuff to change or modify in the files.

  16. johnny_br
    Member
    Posted 2 months ago #

    Hello Man, thank's for this awesome plugin!

    i've been found a issue at file validated_field_v4.php, line 740. You use $sub_field['read_only'], but the right is $field['read_only'].

    Thank's again!

  17. doublesharp
    Member
    Plugin Author

    Posted 2 months ago #

    @mickfilipe, @waltercruz, @gabyferman, @johnny_br - finally got some time to work on this some more.

    @mickfilipe, @waltercruz here are some updates for the issues you saw.

    1 - this was a conflict between the built in "required" validation and the server side validation. The plugin has been updated to only check the server side validation once the client side validation passes.
    2 - thats the built in "error" CSS for ACF, but it looks like you are missing a message for some reason... possibly a server side error. I can't get this to fail like you are seeing, so can you check your PHP error log? That said even explicitly adding bad code gave me a message of PHP Error: syntax error, unexpected '}', line 9.
    3 - again, this was built in validation vs this plugin's validation. I am only running the latter if the first passes however, so the message at the top should update accordingly.

    @gabyferman you can download it from the same link: https://www.dropbox.com/s/0gf6ghesups12b7/validated-field-for-acf.zip

    @johnny_br thanks! I've updated the code to correct this.

    I also ran into an issue with the default "colors-fresh" admin theme being loaded by ACF when acf_form_header() is called, specifically setting a min-width of 763px on #poststuff. The following will immediately dequeue it if you want to use all your own styles.

    add_action( 'acf/input/admin_enqueue_scripts', 'remove_acf_form_style' );
    function remove_acf_form_style(){
    	wp_dequeue_style( array( 'colors-fresh' ) );
    }
  18. doublesharp
    Member
    Plugin Author

    Posted 2 months ago #

    The code is available here as well https://github.com/doublesharp/validated-field-for-acf

  19. doublesharp
    Member
    Plugin Author

    Posted 2 months ago #

    To grab a ZIP of the latest in master from GitHub, use https://github.com/doublesharp/validated-field-for-acf/archive/master.zip

  20. johnny_br
    Member
    Posted 2 months ago #

    @doublesharp Thanks man!

  21. gabyferman
    Member
    Posted 2 months ago #

    @doublesharp thanks :)

  22. doublesharp
    Member
    Plugin Author

    Posted 2 months ago #

    @mickfilipe, @waltercruz, @gabyferman, @johnny_br

    My testing has all be successful, so unless anyone objects shortly I am going to tag the latest code as a new version.

    Thanks!

  23. johnny_br
    Member
    Posted 2 months ago #

    @doublesharp My testing has all be ok too.

  24. mickfilipe
    Member
    Posted 1 month ago #

    Thanks for fixing this mate, all of the bugs I mentioned above seem to have been fixed.

    In regards to bug 2, the error message was showing blank because I am using a php statement and needed to declare the error message i.e.

    else {
    $message = "Invalid link";
    return false;
    }

    it was confusing because the 'error message' field provided wasn't working but maybe it works when using a 'regular expression. I also had to disable front end validation in the options.

    I have also noticed the 'unique value' option is not working for me. It rejects all data including unique values. And the error message also shows empty (there's no option to customise this error message but I think something like 'duplicate entry' should pop). Not sure if its my php causing this, I'm using a preg_match if statement as I couldn't figure out how 'regular expression' works.

    Anyway, thank you very much for this plugin and for keeping it updated.

  25. doublesharp
    Member
    Plugin Author

    Posted 1 month ago #

    @mickfilipe - it sounds to me like there is something going on in your PHP... only have a few mins so forgive me for being short.

    - $message is passed in by reference, so it should be initialized to whatever is in the "error message" field, and then you can overwrite it in your PHP. it works for me, so if it's not set for you maybe an error that is losing it (500 for example).

    - unique values are checked *after* the PHP/regex checks, so again it makes me think the PHP is bombing and never even getting to the unique checks. can you check your php error log to see if there is anything there?

    - my regex matching is kind of stupid and messed up. it's just a preg_match() but for some reason I decided to not have the delimiters passed in so I could escape forward slashes properly... so if you wanted to check /\d{2,4}/ you would use d{2,4} for example.

  26. doublesharp
    Member
    Plugin Author

    Posted 1 month ago #

    Just pushed version 1.3 which hopefully addresses all of the above issues. If you are still have problems please open a new ticket, thanks!

  27. johnny_br
    Member
    Posted 1 month ago #

    @doublesharp, this plugin works with acf5?

    thanks again!

  28. doublesharp
    Member
    Plugin Author

    Posted 1 month ago #

    @johnny_br I'm actually not sure, I have heard one report that it doesn't but no additional info. Pretty swamped with other things right now so if you wanted to try it out and let me know the results I would definitely like to hear it :)

    My own testing will probably have to wait a bit for some time to free up.

Reply

You must log in to post.

About this Plugin

About this Topic