วิธีทำงานกับฟิลด์ AcroForm ใน TypeScript

วิธีทำงานกับฟิลด์ AcroForm ใน TypeScript

คู่มือนี้แสดงวิธีเพิ่มและทำให้แบนฟิลด์ AcroForm ด้วย Aspose.PDF FOSS สำหรับ TypeScript. Document.Form เปิดเผยหนึ่งวิธี Add* ต่อประเภทฟิลด์ — text, checkbox, radio group, combo box, list box, และ push button — แต่ละอันจะคืนค่าตัวจัดการฟิลด์ที่มีประเภทกำหนด. จำเป็นต้องใช้ Node.js 22 หรือใหม่กว่า.

คู่มือแบบขั้นตอนต่อขั้นตอน

ขั้นตอนที่ 1: ติดตั้งแพคเกจ

git clone https://github.com/aspose-pdf-foss/Aspose.PDF-FOSS-for-TypeScript.git
cd Aspose.PDF-FOSS-for-TypeScript
npm install
npm run build

ตรวจสอบการติดตั้งโดยการนำเข้าคลาส Document ในไฟล์ TypeScript ใหม่ — บรรทัดนี้ควรทำงานโดยไม่มีข้อผิดพลาดเมื่อแพคเกจถูกติดตั้งแล้ว:

import { Document } from '@asposefoss/pdf';

ขั้นตอนที่ 2: นำเข้าคลาสที่จำเป็น

นำเข้า Document เพื่อเปิดไฟล์และไปถึง doc.Form ซึ่งเป็นจุดเริ่มต้นสำหรับทุกเมธอดฟิลด์ที่ใช้ด้านล่าง:

import { Document } from '@asposefoss/pdf';

ขั้นตอนที่ 3: เพิ่มฟิลด์ข้อความและช่องทำเครื่องหมาย

Form.AddTextField(init) และ Form.AddCheckbox(init) ทั้งสองรับจำนวน page, rect, name ที่เป็นเอกลักษณ์, และตัวเลือกการจัดรูปแบบ:

const doc = Document.OpenFile('form-template.pdf');
const form = doc.Form;
const pageNum = doc.Pages[0].Number;

form.AddTextField({
  page: pageNum, rect: [200, 670, 450, 690], name: 'FullName', value: 'Alice Sample',
  borderColor: [0.1, 0.15, 0.4], font: 'Helvetica', fontSize: 12,
});

form.AddCheckbox({
  page: pageNum, rect: [200, 630, 218, 648], name: 'Subscribe',
  checked: true, borderColor: [0.1, 0.15, 0.4],
});

ขั้นตอนที่ 4: เพิ่มกลุ่มปุ่มวิทยุ, คอมโบบ็อกซ์, และกล่องรายการ

Form.AddRadioGroup(init) รับค่า name เดียวที่ใช้ร่วมกันโดยทุกตัวเลือกในอาเรย์ options ของมัน, แต่ละตัวมีค่า rect และ export ของตนเอง. Form.AddComboBox(init) และ Form.AddListBox(init) รับอาเรย์ options ของคู่ { export, display }; กล่องรายการยังสนับสนุน multiSelect:

form.AddRadioGroup({
  name: 'Plan', selected: 'Pro',
  options: [
    { page: pageNum, rect: [200, 590, 218, 608], export: 'Basic' },
    { page: pageNum, rect: [290, 590, 308, 608], export: 'Pro' },
  ],
});

form.AddComboBox({
  page: pageNum, rect: [200, 550, 350, 570], name: 'Country', value: 'US',
  options: [
    { export: 'US', display: 'United States' },
    { export: 'UK', display: 'United Kingdom' },
  ],
});

form.AddListBox({
  page: pageNum, rect: [200, 410, 350, 510], name: 'Interests',
  multiSelect: true, value: ['pdf'],
  options: [
    { export: 'pdf', display: 'PDF Engineering' },
    { export: 'crypto', display: 'Cryptography' },
  ],
});

ขั้นตอนที่ 5: เพิ่มปุ่มกด

Form.AddPushButton(init) รับค่า caption และ action ที่อธิบายว่าปุ่มทำอะไรเมื่อคลิก — ตัวอย่างเช่น การส่งข้อมูลฟอร์มไปยัง URL:

