Ghi dữ liệu từ trình duyệt web xuống PLC
I – Tải project mẫu
Link tải project mẫu (Tia portal V16): Tải về
II – Video hướng dẫn
III – Các bước thực hiện
Bước 1: Tại file “FC1_Common.js” tạo hàm chức năng sửa và lưu dữ liệu
1 2 3 4 5 6 | // Hàm chức năng nút sửa/lưu dữ liệu function fn_DataEdit(button1, button2) { document.getElementById(button1).style.zIndex='1'; // Hiển nút 1 document.getElementById(button2).style.zIndex='0'; // Ẩn nút 2 } |
Bước 2: Tại file “FC1_Common.js” tạo hàm chức năng báo đang sửa dữ liệu
1 2 3 4 5 6 7 8 9 10 11 12 13 | // Tag Edit var tag_Edit_Enable = false; // Hàm báo đang sửa dữ liệu function fn_Edditing(){ fn_DataEdit("btt_Save", "btt_Edit") tag_Edit_Enable = true; // Enable chức năng IO Field document.getElementById("tbx_tag_Bool").disabled = false; document.getElementById("tbx_tag_Byte").disabled = false; document.getElementById("tbx_tag_Integer").disabled = false; document.getElementById("tbx_tag_Real").disabled = false; document.getElementById("tbx_tag_String").disabled = false; } |
Bước 3: Tại file “FC1_Common.js” tạo hàm chức năng báo đang LƯU dữ liệu
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 | // Hàm báo đã sửa dữ liệu function fn_Saving(){ fn_DataEdit("btt_Edit", "btt_Save") tag_Edit_Enable = false; // Set giá trị tag var tag_Bool_data = document.getElementById("tbx_tag_Bool").value; // Lấy giá trị từ textbox var tag_Byte_data = document.getElementById("tbx_tag_Byte").value; var tag_Integer_data = document.getElementById("tbx_tag_Integer").value; var tag_Real_data = document.getElementById("tbx_tag_Real").value; var tag_String_data = document.getElementById("tbx_tag_String").value; setTag('tag_Bool',tag_Bool_data); // Ghi dữ liệu xuống plc setTag('tag_Byte',tag_Byte_data); setTag('tag_Integer',tag_Integer_data); setTag('tag_Real',tag_Real_data); setTag('tag_String',tag_String_data); // Disable chức năng IO field document.getElementById("tbx_tag_Bool").disabled = true; document.getElementById("tbx_tag_Byte").disabled = true; document.getElementById("tbx_tag_Integer").disabled = true; document.getElementById("tbx_tag_Real").disabled = true; document.getElementById("tbx_tag_String").disabled = true; alert('Dữ liệu đã được lưu!'); } |
Bước 4: Tại file Index.html tạo 2 nút nhấn có tên “Sửa” và “Lưu”
1 2 3 4 | <!-- Nút nhấn lưu--> <button id="btt_Save" onmousedown="fn_Saving()">LƯU</button> <!-- Nút nhấn sửa--> <button id="btt_Edit" onmousedown="fn_Edditing()">SỬA</button> |
Bước 5: Tạo bảng tag ghi dữ liệu xuống PLC trong file IO.html
1 2 3 4 5 | <!-- AWP_In_Variable Name='"Web_Comm".tag_Bool' --> <!-- AWP_In_Variable Name='"Web_Comm".tag_Byte' --> <!-- AWP_In_Variable Name='"Web_Comm".tag_Integer' --> <!-- AWP_In_Variable Name='"Web_Comm".tag_Real' --> <!-- AWP_In_Variable Name='"Web_Comm".tag_String' --> |
Bước 6: Tại folder “CSS” tạo một file css có tên “main_Screen.css” và gọi ra phần header của file “Index.html”
Bước 7: Thêm code CSS cho 2 nút nhấn SỬA và LƯU trong file “main_Screen.css”.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 | /*Nút nhấn sửa*/ #btt_Edit { border: none; background-color: rgb(255, 0, 0); color: rgb(255, 255, 255); text-align: center; display: inline-block; font-size: 13px; font-weight: bold; cursor: pointer; position: absolute; width: 80px; height: 40px; left: 250px; top: 400px; } /*Nút nhấn lưu*/ #btt_Save { border: none; background-color: rgb(2, 2, 2); color: rgb(255, 255, 255); text-align: center; display: inline-block; font-size: 13px; font-weight: bold; cursor: pointer; position: absolute; width: 80px; height: 40px; left: 250px; top: 400px; } |
Bước 8: Tại file “FC1_Common.js” sửa lại hàm chức năng đọc lên giá trị tag (code dòng 3)
1 2 3 4 5 6 7 8 9 10 11 | // HIỂN THỊ DỮ LIỆU LÊN IO FIELD setInterval(function () { if(tag_Edit_Enable == false){ // IO Field - Màn hình chính (Actual value) IOField("tbx_tag_Bool", "tag_Bool"); IOField("tbx_tag_Byte", "tag_Byte"); IOField("tbx_tag_Integer", "tag_Integer"); IOField("tbx_tag_Real", "tag_Real"); IOField("tbx_tag_String", "tag_String"); } }, 1000); |
Bước 9: Tải lại folder Web vào PLC và kiểm nghiệm kết quả
0 nhận xét:
Đăng nhận xét