SAP Web Dynpro - การสร้างแอปพลิเคชัน

ในการสร้างแอปพลิเคชัน Web Dynpro เราจะสร้างคอมโพเนนต์ Web Dynpro ที่ประกอบด้วยมุมมองเดียว เราจะสร้างบริบทมุมมอง→ที่เชื่อมโยงกับองค์ประกอบตารางบนเค้าโครงมุมมองและมีข้อมูลจากตาราง

ตารางจะแสดงในเบราว์เซอร์ขณะรันไทม์ แอปพลิเคชัน Web Dynpro สำหรับคอมโพเนนต์ Web Dynpro แบบธรรมดานี้ซึ่งสามารถเรียกใช้ในเบราว์เซอร์จะถูกสร้างขึ้น

Step 1 - ไปที่ T-Code - SE80 แล้วเลือก Web Dynpro component / intf จากรายการ

Step 2 - สร้างส่วนประกอบใหม่ดังต่อไปนี้

Step 3 - ป้อนชื่อขององค์ประกอบใหม่และคลิกที่จอแสดงผล

Step 4 - ในหน้าต่างถัดไปป้อนรายละเอียดต่อไปนี้ -

  • คุณสามารถป้อนคำอธิบายของส่วนประกอบนี้
  • ในประเภทให้เลือกคอมโพเนนต์ Web Dynpro
  • คุณยังสามารถรักษาชื่อของหน้าต่างเริ่มต้นได้

Step 5 - กำหนดส่วนประกอบนี้ให้กับ Package $ TMP แล้วคลิกปุ่มบันทึก

เมื่อคุณคลิกบันทึกคุณจะเห็นส่วนประกอบใหม่นี้ภายใต้โครงสร้างวัตถุและประกอบด้วย -

  • ตัวควบคุมส่วนประกอบ
  • ส่วนต่อประสานคอมโพเนนต์
  • View
  • Windows

เมื่อคุณขยายอินเทอร์เฟซคอมโพเนนต์คุณจะเห็นตัวควบคุมอินเทอร์เฟซและมุมมองอินเทอร์เฟซ

จะสร้างมุมมองและกำหนดให้กับหน้าต่างได้อย่างไร?

Step 1 - คลิกที่คอมโพเนนต์ Web Dynpro แล้วไปที่เมนูบริบท (คลิกขวา) →สร้าง→ดู

Step 2 - สร้างมุมมอง MAINVIEW ดังต่อไปนี้และคลิกที่เครื่องหมายถูก

สิ่งนี้จะเปิดตัวแก้ไขมุมมองใน ABAP workbench ภายใต้ชื่อ - MAINVIEW

Step 3 - หากคุณต้องการเปิดแท็บเค้าโครงและตัวออกแบบมุมมองคุณอาจต้องป้อนชื่อผู้ใช้และรหัสผ่านของแอ็พพลิเคชันเซิร์ฟเวอร์

Step 4 - คลิกไอคอนบันทึกที่ด้านบน

เมื่อคุณบันทึกมันจะอยู่ใต้โครงสร้างวัตถุและคุณสามารถตรวจสอบได้โดยการขยายแท็บมุมมอง

Step 5 - ในการกำหนดหน้าต่างให้กับมุมมองนี้ให้เลือกหน้าต่าง ZZ_00_TEST ใต้แท็บหน้าต่างและคลิกที่เปลี่ยนโหมดที่ด้านบนของหน้าจอ

Step 6 - คุณสามารถคลิกขวา→แสดง→ในหน้าต่างเดียวกัน

Step 7 - ตอนนี้เปิดโครงสร้างมุมมองและย้ายมุมมอง MAINVIEW ภายในโครงสร้างหน้าต่างทางด้านขวามือโดย Drag and Drop

Step 8 - เปิดโครงสร้างหน้าต่างทางด้านขวามือและคุณจะเห็น MAINVIEW ที่ฝังอยู่

Step 9 - บันทึกโดยคลิกไอคอนบันทึกที่ด้านบนของหน้าจอ

จะสร้างดูบริบทสำหรับ MAINVIEW ได้อย่างไร?

Step 1- เปิด View Editor เพื่อดู MAINVIEW และเปลี่ยนเป็นแท็บบริบท สร้างโหนดบริบทใน View Controller โดยเปิดเมนูบริบทที่เกี่ยวข้อง

Step 2 - เลือกมุมมองในโครงสร้างวัตถุแล้วคลิกแสดง

Step 3- รักษาคุณสมบัติในหน้าต่างถัดไป เลือกโครงสร้างคาร์ดินาลิตี้และพจนานุกรม (ตาราง) เลือกเพิ่มแอตทริบิวต์จากโครงสร้างและเลือกส่วนประกอบของโครงสร้าง

Step 4 - ในการเลือกส่วนประกอบทั้งหมดให้คลิก Select all option ที่ด้านบนจากนั้นคลิกเครื่องหมายถูกที่ด้านล่างของหน้าจอ

