Question

我想将复选框值添加到m_data变量，我想将此m_data发送到其他页面，我已成功发送其他详细信息，但在复选框中遇到问题，请指导我

以下是我的js文件和html文件

< script >
  $(document).ready(function() {
    $("#submit").click(function() {

      //data to be sent to server         
      var m_data = new FormData();
      m_data.append('name', $('input[name=name]').val());
      m_data.append('email', $('input[name=email]').val());
      m_data.append('mobile', $('input[name=mobile]').val());
      m_data.append('message', $('textarea[name=message]').val());
      m_data.append('file', $('input[name=file]')[0].files[0]);

      var favorite = [];
      $.each($("input[name='service']:checked"), function() {
        favorite.push($(this).val());
      });

      m_data.append(favorite);

      //instead of $.post() we are using $.ajax()
      //that's because $.ajax() has more options and flexibly.
      $.ajax({
        url: 'send_file_upload.php',
        data: m_data,
        processData: false,
        contentType: false,
        type: 'POST',
        dataType: 'json',
        success: function(result) {
          alert("Your message is successfully sent");
          $("#name").val("");
          $("#inputEmail").val("");
          $("#mobile").val("");
          $("#details").val("");
          $("#service").removeAttr('checked');
          $("#service1").removeAttr('checked');
          $("#service2").removeAttr('checked');
          $("#service3").removeAttr('checked');
          $("#fileToUpload").val("");
          $("#txtInput").val("");
        }
      });


    })
  });

< /script>

<div class="col-md-6 address" style=" height:auto;">
  <img src="img/fb.png" style="border: 0px;">
  <h4>Feed Back</h4>
  <!-- form -->
  <div class="clearfix"></div>

  <div class="row">
    <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
      <label>Name</label>
      <input name="name" type="text" class="form-control" id="name" placeholder="Name" required>
    </div>

    <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
      <label>Email</label>

      <input name="email" type="email" class="form-control" id="inputEmail" placeholder="Email" data-error="Bruh, that email address is invalid" required="">
    </div>

    <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
      <label>Mobile</label>
      <input name="mobile" type="tel" class="form-control" id="mobile" placeholder="Mobile" required>
    </div>

  </div>
  <div class="row">
    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
      <label>Slect Services</label>
      <div class="clearfix"></div>
      <div class="checkbox" style="padding:0px 0px 0px 20px;">
        <label style="padding:0px 10px;">
          <input type="checkbox" id="service" name="service" value="Medical Billing">Medical Billing</label>

        <label style="padding:0px 10px;">
          <input type="checkbox" id="service1" name="service" value="Medical Coding">Medical Coding</label>

        <label style="padding:0px 10px;">
          <input type="checkbox" id="service2" name="service" value="Data Management">Data Management</label>

        <label style="padding:0px 10px;">
          <input type="checkbox" id="service3" name="service" value="Accounts Receivable">Accounts Receivable</label>
      </div>
    </div>

  </div>
  <div class="row">

    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">


      <label>Details</label>
      <textarea name="message" class="form-control" id="details" required></textarea>
    </div>
    <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
      <label>
        <h4>Select File to upload:</h4>
      </label>
      <input type="file" name="file" id="fileToUpload">

    </div>


    <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
      <label>
        <h4>Enter Code Below</h4>
      </label>
      <div class="clearfix"></div>
      <span id="txtCaptchaDiv" style="background-color: #337ab7;color:#FFF; float: left; padding: 5px; width:120px; text-align: center; margin-right: 10px; font-weight: normal; font-size:16px; font-style: italic;"></span>
      <input type="text" class="form-control" name="txtInput" id="txtInput" placeholder="Enter Code" style="width:120px; left: left;" />
      <input type="hidden" id="txtCaptcha" />

    </div>
    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
      <br />

      <input type="submit" value="submit" id="submit" class="btn btn-primary reset">
    </div>

  </div>
</div>

Answer 1

你可以试试这段代码

m_data.append('service', $('input[name="service"]:checked').val());

Answer 2

var favorite = [];
        $.each($("input[name='service']:checked"), function(){            
            favorite.push($(this).val());
        });

        m_data.append('service[]',favorite);

我这样做是为了解决

Answer 3

我不确定您是否从表单中获取了值。当我使用复选框时，我检查它是否被选中，然后给变量值1，然后我将其添加到ajax帖子

if($('.checkboxEmail').is(":checked")){
  formEmail=1; 
} else{
  formEmail=0;
}

你可以在你的$ .each中做同样的事情......

如何附加复选框值以在ajax中发送数据？

3 个答案: