使用多个按钮返回未定义的序列化表单

问题描述 投票:0回答:0

我目前正在尝试使用两个不同的按钮将表单传递给 ajax。目前,我只有一个按钮处于活动状态,但我发现我的表单未定义 - 因此 ajax 无法获取表单。我相信我的问题一定在于我如何调用按钮事件(也许表单没有提交?),但不知道如何正确调用按钮。

PHP(HTML)

echo "<br /><br /><br /><h1>Withdraw Credit</h1>
        <body>
            <div class=\"formcontainer\">
            <form id=\"requestcreditform\">
              <div class=\"container\">
                <label for=\"credit_requested\"><strong>Credit Requested</strong></label>
                <input type=\"hidden\" name=\"userid\" id=\"userid\" value=".$activeuser[0]->id.">
                <input type=\"number\" name=\"creditreq\" placeholder=\"".$remaining_credit."\" id=\"creditreq\" required>
                <br /><p>This change will be reflected upon submission and your credit processed shortly afterwards.  All loans begin with a 20% interest rate, which compounds annually.  Please verify the requested credit is correct prior to hitting the \"Request via Check\" button.  Checks will be addressed to the client and shipped to the attorney's practice.  Thank you.
                </p>
              </div>
                <button id=\"request_check_button\" type=\"submit\"><strong>Request via Check (Standard Shipping)</strong></button>
                
                <button id=\"request_expedited_check_button\" type=\"submit\"><strong>Request via Check (Expedited Shipping + $15)</strong></button>
           </form>
            </div>
          </body>
          <br /><br /><br />
        </html>";

JQuery

(function($){
  $('#request_check_button').click(function(event) {
    event.preventDefault();
    
    var endpoint = '<?php echo admin_url('admin-ajax.php');?>';
            
    var form = $('#requestcreditform').serialize();        
            
    var formdata = new FormData;
    
    formdata.append('action', 'ordercheck');
    formdata.append('ordercheck', form);
    
    $.ajax(endpoint, {
      type: 'POST',
      data: formdata,
      processData: false,
      contentType: false,
      
      success:function(res) {
        alert(res.data);
        location.reload();
      },
      error: function(err) {
      }
    })
  })
})(jQuery)

我也试过寻找 html 元素的各个 ID,但这实际上破坏了我的 ajax 功能——使我离找到解决方案更远了。 ajax 似乎是正确的 - 问题出在我未定义的表单数据上。

编辑:最后,我放弃了尝试提交带有多个按钮的表单,并恢复为单个按钮设计,用复选框代替我的多个选项。

html jquery ajax forms button
© www.soinside.com 2019 - 2024. All rights reserved.