表单提交后形成数据和图像预览 [英] Form data and image preview after form submit
问题描述
我使用wordpress cms，我需要一个自定义形式的帮助。它允许用户从前端发帖。有几个字段和一个图片上传字段。这是一个两部分的形式，第一部分是他提交数据的位置，第二步是他刚刚提交的数据预览。请记住在提交后发生。。 FORM CODE： 问题：在最后一步，我目前的代码能够显示所有提交的数据以及图像名称，但不是图像。我想此时显示图片。基本上，我需要最后一步成为预览页面。 下面给出的代码处理表单，我想特别注意特定部分的代码有助于插入附件，因为它可以帮助设计一个解决方案。 表格处理器： 脚注：除了问题，代码已经大量定制，并且在我的wp-install上运行良好。所以，请忽略代码中的次要因素，例如。验证，安全性等。 因为我需要在提交表单后进行预览，所以解决方案比我想象的要容易，尤其是当我已经在代码中分配并声明了附件标识 请点击链接阅读更多关于 wp_get_attachment_image 。希望它能帮助别人。 I use wordpress cms and I need help with a custom made form. It allow users to post from front-end. There are a couple of fields and a image upload field. It is a two part form where the first part is where he submits data and second step where he gets a preview of data he just submitted. Please remember that this happens after the submit. FORM CODE : ISSUE : In the last step, my current code is able to display all submitted data along with the image name, but NOT the image. I would like to display the image at this point. Basically, I need the last step to be sort of a preview-page. Code given below processes the form and I would like to pull your attention particularly to the specific part of the code which helps insert attachments, as it may help devise a solution. FORM PROCESSOR : Footnote : Other than the issue the code has been heavily customized and works well on my wp-install. So, please ignore secondary factors in the code eg. validations, security etc. Since I needed a preview after the form submit the solution was relatively easier than I thought, especially when I already had the attachment id Follow the link to read more about wp_get_attachment_image. Hope it helps someone. 这篇关于表单提交后形成数据和图像预览的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
<？php
global $ wpdb;
$ this_page = $ _SERVER ['REQUEST_URI'];
$ page = $ _POST ['page'];
if（$ page == NULL）{？>
< form method =postaction =>
< div>位置：< input type =textname =location/>< / div>
< div>描述：< textarea id =detailscols =80rows =10 maxlength =600name =detailsrows =20>< / textarea>< / div>
< div> UPLOAD IMAGE：< input type =filename =loc-imageid =loc-imagetabindex =25 />< / div>
< input type =hiddenvalue =1name =page/>
< input type = hiddenname =actionvalue =post_action/>
< / form>
<？php
} else if（$ page == 1）{？>
<？php
$ location = $ _POST ['location'];
$ description = $ _ POST ['details'];
$ photo = $ _ POST ['loc-image'];
echo'Location ：'。$ location。'< / br>';
echo'详情：'。$ description。'< / br>';
echo'图片：'。$ photo。'< ; / b>< / br>';
？>
<？php
}
？>
if（'POST'== $ _SERVER ['REQUEST_METHOD']&& $ _POST ['action'] ==post_action）{
//在这里完成一些错误检查
// set vars
$ location = $ _POST ['location'];
$ description = $ _POST ['details'];
$ b if（empty（$ error））{
$ new_post = array（//插入表单输入，设置var和定义数组
'post_title'=> ; $ b $ post_type'=>'post'，
/ $'$' /分配标签和分类不成问题
）;
$ pid = wp_insert_post（$ new_post）;
//附件助手函数
函数insert_attachment（$ file_handler，$ post_id，$ setthumb ='false'）{
if（$ _FILES [$ file_handler] ['error']！== UPLOAD_ERR_OK）{return __return_false（）;
}
require_once（ABSPATH。wp-admin。'/includes/image.php'）;
require_once（ABSPATH。wp-admin。'/includes/file.php'）;
require_once（ABSPATH。wp-admin。'/includes/media.php'）;
$ attach_id = media_handle_upload（$ file_handler，$ post_id）;
//设置发布缩略图
if（$ setthumb）update_post_meta（$ post_id，'_ thumbnail_id'，$ attach_id）;
返回$ attach_id;
$ b //插入我们的媒体附件
if（$ _FILES）{
foreach（$ _FILES as $ file => $ array） {
$ newupload = insert_attachment（$ file，$ pid）;
// $ newupload返回
//刚刚上传的文件的附件标识。现在就做任何你想做的事。
}
} //附件结束语句
}
}
$ newupload 。所以我完全去了WordPress的路线，并使用下面的代码来调用图像，它的作用像魅力。
<？php echo wp_get_attachment_image（$ newupload，'medium'）; ？>
<?php
global $wpdb;
$this_page = $_SERVER['REQUEST_URI'];
$page = $_POST['page'];
if ( $page == NULL ) { ?>
<form method="post" action="">
<div>LOCATION : <input type="text" name="location"/></div>
<div>DESCRIPTION : <textarea id="details" cols="80" rows="10 maxlength="600" name="details" rows="20"></textarea></div>
<div>UPLOAD IMAGE : <input type="file" name="loc-image" id="loc-image" tabindex="25" /></div>
<input type="hidden" value="1" name="page" />
<input type="hidden" name="action" value="post_action" />
<input type="submit" name="submit" value="PROCEED"/>
</form>
<?php
} else if ( $page == 1 ) { ?>
<?php
$location=$_POST['location'];
$description=$_POST['details'];
$photo=$_POST['loc-image'];
echo 'Location : ' . $location . '</br>';
echo 'Details : ' . $description . '</br>';
echo 'Image : ' . $photo . '</br></br>';
?>
<?php
}
?>
if( 'POST' == $_SERVER['REQUEST_METHOD'] && $_POST['action'] == "post_action") {
//some error checking done here
//set vars
$location = $_POST['location'];
$description = $_POST['details'];
if (empty($error)) {
$new_post = array( //insert form inputs, set var and define array
'post_title' => $location,
'post_content' => $description,
'post_status' => 'draft',
'post_type' => 'post',
// assigning tags and categoris is no issue
);
$pid = wp_insert_post($new_post);
//attachment helper function
function insert_attachment($file_handler,$post_id,$setthumb='false') {
if ($_FILES[$file_handler]['error'] !== UPLOAD_ERR_OK){ return __return_false();
}
require_once(ABSPATH . "wp-admin" . '/includes/image.php');
require_once(ABSPATH . "wp-admin" . '/includes/file.php');
require_once(ABSPATH . "wp-admin" . '/includes/media.php');
$attach_id = media_handle_upload( $file_handler, $post_id );
//set post thumbnail
if ($setthumb) update_post_meta($post_id,'_thumbnail_id',$attach_id);
return $attach_id;
}
//INSERT OUR MEDIA ATTACHMENTS
if ($_FILES) {
foreach ($_FILES as $file => $array) {
$newupload = insert_attachment($file,$pid);
// $newupload returns the attachment id of the file that
// was just uploaded. Do whatever you want with that now.
}
} // end of attachment statement
}
}
$newupload assigned and declared in the code. So I completely went the wordpress route and used the code below to call the image, which works like charm. <?php echo wp_get_attachment_image( $newupload,'medium' ); ?>
