Tagged: Front End Forms, hidden, scope, woocommerce
- This topic has 15 replies, 4 voices, and was last updated 4 years ago by
alexanderbiscajin.
-
AuthorPosts
-
-
November 30, 2015 at 6:39 am #5160
hozefasmileMemberHi,
I am working on an eCommerce site http://uniqueswebsolution.com/clippingc/ and I am using piklist beta version 0.9.9.6
On the order detail page I want to display a add more field of upload files. You can see the product detail page to know what I have added on the product detail page through piklist http://uniqueswebsolution.com/clippingc/product/color-correction/
For adding this add more field I had created order-form.php under piklist/parts/ folder of the theme and provided following code to display it.
<?php /* Title: Upload files Method: post Message: Your data has been successfully uploaded */ piklist('field', array( 'type' => 'group' ,'field' => 'upload_order_attch' ,'label' => __('Upload your images') ,'scope' => 'shop_order' ,'columns' => 12 ,'add_more' => true ,'fields' => array( array( 'type' => 'file' ,'field' => 'attch-single' ,'scope' => 'shop_order' ,'label' => __('Add File(s)','piklist') ,'description' => __('You can add image files or zip file with all images in it.','piklist') ,'options' => array( 'basic' => true ) ) ) ) ); piklist('field', array( 'type' => 'submit' ,'field' => 'submit' ,'value' => 'Submit' )); ?>I have used scope as “shop_order” , that I think is the post type for order in woocommerce, ref https://docs.woothemes.com/document/installed-taxonomies-post-types/
Now to display it on order detail page I am adding this code in woocommerce/order/order-details.php
<?php // Additional attachement display on detail page $upload_order_attch = get_post_meta($post->ID, 'upload_order_attch', true); // Get your custom template part: addmore-workout-template.php piklist(get_stylesheet_directory() . '/template/addmore-workout-template', array('data' => $upload_order_attch, 'loop' => 'data')); ?>According to the instruction provided in your documentation. and then created a template file addmore-workout-template.php and added this code in it
<?php echo $data['upload_order_attch']; ?>But nothing is displaying on the order detail page when creating an order by adding images to piklist add more field.
Please suggest me what I am missing and what next we need to do here to make it available on the order detail page?
Thanks
Hozefa -
November 30, 2015 at 4:40 pm #5166
SteveKeymasterTwo things you will need to update:
FORM:
Your scope should be post_meta, because that’s where the data is being saved.
,'scope' => 'post_meta'You will need to include a hidden field to tell Piklist which CPT to save against:
piklist('field', array( 'type' => 'hidden' ,'scope' => 'post' ,'field' => 'post_type' ,'value' => 'shop_order' ));You can see a sample of this in:
plugins/piklist/add-ons/piklist-demos/parts/forms/new-post-with-validation.phpDISPLAY THE DATA:
One of the big changes with v0.9.9x is that you no longer need all that code to retrieve you data. You can easily pull it like a standard PHP array and loop through it.Try this:
$upload_orders = get_post_meta($post->ID, 'upload_order_attch', false); foreach ($upload_orders as $upload_order => $value) { echo $value; }Let us know if that works for you.
-
December 1, 2015 at 3:27 pm #5179
hozefasmileMemberHi Steve,
I have applied your modification, but still its not showing on the related order detail page for example http://uniqueswebsolution.com/clippingc/my-account/view-order/60/
I think during the file upload we have to click submit button to add those images, this refreshes page, so it not get connected to the order and just saved as a separate file. But if we can connect with the order post that is being created during the checkout process, then we can show up them in corresponding order detail page.
Thanks
-
December 1, 2015 at 3:41 pm #5180
SteveKeymasterSorry, I’m not following. Are you saying this is empty?
$upload_orders = get_post_meta($post->ID, 'upload_order_attch', false); -
December 1, 2015 at 4:20 pm #5183
hozefasmileMemberYes, that shows empty result.
-
December 1, 2015 at 4:24 pm #5184
SteveKeymasterDoes this work?
$meta = get_post_custom($post->ID); -
December 4, 2015 at 3:39 pm #5230
hozefasmileMemberHi I have checked
$meta = get_post_custom($post->ID);, it shows Array as result.But the above code
$upload_orders = get_post_meta($post->ID, 'upload_order_attch', false); foreach ($upload_orders as $upload_order => $value) { echo $value; }Show error “Warning: Invalid argument supplied for foreach() in /home/uniqueswebsol/public_html/clippingc/wp-content/themes/clippingstar-child/woocommerce/order/order-details.php on line 26”
-
December 5, 2015 at 7:15 am #5234
SteveKeymasterOk. It looks like you don’t have access to the WordPress $post object. Try this:
global $post; $meta = get_post_custom($post->ID);
-
December 5, 2015 at 3:32 pm #5237
hozefasmileMemberOk,
I have added global $post on my code, but its just informing that its an array. How I can get the url value from it for each uploaded images?
For testing purpose I have created a page http://uniqueswebsolution.com/clippingc/testing/ . You can see that the code
$meta = get_post_custom($post->ID); echo "<p class='piklist-class'>".$meta."</p>"; print_r($meta);result in an array like this
Array ( [_edit_lock] => Array ( [0] => 1449342554:1 ) [_edit_last] => Array ( [0] => 1 ) [_wp_page_template] => Array ( [0] => page-faq.php ) [_wpb_vc_js_status] => Array ( [0] => false ) [_vc_post_settings] => Array ( [0] => a:2:{s:7:”vc_grid”;a:0:{}s:10:”vc_grid_id”;a:0:{}} ) [slide_template] => Array ( [0] => default ) [layout] => Array ( [0] => fullwidth ) [sidebar] => Array ( [0] => blog-sidebar ) [bg_rev_slider] => Array ( [0] => ) [banner_type] => Array ( [0] => ) [banner_width] => Array ( [0] => wide ) [layer_slider] => Array ( [0] => ) [rev_slider] => Array ( [0] => ) [banner] => Array ( [0] => ) [product_slider] => Array ( [0] => ) [portfolio_columns] => Array ( [0] => 4 ) [portfolio_cat] => Array ( [0] => 0 ) [faq_cat] => Array ( [0] => 0 ) [content_top] => Array ( [0] => ) [content_bottom] => Array ( [0] => ) )and the code
global $post; $upload_orders = get_post_custom($post->ID, 'upload_order_attch', false); foreach ($upload_orders as $upload_order => $value) { print_r($value); }gives array result like this
Array ( [0] => 1449342675:1 ) Array ( [0] => 1 ) Array ( [0] => page-faq.php ) Array ( [0] => false ) Array ( [0] => a:2:{s:7:”vc_grid”;a:0:{}s:10:”vc_grid_id”;a:0:{}} ) Array ( [0] => default ) Array ( [0] => fullwidth ) Array ( [0] => blog-sidebar ) Array ( [0] => ) Array ( [0] => ) Array ( [0] => wide ) Array ( [0] => ) Array ( [0] => ) Array ( [0] => ) Array ( [0] => ) Array ( [0] => 4 ) Array ( [0] => 0 ) Array ( [0] => 0 ) Array ( [0] => ) Array ( [0] => )But when I try
get_post_meta in place of get_post_custom
its shows blank , no result.I actually want the customer who is ordering a graphic design service using woocommerce, will be able to upload his images during the order process and then those images will be available in backend individual order pages and front end individual order pages as image link to download. So that the site owner knows what images he have work for the particular order, and then by backend order detail page, he can upload is prepared (edited) graphic work and in same way that will be available on the customer order detail page for download.
Thanks
Hozefa -
December 7, 2015 at 12:34 pm #5250
SteveKeymasterJust took another look at this I think I understand the issue. Your original field configuration is incorrect. If you open the Piklist plugin and look at this file in the demos you’ll understand how to do this:
piklist/add-ons/piklist-demos/parts/forms/new-post-with-validation.phpTry this:
// Save field to this post_type piklist('field', array( 'type' => 'hidden' ,'scope' => 'post' ,'field' => 'post_type' ,'value' => 'shop_order' )); piklist('field', array( 'type' => 'file' ,'scope' => 'post_meta' // scope needs to be set on EVERY field for front-end forms. ,'field' => 'upload_order_attch' ,'label' => Add File(s)' ,'description' => 'You can add image files or zip file with all images in it.' ,'add_more' => true ,'options' => array( 'modal_title' => __('Add File(s)', 'piklist-demo') ,'button' => __('Add', 'piklist-demo') ,'basic' => true ) )); -
December 10, 2015 at 11:01 am #5291
hozefasmileMemberHi,
I have tried your code
piklist('field', array( 'type' => 'file' ,'scope' => 'post_meta' // scope needs to be set on EVERY field for front-end forms. ,'field' => 'upload_order_attch' ,'label' => 'Add File(s)' ,'description' => 'You can add image files or zip file with all images in it.' ,'add_more' => true ,'options' => array( 'modal_title' => __('Add File(s)', 'piklist-demo') ,'button' => __('Add', 'piklist-demo') ,'basic' => true ) ));in the order-form.php , but this distort the upload field in the front end. http://uniqueswebsolution.com/clippingc/product/photo-retouching/
cliking plus button doesn’t create the new brows button.My previous code
piklist('field', array( 'type' => 'group' ,'field' => 'upload_order_attch' ,'label' => __('Upload your images') ,'scope' => 'post_meta' ,'columns' => 12 ,'add_more' => true ,'fields' => array( array( 'type' => 'file' ,'field' => 'attch-single' ,'scope' => 'post_meta' ,'label' => __('Add File(s)','piklist') ,'description' => __('You can add image files or zip file with all images in it.','piklist') ,'options' => array( 'basic' => true ) ) ) ) );was showing the add more upload field correctly.
I also want to know how we can callback a already submitted form fields ?
Thanks
Hozefa -
December 17, 2015 at 3:31 am #5366
hozefasmileMemberHi Steve,
Have you reviewed the product page http://uniqueswebsolution.com/clippingc/product/photo-retouching/ ?
Please suggest me what we should do to get correct working upload field and getting array result. And I am really very interested to know how we can callback a already submitted form fields ? because I need to callback it to show the urls on particular order pages.
Thanks
Hozefa -
December 17, 2015 at 1:16 pm #5372
SteveKeymaster@hozefasmile– What I’m seeing on your page is your GROUP code, not what I wrote. Try using the code I wrote on a non-woocommerce page. Does it work?
-
March 8, 2017 at 8:01 pm #7830
hbakerParticipantHozefa, were you ever able to get this sorted out? I am attempting to do the exact same thing. I have everything working except for the form submission on the Order Details (WooCommerce) page. I can’t get it to submit the files from the frontend. When I click the submit button it doesn’t do anything. Almost like there’s an AJAX conflict preventing the form from submitting.
-
February 6, 2018 at 2:06 am #8726
alexanderbiscajinParticipantI am trying the same.
-
February 7, 2018 at 1:06 am #8735
alexanderbiscajinParticipantCan you further explain ?
-
-
AuthorPosts
- You must be logged in to reply to this topic.