มีการสร้างโหนดบริบท TEST_NODE ซึ่งอ้างถึงโครงสร้างข้อมูลของตารางและสามารถมี 0 → n รายการในรันไทม์ โหนดบริบทถูกสร้างขึ้นในบริบทมุมมองเนื่องจากไม่มีการวางแผนการแลกเปลี่ยนข้อมูลกับมุมมองอื่น ๆ ดังนั้นจึงไม่จำเป็นต้องใช้บริบทตัวควบคุมคอมโพเนนต์

Step 5 - บันทึกการเปลี่ยนแปลงใน MAINVIEW โดยคลิกที่ไอคอนบันทึก

Step 6- ไปที่แท็บเค้าโครงของ MAINVIEW แทรกองค์ประกอบ UI ใหม่ของตารางชนิดภายใต้ ROOTUIELEMENT CONTAINER และกำหนดคุณสมบัติในตารางที่กำหนด

Step 7 - ป้อนชื่อขององค์ประกอบและประเภท

Step 8- สร้างการเชื่อมโยงของ TEST_TABLE กับโหนดบริบท TEST_NODE เลือกมุมมองข้อความเป็นตัวแก้ไขเซลล์มาตรฐานและเปิดใช้งานการผูกสำหรับเซลล์ทั้งหมด

Step 9- คลิกปุ่มบริบท เลือกโหนดบริบทเป็น TEST_NODE จากรายการ

Step 10 - คุณสามารถดูคุณสมบัติทั้งหมดได้โดยการเลือก

Step 11- เปิดใช้งานช่องทำเครื่องหมายทั้งหมดภายใต้การเชื่อมโยงสำหรับคุณลักษณะบริบททั้งหมดโดยเลือก ยืนยันรายการโดยกดปุ่ม Enter

ผลลัพธ์ควรมีลักษณะดังนี้ -

Step 12 - บันทึกการเปลี่ยนแปลง

Step 13- ในการจัดหาข้อมูลไปยังตาราง TEST ให้ไปที่แท็บ Methods และดับเบิลคลิกที่ method WDDOINIT ป้อนรหัสต่อไปนี้ -

method WDDOINIT .
* data declaration
data:
Node_TEST type REF TO IF_WD_CONTEXT_NODE,
Itab_TEST type standard table of TEST.
* get data from table TEST
select * from TEST into table Itab_TEST.
* navigate from <CONTEXT> to <TEST> via lead selection
Node_TEST = wd_Context->get_Child_Node( Name = `TEST_NODE` ).
* bind internal table to context node <TEST>
Node_TEST->Bind_Table( Itab_TEST ).
endmethod.

แอปพลิเคชัน Web Dynpro คุณไม่ควรเข้าถึงตารางฐานข้อมูลโดยตรงจากวิธีการของ Web Dynpro อย่างไรก็ตามคุณควรใช้ฟังก์ชันการจัดหาหรือการเรียก BAPI สำหรับการเข้าถึงข้อมูล

Step 14 - บันทึกการเปลี่ยนแปลงโดยคลิกไอคอนบันทึกที่ด้านบนของหน้าจอ

จะสร้าง Web Dynpro Application ได้อย่างไร?

Step 1 - เลือกองค์ประกอบ ZZ_00_TEST ในโครงสร้างวัตถุ→คลิกขวาและสร้างแอปพลิเคชันใหม่

Step 2 - ป้อนชื่อแอปพลิเคชันแล้วคลิกดำเนินการต่อ

Step 3- บันทึกการเปลี่ยนแปลง บันทึกเป็นวัตถุในเครื่อง

ต่อไปคือการเปิดใช้งานวัตถุในคอมโพเนนต์ Web Dynpro -

Step 4 - ดับเบิลคลิกที่คอมโพเนนต์ ZZ_00_TEST แล้วคลิกเปิดใช้งาน

Step 5 - เลือกวัตถุทั้งหมดแล้วคลิกดำเนินการต่อ

Step 6 - ในการเรียกใช้แอปพลิเคชันให้เลือกแอปพลิเคชัน Web Dynpro →คลิกขวาและทดสอบ

เบราว์เซอร์จะเริ่มทำงานและแอปพลิเคชัน Web Dypro จะทำงาน

เรียกใช้ Web Dynpro Application

ในแอปพลิเคชัน Web Dynpro หน้าต่างคอมโพเนนต์จะมีปลั๊กขาเข้า ปลั๊กขาเข้านี้สามารถมีพารามิเตอร์ซึ่งต้องระบุเป็นพารามิเตอร์ URL

ค่าดีฟอลต์ที่ถูกเขียนทับโดยพารามิเตอร์ URL สามารถตั้งค่าได้ในแอ็พพลิเคชันสำหรับพารามิเตอร์เหล่านี้ หากไม่ได้ระบุค่าดีฟอลต์หรือพารามิเตอร์ URL ข้อผิดพลาดรันไทม์จะถูกทริกเกอร์

ในการสร้างปลั๊กขาเข้าใหม่ให้ระบุปลั๊กเป็นการเริ่มต้นและชนิดข้อมูลควรเป็นสตริง เปิดใช้งานส่วนประกอบ

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

เรียกแอ็พพลิเคชันและพารามิเตอร์ URL เขียนทับพารามิเตอร์แอ็พพลิเคชัน