Forgot Password ??

PHP , ASP , ASP.NET, VB.NET, C#, Java , jQuery , Android , iOS , Windows Phone

	Registered : 109,037

HOME > PHP > PHP Forum > กำหนดให้ textbox maxlength=14 เมื่อใส่ครบแล้วให้สร้างแถวใหม่เขียนยังไงครับ

กำหนดให้ textbox maxlength=14 เมื่อใส่ครบแล้วให้สร้างแถวใหม่เขียนยังไงครับ

เริ่มหัวข้อใหม่

beer

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

อันนี้ลองเขียนมาแบบกดปุ่ม แต่ต้องการแบบเมื่อ textbox ใส่ครบ 14 ตาม maxlength แล้วเพิ่มแถวให้เลยครับ โดยที่ไม่ต้องกดปุ่ม

Code (PHP)

<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
<script type="text/javascript">
function AddRow()
{
	$("#MyTable tr:last").attr('maxlength','14');
		if ($(this) > 14) {
    $('#myTable').append('<tr><td><input name="inp" type="text" maxlength="14" /></td></tr>')
}
}
</script>
<title></title>
</head>
<body>
<input type="button" id="btnAdd" onclick="AddRow()" value="submit" />
<a href="">test</a>
<table id="myTable">
  <tbody >
    <tr>
      <td>
        <input name="inp" type="text" maxlength="14" onkeyup="AddRow()" />
      </td>
    </tr>
  </tbody>
</table>
</body>
</html>

Tag : PHP, HTML/CSS, JavaScript, Ajax, jQuery

ประวัติการแก้ไข
2015-06-22 13:42:07

Date : 2015-06-22 13:26:27

By : littlebeer

View : 859

Reply : 5

No. 1

Mongkon.k

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

ลองดูน่ะครับ ผมไม่ได้เทสน่ะ
Code (PHP)

<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $("#btnAdd").click(function() {
     $("#myTable tr:last").after('<tr><td><input name="inp[]" type="text" maxlength="14" /></td></tr>');
  });
});
function AddRow(str_val)
{
	/*$("#MyTable tr:last").attr('maxlength','14');
		if ($(this) > 14) {
    $('#myTable').append('<tr><td><input name="inp" type="text" maxlength="14" /></td></tr>')*/

    if(str_val.length==14){
      $("#myTable tr:last").after('<tr><td><input name="inp[]" type="text" maxlength="14" /></td></tr>');
    }
}
</script>
<title></title>
</head>
<body>
<input type="button" id="btnAdd" value="submit" />
<a href="">test</a>
<table id="myTable">
  <tbody >
    <tr>
      <td>
        <input name="inp[]" type="text" maxlength="14" onkeyup="AddRow($(this).val())" />
      </td>
    </tr>
  </tbody>
</table>
</body>
</html>

Date : 2015-06-22 14:36:47

By : mangkunzo

No. 2

beer

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

ขอบคุณมากเลยครับ แต่มันเพิ่มแค่บรรทัดเดียวเองครับ พอบรรทัด 3 มันไม่ขึ้น

Date : 2015-06-22 14:43:53

By : littlebeer

No. 3

Chaidhanan

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

$("#myTable tr:last").after('<tr><td><input name="inp[]" type="text" maxlength="14" onkeyup="AddRow($(this).val())" /></td></tr>');

เพิ่มสีแดงเข้าไปด้วยครับ

Date : 2015-06-22 15:19:39

By : Chaidhanan

No. 4

beer

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

ขอบคุณมาก ๆ ครับ เบลอ ๆ ไปหน่อย ลืมโน่นลืมนี้

Date : 2015-06-22 15:35:35

By : littlebeer

No. 5

Unidentifier

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

อีกหนึ่งทางเลือกครับ

<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
	var template = '<tr><td><input name="inp[]" class="text-input" type="text" maxlength="14" /></td></tr>';
    $("#myTable").on("keypress","input.text-input",function(e){
        var cur = $(this),            
            maxlen = cur.attr('maxlength');
        if(cur.val().length == maxlen){
            cur.parents('tbody').append(template).find('tr:last input.text-input').focus();
        }        
    });
});
</script>

</head>
<body>

<table id="myTable">
  <tbody >
    <tr>
      <td>
        <input name="inp[]" class='text-input' type="text" maxlength="14" placeholder='ไม่เกิน 14 ตัวอักษร' />
      </td>
    </tr>
  </tbody>
</table>
</body>
</html>

Date : 2015-06-22 22:52:49

By : sakuraei

ค้นหาข้อมูล

แสดงความคิดเห็น

Re : กำหนดให้ textbox maxlength=14 เมื่อใส่ครบแล้วให้สร้างแถวใหม่เขียนยังไงครับ

รายละเอียด

เพื่อความเรียบร้อยของข้อความ ควรจัดรูปแบบให้พอดีกับขนาดของหน้าจอ เพื่อง่ายต่อการอ่านและสบายตา และตรวจสอบภาษาไทยให้ถูกต้อง

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

Notice

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

เพื่อความปลอดภัยและการตรวจสอบ กระทู้ที่แทรกไฟล์อัพโหลดไฟล์จากที่อื่น อาจจะถูกลบทิ้ง

โดย

อีเมล์

บวกค่าให้ถูก