Register Register Member Login Member Login Member Login Forgot Password ??
PHP , ASP , ASP.NET, VB.NET, C#, Java , jQuery , Android , iOS , Windows Phone
 

Registered : 109,037

HOME > PHP > PHP Forum > ถามเกี่ยวกับ jquery sortable ครับ ในการจัดลำดับรูปก่อนอัพโหลด



 

ถามเกี่ยวกับ jquery sortable ครับ ในการจัดลำดับรูปก่อนอัพโหลด

 



Topic : 126658



โพสกระทู้ ( 99 )
บทความ ( 0 )



สถานะออฟไลน์




คือว่า ตัวอย่างอยู่นี่ครับ http://jsfiddle.net/36ZwA/

ผมมีปัญหาตรงทำหน้า อัพโหลดไฟล์ที่เลือกครับ แล้วเรียงรูปแล้วให้มันบันทึกไฟล์ 1, 2, 3 ตามลำดับที่เราเรียง


รบกวนกูรูชี้แนะด้วย



Tag : PHP, MySQL, HTML/CSS, JavaScript







Move To Hilight (Stock) 
Send To Friend.Bookmark.
Date : 2017-03-02 16:34:34 By : ฟงหวินขี่เครื่องสูบน้ำท้าลมหนา View : 753 Reply : 3
 

 

No. 1



โพสกระทู้ ( 74,058 )
บทความ ( 838 )

สมาชิกที่ใส่เสื้อไทยครีเอท

สถานะออฟไลน์
Twitter Facebook

มี Code ที่เขียนไว้ไหม๊ครับ






แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2017-03-02 16:52:24 By : mr.win
 


 

No. 2



โพสกระทู้ ( 99 )
บทความ ( 0 )



สถานะออฟไลน์


อันนี้ไฟล์ ฟอร์มอัพโหลดนะครับ

abc.php

Code (PHP)
<!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>Untitled Document</title>
</head>
 <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  <link rel="stylesheet" href="/resources/demos/style.css">
  <style>
  #sortable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
  #sortable li { margin: 0 5px 5px 5px; padding: 5px; font-size: 1.2em; height: 1.5em; }
  html>body #sortable li { height: 1.5em; line-height: 1.2em; }
  .ui-state-highlight { height: 1.5em; line-height: 1.2em; }
   #fileList { list-style-type: none; margin: 0; padding: 0; width: 60%; }
  #fileList li { margin: 0 5px 5px 5px; padding: 5px; font-size: 1.2em; height: 1.5em; }
  html>body #fileList li { height: 1.5em; line-height: 1.2em; }
  .ui-state-highlight { height: 1.5em; line-height: 1.2em; cursor:pointer }
  </style>
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
  <script>
 $(document).ready(function() {
$("#fileList").sortable({
	placeholder: "ui-state-highlight",
    update : function(event, ui) {
        var productOrder = $(this).sortable('toArray').toString();
        $("#sortable-9").text (productOrder);
    }
});
});
  </script>
	<script type="text/javascript">
function makeFileList()
{
	var input = document.getElementById("filUpload");
	var list = document.getElementById('fileList');
	//var sortedIDs = $( ".selector" ).sortable( "toArray" );
	//alert(''+input.files.length);
for (var x = 0; x < input.files.length; x++) {
	var li = document.createElement('li');
	li.setAttribute("id", x);
	li.innerHTML = 'File ' + (x + 1) + ':  '+ (x) +' ' + input.files[x].name;
	list.append(li);
	//$("list").attr('id', x).addClass("ui-state-highlight");
	//alert(''+x);
	}
	$("li").addClass("ui-state-highlight");
}
	</script>
<body>
<form action="check_upload2.php" method="post" enctype="multipart/form-data" name="form1" id="form1">
<input type="file" name="filUpload[]" id="filUpload" multiple="" onChange="makeFileList();" />
<strong>Files You Selected:</strong>
	</p>
	<ul id="fileList">No Files Selected</ul>
  <table width="100%" border="0" cellspacing="1" cellpadding="1">
    <tr>
      <td width="7%">&nbsp;</td>
      <td width="93%">&nbsp;</td>
    </tr>
    <tr>
      <td align="center">&nbsp;</td>
      <td><label>
        <input type="submit" name="btn_upload" id="btn_upload" value=" upload " />
      </label></td>
    </tr>
  </table><h3><span id = 'sortable-9'></span></h3>
</form>
</body>
</html>


ด้านล่างนี้ check_upload2.php

