ยินดีต้อนรับคุณ, บุคคลทั่วไป กรุณา เข้าสู่ระบบ หรือ ลงทะเบียน

เข้าสู่ระบบด้วยชื่อผู้ใช้ รหัสผ่าน และระยะเวลาในเซสชั่น

ThaiSEOBoard.comพัฒนาเว็บไซต์Programmingjquery upload ที่แสดงสถานะการอัพโหลดรูป เค้าทำกันยังไงหรอครับ?
หน้า: [1]   ลงล่าง
พิมพ์
ผู้เขียน หัวข้อ: jquery upload ที่แสดงสถานะการอัพโหลดรูป เค้าทำกันยังไงหรอครับ?  (อ่าน 2091 ครั้ง)
0 สมาชิก และ 1 บุคคลทั่วไป กำลังดูหัวข้อนี้
fogza
หัวหน้าแก๊งเสียว
*

พลังน้ำใจ: 97
ออฟไลน์ ออฟไลน์

กระทู้: 1,307



ดูรายละเอียด
« เมื่อ: 14 มกราคม 2012, 19:46:45 »

ที่ผมทำอยู่ มีปุ่ม เพิ่ม, ลบ element อยู่ แต่อยากให้มีแสดงสถานะการอัพโหลดเป็น % ด้วยนะครับ การทำงานประมาณนี้ครับ


1. เวลามีการเลือกรูปเข้ามา จะทำการอัพโหลดรูปอัตโนมัติ และมีการแสดงสถานะของแต่ละ element นะครับ
2. มีปุ่มกดยกเลิกการอัพโหลดแต่ละ element
3. เวลาอัพโหลดเสร็จก็แสดงข้อความว่า "เสร็จสิ้น" แล้วการทำงานข้อ(2) ก็หายไปครับ

ประมาณนี้นะครับ รบกวนขอแนวทาง หรือคำแนะนำด้วยครับ ว่าต้องไปศึกษาอะไรยังไงบ้างครับ

ด้านล่างนี้เป็นโค้ดที่เห็นตามรูปด้านบนนะครับ
โค๊ด:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Add Del Element</title>
 
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript">

$(document).ready(function() {
$('#add_more').click(function(){
//var current_count = $('input[type="text"]').length;
//var next_count = current_count   1;
$('#new_text').append('<p>'
     '<input name="problem[]" type="file" class="new_project_text" />'
     '<input type="button" id="remove_text" value="-" />'
     '</p>');
});

$('#remove_text').live('click', function(){
$(this).parent().remove();

return false;
});


$('#ok').click(function(){
        $.get(
              'subElement.php',
              $('#form1').serialize(),
              function(data){
                $('.viewData').html(data);
              },
              'html'
              );
        return false;
    });


});

</script>
</head>
 
<body>
<div class="test"></div>
<form id="form1" enctype="multipart/form-data" action="" method="GET">

<p id="new_text">
id บริเวณ:<br />
<input name="idProblem" type="text" sieze="20" /><br /><br />
บริเวณปัญหา:<br />
<input name="problem[]" type="file" sieze="20" /><a href="#" id="add_more">เพิ่ม</a>
</p>
<p>
<input id="ok" type="submit" value="Upload" />
</p>
</form>

ข้อมูลที่ถูกส่งมาจาก Sever:<div class="viewData"></div>

</body>
</html>
รบกวนด้วยนะครับ ขอบคุณครับ  wanwan017
บันทึกการเข้า

:: สังคมจะดีได้ อยู่ที่เราทุกคน ไม่ใช่แค่ใครคนใดคนหนึ่ง ::
marus
ก๊วนเสียว
*

พลังน้ำใจ: 41
ออฟไลน์ ออฟไลน์

กระทู้: 467



ดูรายละเอียด
« ตอบ #1 เมื่อ: 14 มกราคม 2012, 22:32:09 »