form.AddPushButton({
  page: pageNum, rect: [200, 320, 320, 388], name: 'Submit',
  caption: 'Submit',
  action: { type: 'submit', url: 'https://example.com/submit', format: 'fdf' },
});

ขั้นตอนที่ 6: ทำให้ฟิลด์ฟอร์มแบน

ตัวจัดการฟิลด์แต่ละตัวที่ส่งกลับจากการเรียก Add* จะมีเมธอด Flatten() ที่ฝังค่าปัจจุบันของมันลงในสตรีมเนื้อหาของหน้าและลบออกจาก AcroForm แบบโต้ตอบ:

const tb = form.AddTextField({
  page: pageNum, rect: [210, 660, 460, 680], name: 'FlattenName', value: 'Alice Sample',
});
tb.Flatten(); // -> number; bakes the value, unwires the field from /AcroForm

doc.WriteTo('flattened.pdf');

ปัญหาทั่วไปและการแก้ไข

ฟิลด์ไม่ปรากฏบนหน้าที่ตั้งใจไว้. page ในฟิลด์ของ init อ็อบเจ็กต์คือหมายเลขหน้าของหน้านั้นเอง ไม่ใช่ดัชนีของอาร์เรย์ — ยืนยันกับ page.Number บนเป้าหมาย Page.

ตัวเลือกปุ่มวิทยุไม่เป็นเอกสิทธิ์ต่อกัน. ทุกตัวเลือกใน Form.AddRadioGroup()ของ options อาร์เรย์ต้องแชร์ค่าเดียวของกลุ่ม name — การผสมชื่อฟิลด์ทำให้สร้างกล่องกาเครื่องหมายอิสระแทนกลุ่มปุ่มวิทยุ.

ค่าของฟิลด์ที่ทำให้แบนไม่ปรากฏในไฟล์ที่บันทึกไว้. บันทึกเอกสาร (doc.WriteTo() / doc.Save()) หลังจากเรียกใช้ Flatten() — การเปลี่ยนแปลงจะมีอยู่ในหน่วยความจำเท่านั้นจนกว่าไฟล์จะถูกเขียนกลับออกไป.

คอมโบบ็อกซ์แสดงค่าการส่งออกแทนข้อความที่แสดงผล. การแสดงผลวาด display; ค่าที่เก็บของฟิลด์ (/V) คือ export — ยืนยันว่าทั้งสองตั้งค่าสำหรับทุกตัวเลือก ไม่ใช่แค่หนึ่ง.

คำถามที่พบบ่อย

ฉันสามารถอ่านค่าปัจจุบันของฟิลด์ได้หลังจากฟอร์มถูกกรอกหรือไม่?

ใช่ — อ่านคุณสมบัติ Value ของตัวจัดการฟิลด์, หรือวนซ้ำ doc.Form.Fields เพื่อตรวจสอบทุกฟิลด์บนเอกสาร.

ความแตกต่างระหว่าง Flatten() บนฟิลด์และบน annotation คืออะไร?

ทั้งฝังเนื้อหาเชิงโต้ตอบลงในเนื้อหาหน้าสถิตและลบออกจากคอลเลกชันที่สอดคล้องของมัน — ของฟิลด์ Flatten() ลบออกจาก /AcroForm, ในขณะที่ของคำอธิบาย Flatten() (อธิบายใน คำอธิบาย guide) ลบออกจากของหน้า /Annots.

กล่องรายการ (list box) สามารถเลือกหลายรายการได้หรือไม่?

ใช่ — ตั้งค่า multiSelect: true บนวัตถุ init ของ Form.AddListBox() และส่งอาเรย์ไปยัง value.

ปุ่ม push button จำเป็นต้องมีการกระทำจึงจะมีประโยชน์หรือไม่?

action (เช่น { type: 'submit', url, format }) คือสิ่งที่ทำให้ปุ่มทำงานเมื่อคลิก; หากไม่มีมัน ปุ่มจะถูกแสดงแต่ไม่มีพฤติกรรมใดเชื่อมต่อ.

ดูเพิ่มเติม

 ภาษาไทย