A-AA+then

แก้ไขการ Submit จาก input button เป็น Text โดยใช้ href

2,441
สวัสดีครับ

จากตัวอย่าง บทที่ 7 การทำ Login ด้วย AJAX

หากต้องการแก้ไขการ Submit จาก button submit เป็น text โดยใช้ href สามารถทำได้มั้ยครับ

ผมลองแก้ไข Code ดังนี้

ปุ่ม submit ใส่ submit ไว้ที่ href เพราะลองใส่ที่ onclick แล้วกด submit ตัว form จะไม่ submit เลย
echo "<div style='padding: 7px 0px 0px 14px;float:left'><a href=\"JavaScript:submit_form('frm_login');\" title='Login' class='link1'>Login</a></div>";

Javascript ใส่ไว้ในไฟล์ .js
function submit_form(frm_name) {
    var value_submit = "memberlogin(document.getElementById('txt_username').value,document.getElementById('txt_password').value,'login')";
    alert(value_submit);
    document.getElementById(frm_name).submit(value_submit);
}

หากกด Login แล้วหน้าจอจะ Refresh ให้รู้ว่ามีการ Submit แต่ปัญหาคือหากลองใส่ alert(username); ใน function check_user(username, passwd, action) ที่บรรทัดแรกเลย จะได้เป็นค่าว่าง

ที่ลองทำมาแล้ว
- ลบ onsubmit ในส่วนของ <form> ทิ้งก็เหมือนเดิม
- ใส่ Javascript:
submit_form('frm_login'); ใน onclick ก็ไม่ทำงาน
- เปลี่ยน
document.getElementById('txt_username').value เป็น document.frm_login.txt_username.value ได้ค่าว่างเหมือนเดิม

เหตุที่อยากเปลี่ยนเพราะ Design ไว้เป็น Text ไม่ใช่ปุ่มครับ ถ้าหากเป็นปุ่ม เสร็จไปนานแล้ว

รบกวนผู้รู้ด้วยครับ (ผมไม่ถนัด Javascript มาแต่ไหนแต่ไรแล้ว ลองทีำไรคลำยาวทุกที) ถ้ามีสื่อดี ๆ ให้ศึกษา รบกวนแนะนำด้วยครับ


ขอบคุณครับ

3 ความคิดเห็น

555+++

ถ้าปัญหามีแค่ design จะเปลี่ยนทำไมครับ ในเมื่อ CSS ก็สามารถทำให้ปุ่มเหมือน link ได้ (และทำให้ลิงค์เหมือนปุ่มก็ได้)

a {
  border: 1px solid #000;
}
input[type=submit] {
  border: none;
  text-decoration: underline;
}
1

สวัสดีครับ

เรื่องปุ่มใส่ CSS ผมทำเผื่อไว้แล้วครับ เพียงแต่มันจะไม่เหมือนกับ Link อื่นที่อยู่ใกล้กัน เพราะ Link อื่นเป็น Text หมด mouseover มีขีดเส้นไต้กดแล้วไม่บุ๋มลงไปเหมือนปุ่มด้วยครับ คงต้องทำใจไปก่อน อย่างมากก็ต้องเปลี่ยน

มีอีกเรื่องที่อยากถามครับ
ในเว็บ goragod นี้ตอนกรอก username กับ password หากใส่ผิดจะเป็น popup alert ขึ้นมา ไม่ทราบว่าทำยังไงครับ ผมลองใส่ script หลาย ๆ แบบ มันเช็คค่าที่ Response.Text กลับมาไม่ได้ครับ alert popup ก็ไม่ได้ครับ


ขอบคุณครับ
2

ถ้าจะให้ฟอร์ม submit เมื่อคลิกลิงค์

<a href="javascript:void(0)" onclick="form.submit()">

ส่วนคำถามที่ถามมา คำตอบมีบนเว็บเยอะแยะ ครับ ลองดูตัวอย่างเกี่ยวกับ Ajax ทั้งหมด จะมีลักษณะเดียวกัน ซึ่งกรอบ login ก็เป็นอันนึงที่อยู่ในแนวคิดนี้ด้วย (ก็ Ajax มันทำเป็นแค่อย่างเดียว)

ปัญหาที่อาจจะไม่เข้าใจหรือมองไม่ออกกัน ก็คือ การส่งค่ากลับครับ ซึ่งมีหลายอย่าง
1 เป็น Text
2 เป็น XML
3 เป็น JSON
ทุกวิธีสามารถส่งค่ากลับอะไรก็ได้ แต่...เราต้องหาวิธีในการใช้งานค่าที่ส่งกลับครับ

ค่าที่ส่งกลับมาอยู่ในรูปตัวแปร Javascript อยู่แล้ว เราก็แค่เขียน Javascript เพื่อตรวจสอบค่าที่ส่งมา โดยใช้เงื่อนไขที่กำหนดเองครับ
3
^