ตัวอย่างการสร้าง ajax subform ในเรื่อง joGet: AJAX Subform มีโจทย์มาว่า input ที่ผูกกับซับฟอร์มถูกเปลี่ยนค่าจาก javascript ก็คิดว่าค่าใน subform จะเปลี่ยนตามไปด้วย แต่มันกลับไม่เปลี่ยนตาม เพราะ input ค่าเปลี่ยนก็จะทำให้มันโหลดข้อมูลมาใหม่ได้ไม่ยาก แต่มันไม่ทำงาน ลองศึกษาไฟล์ /jw/plugin/org.joget.plugin.enterprise.AjaxSubForm/js/jquery.ajaxsubform.js ดูก็พบว่ามันมีการสั่ง .off เอา event เก่าออกไปก่อน ทำให้แค่เปลี่ยนค่าเฉยๆ มันจะไม่ทำงาน
การสั่ง reload / refresh ajax subform โดยใช้ javascript ทำได้โดย
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | <button class = "btn btn-info" id= "refreshBtn" type= "button" >Reload form</button> <script> $(document).ready( function () { $( '#refreshBtn' ).on( 'click' , function () { let field1 = FormUtil.getField( 'field1' ); field1.val( '72817b0c-ac1430db-671b8000-37df4c8d' ); field1.trigger( 'change' ); }); }); </script> |
แบบนี้เมื่อนเปลี่ยนค่า field1 subform จะถูกเปลี่ยนค่าตามไปด้วยแล้ว ลองดัดแปลงให้เหมาะกับงานดูนะครับ
About the author