อยากให้กดปุ่มแล้วแสดงผลก่อนจะ submit ทำยังไงครับ

เริ่มโดย Kizmo, 05 เมษายน 2017, 10:59:24

หัวข้อก่อนหน้า - หัวข้อถัดไป

0 สมาชิก และ 1 ผู้มาเยือน กำลังดูหัวข้อนี้

พิมพ์
ลง หน้า1
การกระทำของผู้ใช้

Kizmo

05 เมษายน 2017, 10:59:24
คลิกปุ่มรายการแล้วให้แสดงผลที่ card ก่อนแล้วค่อย submit รายการที่สั่งทั้งหมด พอทำแบบไหนได้บ้างครับ

รับถ่ายภาพ http://emofoto.net

Permlogin

#1
05 เมษายน 2017, 11:05:32
ติดตามด้วยคน  :wanwan016:

choking

#2
05 เมษายน 2017, 12:51:28
ปุ่มสีฟ้า = ปุ่มรายการ
card = checkbox ในกรอบ

ที่ต้องการคือ
ให้กดปุ่มสีฟ้า แล้วแสดงผลที่กรอบ
เมื่อเสร็จแล้วกดปุ่ม submit

ผมเข้าใจถูกต้องหรือเปล่าครับ?


โค้ด เลือก
<html>
<head>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script>
$(function(){
$(".list").click(function(){
var val=$(this).val(); //ค่าของปุ่มรายการ
var listVal=$("#list").val(); //ค่าที่เก็บไว้
if(listVal.indexOf(val)==-1){ //เช็คค่าซ้ำ
html='<input type="checkbox" value="' val '"> ' $(this).text(); //สร้าง html tag
$("#card").append(html); //เพิ่ม html tag ลงใน card
$("#list").val(listVal ',' val); //เก็บค่าของรายการที่เพิ่มลงแล้ว
}

});
});
</script>
</head>
<body>
<form>
<button class="list" type="button" value="1">ข้าวผัดหมู</button>
<button class="list" type="button" value="2">ข้าวผัดไก่</button>
<button class="list" type="button" value="3">ข้าวผัดทะเล</button>
<button class="list" type="button" value="4">ข้าวผัดหมูกรอบ</button>

<div id="card"></div>

<input type="hidden" name="list" id="list"> <!-- ใช้สำหรับเก็บค่าของรายการที่เพิ่มลงแล้ว -->
<button type="submit" >submit</button>
</form>
</body>
</html>
พิมพ์
ขึ้น หน้า1
การกระทำของผู้ใช้