###問題question
「Anspress」というプラグインのuser投稿フォームにMedia uploeaderを作成しました。ここで画像選択およびアップロードはできるものの、その値が投稿した記事に保存されません。
下記 functions.php が問題で、それ以外(upload.jsとanslist.php)は大丈夫だと思います。
I am using 「Anspress」.
With this code I can upload the image but can not save it.
The problem is 【functions.php】 part.
###コードCode
▼【functions.php】
php
1// Select image 2function my_media_script(){ 3 wp_enqueue_media(); 4} 5add_action( 'wp_enqueue_scripts', 'my_media_script' ); 6 7// Media uploeader@Anspress askform 8function my_custom_question_field( $form ) { 9$form['fields']['image'] = array( 10 'html' => '<div class="select-img"></div> 11 <div method="post"> 12 <div class="image-upload-wrap"> 13 <div class="image-preview-wrapper"> 14 <img id="image-preview-1" src="http://sample.com/wp-content/uploads/2018/08/first-img.jpg"> 15 </div> 16 <input name="" id="upload_image_button-1" type="button" class="button upload_image_button" value="画像を選ぶ"> 17 <input type="hidden" name="image1" id="image_attachment_id-1" value=""> 18 </div> 19 </div>', 20); 21return $form; 22} 23add_filter( 'ap_question_form_fields', 'my_custom_question_field' ); 24 25// Save 26function question_mysave( $post_id, $post ) { 27global $validate; 28if ( empty( $validate ) ) { 29return; 30} 31$fields = $validate->get_sanitized_fields(); 32 33update_post_meta( $post_id, 'image', $fields['image'] ); 34} 35add_action( 'ap_processed_new_question', array( $this, 'question_mysave' ), 0, 2 ); 36add_action( 'ap_processed_update_question', array( $this, 'question_mysave' ), 0, 2 );
▼【upload.js】
javascript
1jQuery( document ).ready( function( $ ) { 2 // Uploading files 3 var file_frame; 4 var wp_media_post_id = wp.media.model.settings.post.id; // Store the old id 5 var set_to_post_id = '<?php echo $my_saved_attachment_post_id; ?>'; // Set this 6 jQuery('.upload_image_button').on('click', function( event ){ 7 event.preventDefault(); 8 // If the media frame already exists, reopen it. 9 10 btn_id = $(this).attr('id'); 11 btn_no = btn_id.replace('upload_image_button-' , ''); 12 13 if ( file_frame ) { 14 // Set the post ID to what we want 15 //file_frame.uploader.uploader.param( 'post_id', set_to_post_id ); 16 // Open frame 17 file_frame.open(); 18 return; 19 } else { 20 // Set the wp.media post id so the uploader grabs the ID we want when initialised 21 //wp.media.model.settings.post.id = set_to_post_id; 22 } 23 // Create the media frame. 24 file_frame = wp.media.frames.file_frame = wp.media({ 25 title: 'Select a image to upload', 26 button: { 27 text: 'Use this image', 28 }, 29 multiple: false // Set to true to allow multiple files to be selected 30 }); 31 // When an image is selected, run a callback. 32 file_frame.on( 'select', function() { 33 // We set multiple to false so only get one image from the uploader 34 attachment = file_frame.state().get('selection').first().toJSON(); 35 // Do something with attachment.id and/or attachment.url here 36 $( '#image-preview-'+btn_no ).attr( 'src', attachment.sizes.thumbnail.url ).css( 'width', 100 ); 37 $( '#image_attachment_id-'+btn_no ).val( attachment.id ); 38 // Restore the main post ID 39 //wp.media.model.settings.post.id = wp_media_post_id; 40 }); 41 // Finally, open the modal 42 file_frame.open(); 43 }); 44 45 // Restore the main ID when the add media button is pressed 46 jQuery( 'a.add_media' ).on( 'click', function() { 47 //wp.media.model.settings.post.id = wp_media_post_id; 48 }); 49 50}); 51
▼【anslist.php】
php
1<figure> 2 <?php 3 $imageid = get_post_meta($post->ID, 'image1', true); 4 $url = wp_get_attachment_url( $imageid ); 5 echo '<img src="'.$url.'" alt="">'; 6 ?> 7</figure>
###参考
プラグインページ
https://ja.wordpress.org/plugins/anspress-question-answer/
この問題について示されたページ
https://anspress.io/resources/faq/anspress-form-and-validation-api/
回答1件
あなたの回答
tips
プレビュー