 |
[PHP]
สอบถามการใช้ sweetalert+func เรื่อง confirmalert รบกวนผู้รู้ด้วยนะครับ |
|
 |
|
|
 |
 |
|
Code (JavaScript)
01. <script>
02. function confirmalert() {
03. document.querySelector( '#form' ).addEventListener( 'submit' , function (e) {
04. var form = this ;
05.
06. e.preventDefault();
07.
08. swal({
09. title: "" ,
10. text: "ตรวจสอบข้อมูลให้ถูกต้อง ?" ,
11. icon: "warning" ,
12. buttons: [
13. 'ยกเลิก' ,
14. 'บันทึก'
15. ],
16. dangerMode: true ,
17. }).then( function (isConfirm) {
18. if (isConfirm) {
19. form.submit();
20. } else {
21. swal( "ยกเลิกการบันทึก !" , "กลับสู่หน้าแก้ไข" , "error" );
22. }
23. })
24. });
25. }
26. </script>
พอดีใชเโค้ดตัวนี้อยู่ครับ ใช่สำหรับปุ่มแบบformไปอีกหน้า
แต่ผมอยากให้มันใช่กับปุ่มแบบรูปภาพ คลิกปุ่มแล้วแสดงเลือก

แบบนี้ครับ มันใช้ได้แค่กับปุ่ม submit
เลยอยากได้แบบภาพครับ
พอเอาโค้ดนี้ไปใช้รวมกันแล้วมันไม่เบรกให้อยู่หน้าเลือก
อยากทราบว่าพอใชเfunctionตัวไหนได้บ้างครับ หรือมีโค้ดแนะนำบอกด้วยนะครับ
Tag : PHP, JavaScript, Action Script, jQuery
|
|
 |
 |
 |
 |
Date :
2018-09-19 08:05:42 |
By :
benzkung53 |
View :
10187 |
Reply :
11 |
|
 |
 |
 |
 |
