PHP Ionic Angular HTML5 AJAX Javascript CSS MySQL jQuery Forum


สอบถามเรื่องแสดงเลขบอกว่าเป็น fieldที่เท่าไหร่ หลังจากกดเพิ่มใหม่

ถาม-ตอบ แนะนำไอเดียว โค้ดตัวอย่าง แนวทาง วิธีแก้ปัญหา สอบถามเรื่องแสดงเลขบอกว่าเป็น fieldที่เท่าไหร่ หลังจากกดเพิ่มใหม่

สอบถามเรื่องแสดงเลขบอกว่าเป็น fieldที่เท่าไหร่ หลังจากกดเพิ่มใหม่

คือผมลอง get  x++ แล้วมันกลายเป็น sum ผมอยากให้มันแสดงเลขลำดับหลังจากที่กดเพิ่มแถว ไม่ทราบว่าต้องเพิ่มส่วนไหนครับ

$(document).ready(function() {
  var max_fields = 10; //maximum input boxes allowed
  var wrapper = $(".input_fields_wrap"); //Fields wrapper
  var add_button = $(".add_field_button"); //Add button ID

  var x = 1; //initlal text box count
  $(add_button).click(function(e) { //on add input button click
    e.preventDefault();
    if (x < max_fields) { //max input box allowed
      x++; //text box increment
      //$(wrapper).append('<div><input type="text" name="mytext[]"/><a href="#" class="remove_field">Remove</a></div>'); //add input box
      $(wrapper).append(

        '<div class="product_wrapper">' +
        '<div class="row" >' +
        '<div class="col-lg-4" >' +
        '<label>ตัวชี้วัด</label>' +
        '<input type="hidden" name="pro_id[]" value="">'+
        '<input type="text" class="form-control " name="txtindex[]" value="" required>' +
        '</div>' +

        '<div class="col-lg-4">' +
        '<label>ค่าเป้าหมาย</label>' +
        '<input type="number" class="Target_value_tag form-control " name="txtTarget_value[]" value="" placeholder="" required>' +
        '</div>' +

        '<div class="col-lg-4">' +
        '<label>หน่วยนับ</label>' +
        '<input type="text" class="sum_tag form-control " name="txtSum[]" value="" required />' +
        '</div>' +
        '</div>'  +

        '<br>'+
        '<a href="#" class="remove_field btn btn-danger">ลบที่เพิ่มใหม่</a>' +

        '<hr class="new">' +
        '</div>'
        );
    }
  });

  $(wrapper).on("click", ".remove_field", function(e) { //user click on remove text
    e.preventDefault();
    $(this).parent('.product_wrapper').remove();
    calculateTotal();
    x--;
  })


Thammarat Phanphai 203.131.208.xxx 09-09-2019 09:00:36

คำแนะนำ และการใช้งาน

สมาชิก กรุณา ล็อกอินเข้าระบบ เพื่อตั้งคำถามใหม่ หรือ ตอบคำถาม สมาชิกใหม่ สมัครสมาชิกได้ที่ สมัครสมาชิก


  • ถาม-ตอบ กรุณา ล็อกอินเข้าระบบ


  • ( หรือ เข้าใช้งานด้วย Facebook คลิก )
 ความคิดเห็นที่ 1

เพิ่มเติม ตอนนี้เวลากดเพิ่ม ได้เลขนับแล้วครับ ผมเติม (x+1) เข้าไปไดเลย

แต่เวลากดลบ มันไม่ลบให้ 

ถ้าผมกดเพิ่ม เป็นเลขลำดับที่ 5  เวลากดลบ เหลือลำดับที่ 4 

แล้วกดเพิ่มอีกครั้ง กลายเป็น เลขลำดับที่ 6 ไม่เป็น 5

เหมือนว่ามันไม่ลบ 5 ออกไปครับ  

 



Thammarat Phanphai 203.131.208.xxx 09-09-2019 09:25
 ความคิดเห็นที่ 2
ใช้วิธี gen เลขลำดับใหม่ ทุกครั้ง เมือเพิ่ม หรือลด รายการ โดยใส่เลขลำดับใน <sapn></span> 
หรือ tags ใดๆ ก็ได้ ตามต้องการ แล้วกำหนด class สำหรับอ้างอิง <sapn class="css-order-number"></span> 
แล้วใช้การวนลูปเพิ่มเลขลำดับ
 
      $(".css-order-number").each(function(index, element){
        $(element).text(index+1);
      });


Ninenik 180.183.118.xxx 09-09-2019
 ความคิดเห็นที่ 3
ขอบคุณครับ


Thammarat Phanphai 203.131.208.xxx 10-09-2019 13:45






เว็บไซต์ของเราให้บริการเนื้อหาบทความสำหรับนักพัฒนา โดยพึ่งพารายได้เล็กน้อยจากการแสดงโฆษณา โปรดสนับสนุนเว็บไซต์ของเราด้วยการปิดการใช้งานตัวปิดกั้นโฆษณา (Disable Ads Blocker) ขอบคุณครับ