Code (PHP)
<?
include("../config.inc.php");
$txt_size =800;
$orderdate =date("y-m-d");//ใชับันทึกไปเมื่อตั้งกระทูั เพื่อใช้ในการเรียงกระทู้ล่าสุด
$cap_rander= rand(1,2);
$abb=$_POST['abb'];
echo"$abb";
$time = date("His");
$rjpg=".jpg";
$a=count($_FILES['filUpload']['name']);
echo"นับได้ $a";
exit();
for($i=0;$i<count($_FILES["filUpload"]["name"]);$i++)
{

	echo"จำนวนไฟล์ $i<br/>";
	if($_FILES["filUpload"]["name"][$i] != "")
	{
								$images = $_FILES["filUpload"]["tmp_name"][$i];
								$new_images = date("YmdHis$i").$rjpg; //ไม่ใ0ส่ข้อความใหม่ใน ฟันหนู เพื่อให้ชื่อภาพตรงกัน เป็นภาพเดียวกัน $new_images = 
								$size = getimagesize($images);
								if ($size[0] > $txt_size) {
								$width=$txt_size; //*** Fix Width & Heigh (Autu caculate) ***//
								$height=round($width*$size[1]/$size[0]);
								$images_orig = imagecreatefromjpeg($images);
				
								$photoX = imagesx($images_orig); 
								
								$photoY = imagesy($images_orig); 
								
								$images_fin = imagecreatetruecolor($width, $height);
								imagecopyresampled($images_fin, $images_orig, 0, 0, 0, 0, $width+1, $height+1, $photoX, $photoY);								
								imagejpeg($images_fin,"../picture_publish/".$new_images);
								
								imagedestroy($images_orig); 
								
								imagedestroy($images_fin);
											
										} else {
											//list($width, $height) = $size;
											//echo"รูปกว้าง $width สูง $height"; ขนาดน้อยกว่าที่กำหนดไม่ต้องผ่านคำสั่งรีไซด์ ไม่งั้นคุณภาพเสีย
move_uploaded_file($_FILES["filUpload"]["tmp_name"][$i],"../picture_publish/".$new_images);
										}
				
$sql = "INSERT INTO picture_publish";
$sql .="(name_pic, date_pic) values ('".$new_images."','$orderdate')"; // กำหนดคำสั่ง SQL เพื่อเพิ่มข้อมูลแบบคีย์ในคำสั่ง SQL
$dbquery = mysql_db_query($dbname, $sql);
$num_row_loop++;
?>




ปัญหาตอนนี้คือ อัพโหลดไปแล้วไม่เรียงเหมือนที่เราเรียง (ผมใช้คำสั่ง sortable ไม่เป็น และอาจต้องใชการอัพโหลดแบบ Ajax เข้ามาช่วย)

รวบกวนกูรูด้วยนะครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2017-03-02 17:51:25 By : ฟงหวินขี่เครื่องสูบน้ำท้าลมหนา
 

 

No. 3

Guest


ได้แล้วครับ ใช้วิธีอื่นเอา
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2017-03-03 08:52:36 By : ฟงหวิน ขี่เครื่องสูบน้ำ ท้าลมห
 

   

ค้นหาข้อมูล


   
 

แสดงความคิดเห็น
Re : ถามเกี่ยวกับ jquery sortable ครับ ในการจัดลำดับรูปก่อนอัพโหลด
 
 
รายละเอียด
 
ตัวหนา ตัวเอียง ตัวขีดเส้นใต้ ตัวมีขีดกลาง| ตัวเรืองแสง ตัวมีเงา ตัวอักษรวิ่ง| จัดย่อหน้าอิสระ จัดย่อหน้าชิดซ้าย จัดย่อหน้ากึ่งกลาง จัดย่อหน้าชิดขวา| เส้นขวาง| ขนาดตัวอักษร แบบตัวอักษร
ใส่แฟลช ใส่รูป ใส่ไฮเปอร์ลิ้งค์ ใส่อีเมล์ ใส่ลิ้งค์ FTP| ใส่แถวของตาราง ใส่คอลัมน์ตาราง| ตัวยก ตัวห้อย ตัวพิมพ์ดีด| ใส่โค้ด ใส่การอ้างถึงคำพูด| ใส่ลีสต์
smiley for :lol: smiley for :ken: smiley for :D smiley for :) smiley for ;) smiley for :eek: smiley for :geek: smiley for :roll: smiley for :erm: smiley for :cool: smiley for :blank: smiley for :idea: smiley for :ehh: smiley for :aargh: smiley for :evil:
Insert PHP Code
Insert ASP Code
Insert VB.NET Code Insert C#.NET Code Insert JavaScript Code Insert C#.NET Code
Insert Java Code
Insert Android Code
Insert Objective-C Code
Insert XML Code
Insert SQL Code
Insert Code
เพื่อความเรียบร้อยของข้อความ ควรจัดรูปแบบให้พอดีกับขนาดของหน้าจอ เพื่อง่ายต่อการอ่านและสบายตา และตรวจสอบภาษาไทยให้ถูกต้อง

อัพโหลดแทรกรูปภาพ

Notice

เพื่อความปลอดภัยของเว็บบอร์ด ไม่อนุญาติให้แทรก แท็ก [img]....[/img] โดยการอัพโหลดไฟล์รูปจากที่อื่น เช่นเว็บไซต์ ฟรีอัพโหลดต่าง ๆ
อัพโหลดแทรกรูปภาพ ให้ใช้บริการอัพโหลดไฟล์ของไทยครีเอท และตัดรูปภาพให้พอดีกับสกรีน เพื่อความโหลดเร็วและไฟล์ไม่ถูกลบทิ้ง

   
  เพื่อความปลอดภัยและการตรวจสอบ กระทู้ที่แทรกไฟล์อัพโหลดไฟล์จากที่อื่น อาจจะถูกลบทิ้ง
 
โดย
อีเมล์
บวกค่าให้ถูก
<= ตัวเลขฮินดูอารบิก เช่น 123 (หรือล็อกอินเข้าระบบสมาชิกเพื่อไม่ต้องกรอก)







Exchange: นำเข้าสินค้าจากจีน, Taobao, เฟอร์นิเจอร์, ของพรีเมี่ยม, ร่ม, ปากกา, power bank, แฟลชไดร์ฟ, กระบอกน้ำ

Load balance : Server 02
ThaiCreate.Com Logo
© www.ThaiCreate.Com. 2003-2024 All Rights Reserved.
ไทยครีเอทบริการ จัดทำดูแลแก้ไข Web Application ทุกรูปแบบ (PHP, .Net Application, VB.Net, C#)
[Conditions Privacy Statement] ติดต่อโฆษณา 081-987-6107 อัตราราคา คลิกที่นี่