|
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
if (isConfirm.value) { ควรอ้างอิง .value ให้เคยชิน อาจมีผลกับการทำงาน ได้
ลองใช้เครื่องมือ debug ดูครับว่ามันหลุดตรงไหน swal code ก็โอเคอยู่ครับ
ปล. ใช้ jquery หรือเปล่าครับ ถ้าใช้ jqueryอยู่ ก็เปลี่ยนโค๊ดไปใช้ jquery ดีกว่าครับ
อย่าเขียน pure javascript เลยครับ เหนื่อย (แต่ pure javascript มันก็มีข้อดีที่มันไม่หนัก ไม่เปลือง bandwidth)
|
ประวัติการแก้ไข 2018-09-19 10:52:02
 |
 |
 |
 |
Date :
2018-09-19 10:48:08 |
By :
Chaidhanan |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
ตอบความคิดเห็นที่ : 2 เขียนโดย : Chaidhanan เมื่อวันที่ 2018-09-19 10:48:08
รายละเอียดของการตอบ ::
พอดีผมพึ่งศึกษาjs และfunc นิดหน่อยอ่ะครับ และ swal code เลยยังไม่ค่อยเป็นครับ
คือลองใส่เข้าไปแล้วครับ มันก็ยังไม่เบรกให้อยู่อ่าครับ รบกวนอธิบายเพิ่มเติมได้ไหมครับ
Code (JavaScript)
01. <script>
02. function confirmalert() {
03. document.querySelector( '#form' ).addEventListener( 'submit' , function (e) {
04. var form = this ;
05.
06. e.preventDefault();
07.
08. swal({
09. title: "" ,
10. text: "ตรวจสอบข้อมูลให้ถูกต้อง ?" ,
11. icon: "warning" ,
12. buttons: [
13. 'ยกเลิก' ,
14. 'บันทึก'
15. ],
16. dangerMode: true ,
17. }).then( function (isConfirm) {
18. if (isConfirm) {
19. form.submit();
20. } else {
21. swal( "ยกเลิกการบันทึก !" , "กลับสู่หน้าแก้ไข" , "error" );
22. }
23. })
24. });
25. }
26. </script>
นี้โค้ดปุ่มครับ
Code (PHP)
1. <button type= "submit" onclick= "confirmalert();" ><a href= "<?=" student_edit.php?id= $cols [0] "?>" ><img src= 'imgsys/edit.png' width= '30' height= '30' /></a></button>
พอใส่ไปแล้วโค้ดjs มันขึ้นนะครับ แต่กดแล้วมันก็ไปหน้า edit เลย มันไม่เบรกรอคำสั่ง swal เลย
|
 |
 |
 |
 |
Date :
2018-09-19 18:05:18 |
By :
benzkung53 |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
<button type="submit" onclick="confirmalert();">
สีแดงเปลี่ยน type="button" ครับ
แบบนี้ มัน เข้า submit เลยครับ เลยหลุด onclick
อีกนิด เอา tag a ออกจาก button ครับ มันตีกัน อีรุงตุงนังไปหมด
Code (PHP)
01. <script>
02. function confirmalert(e) {
03. e.preventDefault();
04. var frm = e.target.form;
05. swal({
06. title: "" ,
07. text: "ตรวจสอบข้อมูลให้ถูกต้อง ?" ,
08. icon: "warning" ,
09. buttons: [ 'ยกเลิก' , 'บันทึก' ],
10. dangerMode: true,
11. }).then( function (isConfirm) {
12. if (isConfirm) {
13. frm.submit();
14. } else {
15. swal( "ยกเลิกการบันทึก !" , "กลับสู่หน้าแก้ไข" , "error" );
16. }
17. })
18. }
19. </script>
20. <button type= "button" onclick= "confirmalert( event );" ><img src= 'imgsys/edit.png' width= '30' height= '30' /></button>
<a href="<?="student_edit.php?id=$cols[0]"?>"> ตรงนี้จะทำอะไร
กดครั้งเดียวจะให้ทำอะไรบ้าง โยกมันเข้าไปอยู่ใน function เดียวกันครับ
|
ประวัติการแก้ไข 2018-09-19 19:23:40 2018-09-19 19:32:56 2018-09-19 19:34:04 2018-09-19 19:36:26
 |
 |
 |
 |
Date :
2018-09-19 19:21:12 |
By :
Chaidhanan |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
งั้นก็ต้องเปลี่ยน วิธีการ submit ไม่ใช้ form ส่ง แต่ใช้ ajax ในการส่ง เพื่อที่จะกลับมาหน้าเดิมได้
หรือ ไฟล์ที่รับฟอร์ม ไปทำงานพอทำงานเสร็จ ข้อมูลก็มาครบหมด ก็ให้ แสดงข้อมูล ชุดนั้น ใหม่อีกครั้งได้เลย
|
 |
 |
 |
 |
Date :
2018-09-20 00:18:17 |
By :
Chaidhanan |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
ต้วอย่าง pure javascript ไม่มีแล้ว(ขีเกียจหา 5555)
Code (PHP)
01. <script>
02. $.ajax({
03. url: 'linkurl.php' ,
04. type: 'post' ,
05. dataType: 'json' ,
06. data: {id: 'xxx' , name: 'yyyyy' },
07. success: (rs)=>{
08. var tr = $( 'tr[data-id="zz"]' )
09. tr.find( 'td[fld="id"]' ).html(rs.id);
10. tr.find( 'td[fld="name"]' ).html(rs.name);
11. },
12. error: (jqXHR, exception)=>{
13. var msg = '' ;
14. if (jqXHR.status === 0) { msg = 'Not connect.\n Verify Network.' ;
15. } else if (jqXHR.status === 404) { msg = 'Requested page not found. [404]' ;
16. } else if (jqXHR.status === 500) { msg = 'Internal Server Error [500].' ;
17. } else if (exception === 'parsererror' ) { msg = 'Requested JSON parse failed.' ;
18. } else if (exception === 'timeout' ) { msg = 'Time out error.' ;
19. } else if (exception === 'abort' ) { msg = 'Ajax request aborted.' ;
20. } else { msg = 'Uncaught Error.\n' + jqXHR.responseText; }
21. alert(msg+ '<br>กรุณาทดลองใหม่' );
22. }
23. })
24. </script>
25. <table>
26. <tr data-id= 'zz' ><td fld= 'id' ></td><td fld= 'name' ></td></tr>
27. </table>
|
 |
 |
 |
 |
Date :
2018-09-20 09:51:52 |
By :
Chaidhanan |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
ตอบความคิดเห็นที่ : 8 เขียนโดย : Chaidhanan เมื่อวันที่ 2018-09-20 09:51:52
รายละเอียดของการตอบ ::
Code (JavaScript)
01. <script type= "text/javascript" >
02. function confirmalert2(e) {
03. e.preventDefault();
04. var frm = new XMLHttpRequest();
05. swal({
06. title: "" ,
07. text: "ตรวจสอบข้อมูลให้ถูกต้อง ?" ,
08. icon: "warning" ,
09. buttons: [ 'ยกเลิก' , 'บันทึก' ],
10. dangerMode: true ,
11. }).then( function (isConfirm) {
12. if (isConfirm) {
13. frm.ajax({
14. url: 'linkurl.php' ,
15. type: 'post' ,
16. dataType: 'json' ,
17. data: {id: 'xxx' , name: 'yyyyy' },
18. success: (rs)=>{
19. var tr = $( 'tr[data-id="zz"]' )
20. tr.find( 'td[fld="id"]' ).html(rs.id);
21. tr.find( 'td[fld="name"]' ).html(rs.name);
22. },
23. error: (jqXHR, exception)=>{
24. var msg = '' ;
25. if (jqXHR.status === 0) { msg = 'Not connect.\n Verify Network.' ;
26. } else if (jqXHR.status === 404) { msg = 'Requested page not found. [404]' ;
27. } else if (jqXHR.status === 500) { msg = 'Internal Server Error [500].' ;
28. } else if (exception === 'parsererror' ) { msg = 'Requested JSON parse failed.' ;
29. } else if (exception === 'timeout' ) { msg = 'Time out error.' ;
30. } else if (exception === 'abort' ) { msg = 'Ajax request aborted.' ;
31. } else { msg = 'Uncaught Error.\n' + jqXHR.responseText; }
32. alert(msg+ '<br>กรุณาทดลองใหม่' );
33. }
34. })
35. } else {
36. swal( "ยกเลิกการบันทึก !" , "กลับสู่หน้าแก้ไข" , "error" );
37. }
38. })
39. }
40. </script>
เอาโค้ดวางส่วนนี้รึป่าวครับ ผมลองสคริปมันเออเร่อตรง success: (rs)=>{ ตรงนี้อ่ะครับ
ไม่มีความรู้เรื่องajax เลยครับ รบกวนแนะนำด้วยนะครับ
หน้า editของผมเป็นแบบนี้ครับ
Code (PHP)
01. <?php
02. $id = $_GET [ 'id' ];
03. $img = 'nopic.jpg' ;
04. mysql_connect( "localhost" , "root" , "" );
05. mysql_select_db( "wptr" );
06. mysql_query( "SET NAMES UTF8" );
07. $sql = "SELECT * FROM sys_student WHERE id_s=$id;" ;
08. $rs = mysql_query( $sql );
09. $cols = mysql_fetch_array( $rs );
10. ?>
|
ประวัติการแก้ไข 2018-09-20 19:04:21
 |
 |
 |
 |
Date :
2018-09-20 16:42:24 |
By :
benzkung53 |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
คุณใช้ pure javascript มาร่วมกับ jquery ไม่ได้ มันคนละ class กัน
var frm = new XMLHttpRequest();
frm.ajax()
อ่านวิธีการใช้งาน jquery ก่อนครับ เพื่อที่จะได้เขียนเองเป็น
ผมทำตัวอย่าง ให้ แต่คุณไม่ศึกษา ไม่หา document อ่านเพื่อที่จะเขียนเองให้เป็น จะรอให้เขียนให้ทั้งหมดเหรอครับ
จ้างดีกว่าไหมครับ
หา document อ่านเถอะครับจะได้เป็น
|
 |
 |
 |
 |
Date :
2018-09-20 19:00:44 |
By :
Chaidhanan |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
 |
|
|
 |
 |
|
ตอบความคิดเห็นที่ : 10 เขียนโดย : Chaidhanan เมื่อวันที่ 2018-09-20 19:00:44
รายละเอียดของการตอบ ::
Code (JavaScript)
01. <script type= "text/javascript" >
02. function confirmalert2(data) {
03. swal({
04. title: "" ,
05. text: "ตรวจสอบข้อมูลให้ถูกต้อง ?" ,
06. icon: "warning" ,
07. buttons: [ 'ยกเลิก' , 'บันทึก' ],
08. dangerMode: true ,
09. }).then( function (isConfirm) {
10. if (isConfirm) {
11. console.log(data);
12. window.location = data;
13. } else {
14. swal( "ยกเลิกการบันทึก !" , "กลับสู่หน้าแก้ไข" , "error" );
15. }
16. })
17. }
18. </script>
Code (PHP)
1. <button type= "button" onclick= "confirmalert2('<?=" student_edit.php?id= $cols [0] "?>')" >button</button>
ทำได้ละครับ ไม่ต้องใช้ ajax แต่ใช้การโยนค่าทั้งหมดไป
เพื่อมีนติดปัญหาเดียวกันครับ เลยทิ้งโพสไว้ให้ครับ
|
ประวัติการแก้ไข 2018-09-21 10:50:51
 |
 |
 |
 |
Date :
2018-09-20 19:21:09 |
By :
benzkung53 |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
|
|