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

Registered : 107,936

HOME > PHP > PHP Forum > การส่งค่า ID ของคอลัม ไปยัง Modal เพื่อโชว์ข้อมูลจาก Database เฉพาะตัวที่เลือก



 

การส่งค่า ID ของคอลัม ไปยัง Modal เพื่อโชว์ข้อมูลจาก Database เฉพาะตัวที่เลือก

 



Topic : 134039



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



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




Code (PHP)
<!doctype html>
<html lang="en">
<head>
<title>calculate number</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0/js/bootstrap.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
</head>
<body>
<?php
  include_once('php/connect.php');  
  $sql = "SELECT *
  FROM [status]";
  $query = sqlsrv_query($conn, $sql);
  while($result = sqlsrv_fetch_array($query)){
?>
  <table>
    <tr>
      <td style=" vertical-align: middle;"><div align="center"><?=$result["name_status"];?></div></td>
      <td style=" vertical-align: middle;">
        <a data-toggle="modal"  href="#detail_req"><?=$result["id_status"];?></a>
      </td>
        <!-- Modal -->
        <div class="modal fade"  id="detail_req">
          <div class="modal-dialog">
            <div class="modal-content">
              <div class="modal-header">
                <h4 class="modal-title"><?=$result["name_status"];?></h4>
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
              </div>
              <div class="modal-body">
                <div class="row">
                  <div class="col-lg-6" align="right">รหัส Status : </div>
                  <div class="col-lg-6" ><?=$result["id_status"];?></div>
                </div>
              </div>
              <div class="modal-body">
                <div class="row">
                  <div class="col-lg-6" align="right">ชื่อ Status : </div>
                  <div class="col-lg-6" ><?=$result["name_status"];?></div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <!-- End Modal -->
    </tr>
  <?php
  }
  ?>
  </table>
 </body>
</html>


จาก Code พอผมรันแล้วจะได้แบบนี้
Modal1

ปัญหาคือไม่ว่าผมจะ Click เลขอะไรมันก็จะขึ้นแค่ข้อมูล อันแรกเ่ทานั้น ตามภาพล่าง
modal2

ผมต้องเพิ่มอะไรเข้าไปเพื่อให้มัน โชว์เฉพาะข้อมูลที่ผมคลิกเท่านั้น ขอบพระคุณครับ



Tag : PHP







Move To Hilight (Stock) 
Send To Friend.Bookmark.
Date : 2019-08-17 15:05:35 By : yutthanagorn View : 135 Reply : 6
 

 

No. 1



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

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

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

ผมว่าคำถามนี้ เป็น hit of the year เลยนะ
js มัน duplicate id กันไม่ได้ครับ อันนี้คำทำเว็บควรจะรู้หรือรับทราบเอาไว้ครับ
Code (PHP)
$key=0;
while(xx){
?>
<div class="modal fade"  id="detail_req_<?=$key?>">
........
<?php
$key++;
}









ประวัติการแก้ไข
2019-08-17 20:38:12
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2019-08-17 20:35:06 By : mongkon.k
 


 

No. 2



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



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


ตอบความคิดเห็นที่ : 1 เขียนโดย : mongkon.k เมื่อวันที่ 2019-08-17 20:35:06
รายละเอียดของการตอบ ::
ผมลองใส่ code ตามที่พี่บอกไว้แล้วครับ มันไม่ได้ครับ พอกดแล้วมันไม่ขึ้นอะไรเลย
....................................................................
มันพอมีวิธีไหมครับผมเห็นบางเว็บเค้าทำได้ เลยจะลองเอามาทำบ้าง
ขอบพระคุณครับ

แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2019-08-18 19:20:21 By : yutthanagorn
 

 

No. 3



โพสกระทู้ ( 7,977 )
บทความ ( 2 )



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


เอา javascript ที่ทำงานกับ event click มาด้วยสิครับ มันอ้างอิงตรงนั้นผิด
ผิดยังไงจะได้บอก แต่ถ้าจะเอาตัวอย่าง มันก็คืออันที่คุณเอามาประยุกต์แบบผิดๆ นั่นแหล่ะ

ส่วนการใช้ id ถ้าอยู่บนระนาบเดียวกัน มันก็จะ ได้ เฉพาะ อันแรก เท่านั้น
มันต้องใชัประกอบกันส่วนอื่นๆ อีกต้องอ่านเยอะๆ ทำความเข้าใจกับ id class tag ให้มากกว่านี้

id มันเป็นอะไรที่ใช้เฉพาะที่ แต่มันก็น สามารถใช้ id เดียวกัน แต่ต้องอยู่คนละระดับได้ เวลาเรียกใช้ต้องมี parent ครอบอีกที
Code (PHP)
<html>
<head>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"
		integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
		crossorigin="anonymous"></script>
</head>
<body>
<div class="abc" data-test="1">
   <div id="xyz">1111</div>
</div>
<div class="abc" data-test="2">
   <div id="xyz">2222</div>
</div>
<div class="abc" data-test="3">
   <div id="xyz">3333</div>
</div>
</body>
<script>
$(document).ready(()=>{
	$('.abc').click(function(){
		alert($(this).find('#xyz').html());
	});
});
</script>
</html>

แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2019-08-18 20:13:31 By : Chaidhanan
 


 

No. 4



โพสกระทู้ ( 3,546 )
บทความ ( 8 )



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


ตอบความคิดเห็นที่ : 3 เขียนโดย : Chaidhanan เมื่อวันที่ 2019-08-18 20:13:31
รายละเอียดของการตอบ ::
id เป็นเอกลักษณ์ ได้เฉพาะอันเดียวจากทั้งหน้าครับ ซ้ำกันไม่ได้
https://validator.w3.org/nu/#textarea ตัวอย่างส่งตรวจจะขึ้น id duplicate error

https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id
Quote:
The id global attribute defines an identifier (ID) which must be unique in the whole document.


ถ้าจะใช้ซ้ำๆ ใช้ class ดีกว่า แล้วถ้าจะ class ซ้ำแต่จะเจาะจง จึงค่อยเรียกไล่ลำดับ เช่น .parent1 .class, .parent2 .class



ประวัติการแก้ไข
2019-08-19 03:21:05
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2019-08-19 03:20:12 By : mr.v
 


 

No. 5



โพสกระทู้ ( 7,977 )
บทความ ( 2 )



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


ตอบความคิดเห็นที่ : 4 เขียนโดย : mr.v เมื่อวันที่ 2019-08-19 03:20:12
รายละเอียดของการตอบ ::
ถ้าใช้ DOM ก็ตามนั้นน่ะครับ

ผมบอกว่า แค่สามารถ ใช้ id เหมือนกันได้ แต่ต้องมี parent คุม
ถ้าใช้ jquery ซ้ำได้แต่ต้อง มี parent คุม เป็นการเล่นแร่แปรธาตุเอาอ่ะครับ


เน้นครับ เฉพาะ jquery บังเอิญไม่ได้เน้นเอาไว้
ก็ให้เขาทำความเข้าใจ กับ id class tag เพิ่มขึ้น


ประวัติการแก้ไข
2019-08-20 07:49:51
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2019-08-19 08:23:47 By : Chaidhanan
 


 

No. 6



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

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

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

ตอบความคิดเห็นที่ : 2 เขียนโดย : yutthanagorn เมื่อวันที่ 2019-08-18 19:20:21
รายละเอียดของการตอบ ::
วิธีที่ถามหา ก็วิธีนี้หล่ะครับ ถ้าแนะนำอีกแบบจะ advance เลย จะงงไปกันใหญ่
บรรทัดที่ 23 ไม่ได้แก้ตามครับมันเลยไม่ขึ้น

Code (PHP)
<!doctype html>
<html lang="en">
<head>
<title>calculate number</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0/js/bootstrap.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
</head>
<body>
<?php
  include_once('php/connect.php');  
  $sql = "SELECT *
  FROM [status]";
  $query = sqlsrv_query($conn, $sql);
  $key=0;
  while($result = sqlsrv_fetch_array($query)){
?>
  <table>
    <tr>
      <td style=" vertical-align: middle;"><div align="center"><?=$result["name_status"];?></div></td>
      <td style=" vertical-align: middle;">
        <a data-toggle="modal" data-target="#detail_req_<?=$key?>" href="#"><?=$result["id_status"];?></a>
      </td>
        <!-- Modal -->
        <div class="modal fade"  id="detail_req_<?=$key?>">
          <div class="modal-dialog">
            <div class="modal-content">
              <div class="modal-header">
                <h4 class="modal-title"><?=$result["name_status"];?></h4>
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
              </div>
              <div class="modal-body">
                <div class="row">
                  <div class="col-lg-6" align="right">รหัส Status : </div>
                  <div class="col-lg-6" ><?=$result["id_status"];?></div>
                </div>
              </div>
              <div class="modal-body">
                <div class="row">
                  <div class="col-lg-6" align="right">ชื่อ Status : </div>
                  <div class="col-lg-6" ><?=$result["name_status"];?></div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <!-- End Modal -->
    </tr>
  <?php
  $key++;
  }
  ?>
  </table>
 </body>
</html>



หวังว่าจะเข้าใจนะครับ มันเป็นเรื่องเบสิกที่ต้องรู้จริงๆ


ประวัติการแก้ไข
2019-08-20 10:08:38
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2019-08-20 10:07:33 By : mongkon.k
 

   

ค้นหาข้อมูล


   
 

แสดงความคิดเห็น
Re : การส่งค่า ID ของคอลัม ไปยัง Modal เพื่อโชว์ข้อมูลจาก Database เฉพาะตัวที่เลือก
 
 
รายละเอียด
 
ตัวหนา ตัวเอียง ตัวขีดเส้นใต้ ตัวมีขีดกลาง| ตัวเรืองแสง ตัวมีเงา ตัวอักษรวิ่ง| จัดย่อหน้าอิสระ จัดย่อหน้าชิดซ้าย จัดย่อหน้ากึ่งกลาง จัดย่อหน้าชิดขวา| เส้นขวาง| ขนาดตัวอักษร แบบตัวอักษร
ใส่แฟลช ใส่รูป ใส่ไฮเปอร์ลิ้งค์ ใส่อีเมล์ ใส่ลิ้งค์ 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: Voake, Comcube, รับทำเว็บไซต์ รับเขียนโปรแกรม

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