Skip Navigation

[Resolved] "Add media"-button instead of "Choose file"-button in CRED-forms

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.

Our next available supporter will start replying to tickets in about 9.00 hours from now. Thank you for your understanding.

Tagged: 

This topic contains 18 replies, has 15 voices.

Last updated by omidS 6 years ago.

Assigned support staff: Beda.

Author
Posts
#327340
Screenshot 2015-08-24 14.43.21.png
Screenshot 2015-08-24 14.42.30.png

We are trying to:
Create a simplified front end-plugin for WP-admin, using CRED-forms. All roles except Administrator will be redirected to a custom admin page. Custom CRED-forms are created for both creating and for editing all post types on the current site.

Many of our custom post types contains images, and it is important that the user may select images (and/or files) already uploaded to the media library.

So what I basically want is to replace the "Choose file"-button with an "Add media"-button.

Is this possible?

#327365

Thank you for contacting us here in the Support Forum and for providing the Debug Informations

In a CRED form, you can have the following settings for Images:

1. Allow Media Insert button in Post Content Rich Text Editor

This leads to the WordPress default Media Library PopUp Window, with both Insert and Upload options
(WordPress default)

2. When you use Image Custom Fields, this will build a Button that opens a "Upload from Desktop" PopUp.

Do I understand correctly that you want the Users be able to Choose from already to WordPress Uploaded Images, when they "add images" to the Custom Field?

This would be a feature Request, which I would need to file in our internal tracking system so to be implemented in Future Releases.

For now, you should use WYSIWYG where you can have the "Media Insert button" (which leads to WordPress Media PopUp).

Image Custom fields are using only a "Desktop" upload PopUp screen for now.

Please let me know if you have further questions regarding the issue mentioned in this Thread

Thank you for your patience.

#327371

Actually this feature is already requested and I added your Thread to vote it up.

The feature is currently postponed but the DEV team of CRED is considering it.

When exactly our developers will add a new feature or not is not up-to us Supporters to determine.

Each issue reported in, whether a bug or a new feature request, is taken seriously into consideration.

It is given a high or low priority based on a number of factors.
Factors which those with the overview of all things related are in the best position to determine.

I apologize any inconvenience this may cause currently.

Please let me know if you have further questions regarding the issue mentioned in this Thread

Thank you for your patience.

#328449
Screenshot 2015-08-26 00.14.13.png
Screenshot 2015-08-26 00.14.19.png
Screenshot 2015-08-26 00.14.31.png

Hi,

Thanks for your answers. I'm glad to hear that the feature is requested and under consideration.

But I have to find a temporary solution until then.

I found that I could retrieve the "add media"-window through javascript, namely:

wp.media({/*parameters*/}).open();

I found a code example here: hidden link. It's a bit old, but it seems like the code is still valid.

It's working fine until i click on the form's "Submit"-button. The post is stored but the image is not.

This is how I did it:

I've added a javascript to my page containing the CRED-form:

edit.php


<?php
   cred_form("Rediger ".$post->post_type,$post->ID);    //e.g "Rediger nyheter" ("edit news")
?>
      
<?php
        wp_enqueue_media(); // needed to get the wp-object loaded
        wp_register_script( 'nb-media-uploader' , plugins_url('js/media.js',__FILE__) , array( 'jquery' ) );
        wp_enqueue_script( 'nb-media-uploader' );            
?>

media.js:

jQuery.noConflict();
jQuery( document ).ready(function( $ ) {
    
    // Uploading files
    var file_frame;        
    
    jQuery("input[type='file']").on('click',function(event){
        event.preventDefault();
        
        var field_name = $(this).attr("name");
        
        // If the media frame already exists, reopen it.
        if ( file_frame ) {
            file_frame.open();
            return;
        }
                        
        // Create the media frame.
        file_frame = wp.media.frames.file_frame = wp.media({
            title: "TITLE",
            button: {
                text: "BUTTON_TEXT"
            },
            multiple: false  // Set to true to allow multiple files to be selected
        });

        // When an image is selected, run a callback.
        file_frame.on( 'select', function() {
            // We set multiple to false so only get one image from the uploader
            attachment = file_frame.state().get('selection').first().toJSON();

            console.log("About to add "+attachment.url+" to the field named "+field_name);
                        
            /* Insert the returned URL into the hidden input field */
            $("input[type='hidden'][name='"+field_name+"']").val(attachment.url).prop("disabled",false);

            /* Disable the file input field */
            $("input[type='file'][name='"+field_name+"']").prop("disabled",true);
        });
        
        // Finally, open the modal
        file_frame.open();
    });
});

So for example, on the edit-page for my custom post type, "Employee", I have featured_image enabled, and when I click on the corresponding "Choose file"-button, the "media panel" is shown, I select an image, and click on the submit-button. The selected image's URL is inserted to the hidden field with the name, _featured_image.

I then submit the entire form, and the post is successfully stored. But the featured image is not.

I assume that I need to add some post_meta or something when I save the post, but I'm not sure in which order these things are done.

Is this even possible?

Thanks!

#328632

Thanks for the Details

It seems -unfortunately- that for now you need custom programming work which is beyond the scope of our support.

At this point I would suggest you consider contacting one of our certified partners from this link:
https://toolset.com/consultant/

You will get the custom assistance you need to get on with your project.

I deeply apologize that I can't support Custom Code issues in this forum, it's not only because it's a Custom Code solution but also because the feature will be considered in a future release.

Thank you for your patience and understanding.

#328636

I'm waiting for such feature too! It could be great to add already uploaded pictures in custom field, as well as the multiple file upload would be handy.
Please consider the option to enable user filter on media window, to enable user to pick the picture or file only from his own uploads.

#332412
cred.PNG

It is working for us now - with some extra programming 🙂
have a look at the CRED form attached.

#337220

Hello, frodeH-2 - would you mind sharing your full solution? I need to do this too; we have many words to add to a glossary which will use the same image, and we don't want to keep uploading.

We would be very grateful indeed!! 🙂

#380291

@frodeh-2 What was your resolved solutions to this if you don't mind sharing? Thanks.

#394271

Dear frodeH-2, I am looking for this solution because it is easy for user to insert already uploaded images or no need to upload the same picture when creating another new custom post. Do you mind sharing your code?

Best regards,

Kelvin.

#475327

i find it very odd that CRED does not have an option to use the basic functionality of WordPress and media. It should be a high priority to optionally use the media library to select media for a CPT.

#519670

Hi, is there any news on this topic?

#538676

Really would be interested to know if this is going to be delivered. our media library is full of duplicate images for no good reason!

I have tried the plugin media deduper but it simply prevents upload of an already used image so is no good with a CRED form

#612461

@frodeh-2 , we have the same problem, would you please share your solution? It would be very appreciated.
Thanks.

Franco

#627092

Hi frodeH-2,

can you share the link of the example of code you were talking about? It appears as hidden link.

Please i need to develop this function

Regards
Vito