เคยใช้ SWF upload ทำได้ทุกอย่างตามที่บอก
บันทึกการเข้า
rokaisakkon
ก๊วนเสียว
*

พลังน้ำใจ: 38
ออฟไลน์ ออฟไลน์

กระทู้: 459



ดูรายละเอียด
« ตอบ #2 เมื่อ: 14 มกราคม 2012, 23:17:24 »

เปอเซนต์ นี่ ผมว่าต้องเทพมากเลย หรืออาจทำไม่ได้  เดาเอานะครับ

แต่ที่ผมทำได้ ก็  submit form แบบไม่เปลี่ยน หน้า มันจะได้ผลลัพ คล้าย ๆ ที่คุณต้องการ
บันทึกการเข้า

#วงการฟรีแลนซ์มันโหดน่ะครับ
mean
หัวหน้าแก๊งเสียว
*

พลังน้ำใจ: 121
ออฟไลน์ ออฟไลน์

กระทู้: 1,009



ดูรายละเอียด เว็บไซต์
« ตอบ #3 เมื่อ: 15 มกราคม 2012, 00:12:51 »

ค้นหา jquery progress bar ครับ
หรือจริงๆ เค๊าเรียก upload with progress bar
สมัยก่อนผมก็หาแท๊ปตายเหมือนกัน ^^ ไม่รู้เค๊าเรียกอะไร
บันทึกการเข้า

New2th
Verified Seller
สมุนแก๊งเสียว
*

พลังน้ำใจ: 136
ออฟไลน์ ออฟไลน์

กระทู้: 841



ดูรายละเอียด
_
« ตอบ #4 เมื่อ: 15 มกราคม 2012, 00:18:48 »

 wanwan008
« แก้ไขครั้งสุดท้าย: 28 มิถุนายน 2017, 20:49:54 โดย New2th » บันทึกการเข้า
fogza
หัวหน้าแก๊งเสียว
*

พลังน้ำใจ: 97
ออฟไลน์ ออฟไลน์

กระทู้: 1,307



ดูรายละเอียด
« ตอบ #5 เมื่อ: 15 มกราคม 2012, 02:32:58 »

เคยใช้ SWF upload ทำได้ทุกอย่างตามที่บอก
ผมไล่ๆ หาดู ก็เห็นคล้ายๆ แบบนี้ครับ แต่ยังงง ๆ กับโค้ดอยู่
ตอนได้ก็ได้แต่้ เพิ่ม ลบ element ต่างๆ อย่างเดียว ท่านใดพอได้บ้าง ก็ช่วยสงเคราะห์กันหน่อยนะครับ  Tongue
* element ที่เป็นแบบอาเรย์ใน php อย่างเช่นผมประกาศ
<input name="problem[]" type="file" sieze="20" />
หลังจากกด submit มีการ return value มาเรียบร้อย จะให้มันลบอาเรย์ตำแหน่งอื่นๆ ที่กดเพิ่มขึ้นมายังไงครับ ให้เหลือแค่ problem[] อันเดียวในรูปด้านบนนะครับ
บันทึกการเข้า

:: สังคมจะดีได้ อยู่ที่เราทุกคน ไม่ใช่แค่ใครคนใดคนหนึ่ง ::
EntServ
หัวหน้าแก๊งเสียว
*

พลังน้ำใจ: 367
ออฟไลน์ ออฟไลน์

กระทู้: 1,366



ดูรายละเอียด
« ตอบ #6 เมื่อ: 16 มกราคม 2012, 17:24:39 »

รู้สึกจะมีplugins สำหรับการอัพโหลดโดยเฉพาะอยู่

Uploadfy มั้ง จำชื่อไม่ค่อยได้
บันทึกการเข้า

รับทำระบบ Streaming Server อยากได้เว็บสตรีมมิ่งหล่อๆ ติดต่อ PM ครับ
หน้า: [1]   ขึ้นบน
พิมพ์