Ajax动态加载表单按钮后提交失效，PHP跳转不生效求助

Hey, let's break down why your dynamically loaded button isn't triggering the form submit and redirect. The core issue here ties into how dynamic DOM elements interact with default form submission behavior.

1. Your Assign Button Isn't a Proper Submit Button #

The most common culprit is that the button you're outputting via PHP isn't configured to trigger a form submit. Browsers only recognize elements with type="submit" (or <input type="submit">) as default form submission triggers. If your button is a plain <button> without the type attribute, many browsers treat it as a generic "do nothing" button by default.

Fix: Update Your PHP Button Output #

Modify the PHP code that generates the button to explicitly mark it as a submit button:

// Option 1: Using an input tag
echo '<input type="submit" name="assign" value="Assign">';

// Option 2: Using a button tag (type="submit" is mandatory here)
echo '<button type="submit" name="assign">Assign</button>';

2. Event Delegation for Dynamic Elements (If Using Custom JS) #

If you added custom click event listeners to the button before it was loaded via Ajax, those listeners won't apply to the dynamically injected element. Event listeners only bind to elements that exist in the DOM when the listener is first attached.

Fix: Use Event Delegation #

Bind your submit logic to a parent element that exists on page load (like the form itself) instead of the button directly:

// Listen for clicks on the form, check if the target is the assign button
document.querySelector('form').addEventListener('click', function(e) {
  if (e.target.name === 'assign') {
    e.preventDefault(); // Optional: add pre-submit logic here if needed
    this.submit(); // Manually trigger form submission
  }
});

3. Accidental Event Blocking #

Double-check your Ajax success callback code to make sure you aren't accidentally stopping event propagation with event.stopPropagation() or event.preventDefault() in a way that blocks the button's submit action.

Quick Debugging Steps #

1. Inspect the Button: Open your browser's DevTools (F12) → Elements tab, and verify the button has name="assign" and type="submit".
2. Check Network Requests: Go to the Network tab, click the button, and see if a POST request is sent. If not, the button isn't triggering submission. If it is, check if the assign parameter is present in the request body.

内容的提问来源于stack exchange，提问作者Anu