เมื่อเรา choose file แล้ว ไฟล์รูปจะขึ้นมาตรงนี้ โค้ดเขียนยังไงคะ

สำหรับผู้ที่ เริ่มต้น Programming - PHP มีอะไร แนะนำ หรือข้อสงสัยต้องบอร์ด นี้ คนที่มีความรู้ แบ่งปันคนอื่นบ้างนะ ปัญหาการเขียนโปรแกรม แบบ OOP Session Cookies php network

Moderator: mindphp, ผู้ดูแลกระดาน

hayatee
PHP Super Hero Member
PHP Super Hero Member
โพสต์: 670
ลงทะเบียนเมื่อ: 19/04/2021 10:01 am

เมื่อเรา choose file แล้ว ไฟล์รูปจะขึ้นมาตรงนี้ โค้ดเขียนยังไงคะ

โพสต์ที่ยังไม่ได้อ่าน โดย hayatee »

Programming - PHP-1.png
ตัวอย่างไฟล์ที่แสดงเมื่อ choose file ไฟล์


โค้ด: เลือกทั้งหมด

<form id="upload" method="post" action="upload.php" enctype="multipart/form-data">
			<div id="drop">
				Drop Here

				<a>Browse</a>
				<input type="file" name="upl" multiple />
			</div>
</form>

โค้ด: เลือกทั้งหมด

<?php

// A list of permitted file extensions
$allowed = array('png', 'jpg', 'gif','zip');

if(isset($_FILES['upl']) && $_FILES['upl']['error'] == 0){

	$extension = pathinfo($_FILES['upl']['name'], PATHINFO_EXTENSION);

	if(!in_array(strtolower($extension), $allowed)){
		echo '{"status":"error"}';
		exit;
	}

	if(move_uploaded_file($_FILES['upl']['tmp_name'], 'uploads/'.$_FILES['upl']['name'])){
		echo '{"status":"success"}';
		exit;
	}
}

echo '{"status":"error"}';
exit;
ภาพประจำตัวสมาชิก
eange08
PHP VIP Members
PHP VIP Members
โพสต์: 16184
ลงทะเบียนเมื่อ: 22/12/2020 10:09 am

Re: เมื่อเรา choose file แล้ว ไฟล์รูปจะขึ้นมาตรงนี้ โค้ดเขียนยังไงคะ

โพสต์ที่ยังไม่ได้อ่าน โดย eange08 »

ส่วนที่หน้า upload ให้ทำรูปแบบที่เราจะแสดงเอาไว้ก่อน แล้วส่วนที่เราต้องการแสดงรูปภาพให้ระบุ class เอาไว้เพื่อให้ jquery ชี้ไปแสดงรูปภาพได้
ส่วนหน้าฟอร์ม choose file

โค้ด: เลือกทั้งหมด

<template id="crop_template" >    
     <div class="row_3 clearfix" style="height: 100%;">
         <div class="row" style="margin-left:0.4em; ">
             <div class="col-md-6 cropbe4" >
                        <div class="crop_img">
                            <img src="uploads/dummy.jpg" style="width: 100%;"><!---ให้ใส่รูปพื้นฐานไว้ก่อน-->
                        </div>
                        <div class="crop_nm"></div><!--แสดงชื่อรูป-->
                    </div>
                    </div>
         </div> 
 </template>
ไฟล์ script.js

โค้ด: เลือกทั้งหมด

$('.crop_working').append($('#crop_template').html());
                var tpl = $('.crop_working .cropbe4:last');               
                $(tpl).find('.crop_img img').attr('src', 'uploads/before/' + data.files[0].name); <!--uploads/before/ ใส่ path file ที่เราเก็บรูป--> 
ภาพประจำตัวสมาชิก
eange08
PHP VIP Members
PHP VIP Members
โพสต์: 16184
ลงทะเบียนเมื่อ: 22/12/2020 10:09 am

Re: เมื่อเรา choose file แล้ว ไฟล์รูปจะขึ้นมาตรงนี้ โค้ดเขียนยังไงคะ

โพสต์ที่ยังไม่ได้อ่าน โดย eange08 »

รวม Plugin ของ Jquery สำหรับ upload รูปแล้วแสดงรูปภาพ
https://www.jqueryscript.net/tags.php?/uploader/

มี Demo ให้เราได้ลองเล่นและเอามาประยุกต์กับงานเราได้นะคะ
ตอบกลับโพส
  • Similar Topics
    ตอบกลับ
    แสดง
    โพสต์ล่าสุด

ผู้ใช้งานขณะนี้

สมาชิกกำลังดูบอร์ดนี้: Bing [Bot] และบุคลทั่วไป 108