使用jquery在方法中发送参数

时间:2017-10-30 06:37:02

标签: jquery forms post parameters submit

如何发送表单提交方法的参数??

这就是我正在尝试的。

 form.submit().val('#result').val(); // this doesnt work

我想将$('#result')的值发送到表单提交方法。 I,E。当我单击表单中的提交按钮时,$(#result).val()有一个元素数组,必须作为参数发送到submit方法。 #result是一个段落。这是一个POST方法

  <form method="post" action="{{url('api/v1/vendors/store')}}">

                    <u><h1> New Vendor</h1></u>

      <div class="form-group row" id="myform">


            {{--  insertion for addresss table  --}}
            <label for="lgFormGroupInput" class="col-sm-2 col-form-label col-form-label-lg">Bank A/C Number</label>
            <div class="col-sm-10">
                <input type="text" class="form-control form-control-lg" id="lgFormGroupInput" placeholder="A/c Number" name="bank_account_no">
              </div>
            </div>

          <div class="form-group row">
            <label for="smFormGroupInput" class="col-sm-2 col-form-label col-form-label-sm">Bank Account Name</label>
            <div class="col-sm-10">
                <input type="text" class="form-control form-control-lg" id="lgFormGroupInput" placeholder="Bank Account Name" name="bank_account_name">
              </div>
            </div>

          <div class="form-group row">
            <label for="smFormGroupInput" class="col-sm-2 col-form-label col-form-label-sm">Account Type</label>
            <div class="col-sm-10">
                <input type="text" class="form-control form-control-lg" id="lgFormGroupInput" placeholder="A/c Type eg: sa, ca" name="account_type">
            </div>
            </div>

          <div class="form-group row">
            <label for="smFormGroupInput" class="col-sm-2 col-form-label col-form-label-sm">Name</label>
            <div class="col-sm-10">
              <input type="text" class="form-control form-control-lg" id="lgFormGroupInput" placeholder="Name" name="name">
            </div>
          </div>

          <div class="form-group row">
            <label for="smFormGroupInput" class="col-sm-2 col-form-label col-form-label-sm">Short code</label>
            <div class="col-sm-10">
              <input type="text" class="form-control form-control-lg" id="lgFormGroupInput" placeholder="Eg: INF, KFC" name="code">
            </div>
          </div>

          <div class="form-group row">
            <label for="smFormGroupInput" class="col-sm-2 col-form-label col-form-label-sm">Active</label>
            <div class="col-sm-10">
            Activate <input type="checkbox" name="active" value="1" checked> <br>

              {{--  <input type="number"  class="form-control form-control-lg" id="lgFormGroupInput" placeholder="Activation Status 0 or 1" name="active" >  --}}
            </div>
          </div>

          <div class="form-group row">
            <label for="smFormGroupInput" class="col-sm-2 col-form-label col-form-label-sm">verified</label>
            <div class="col-sm-10">
            Verified <input type="checkbox" name="verified" value="1" checked> <br>
              {{--  <input type="number"  class="form-control form-control-lg" id="lgFormGroupInput" placeholder="Verification Status 0 or 1" name="verified" >  --}}
            </div>
          </div>

          <div class="form-group row">
            <label for="smFormGroupInput" class="col-sm-2 col-form-label col-form-label-sm">verified_date</label>
            <div class="col-sm-10">
              <input type="text" class="form-control form-control-lg" id="lgFormGroupInput" placeholder="Date" name="verified_date">
            </div>
          </div>

          <div class="form-group row">
            <label for="smFormGroupInput" class="col-sm-2 col-form-label col-form-label-sm">address_id</label>
            <div class="col-sm-10">
              <input type="number" class="form-control form-control-lg" id="lgFormGroupInput" placeholder="Address ID fk" name="address_id">
            </div>
          </div>

          <div class="form-group row">
            <label for="smFormGroupInput" class="col-sm-2 col-form-label col-form-label-sm">PAN Number</label>
            <div class="col-sm-10">
              <input type="text" class="form-control form-control-lg" id="lgFormGroupInput" placeholder="PAN Number" name="pancard_no">
            </div>
          </div>


          <div class="form-group row">
            <label for="smFormGroupInput" class="col-sm-2 col-form-label col-form-label-sm">Phone</label>
            <div class="col-sm-10">
              <input type="text" class="form-control form-control-lg" id="lgFormGroupInput" placeholder="Phone" name="phone_no">
            </div>
          </div>
          <div class="form-group row">
            <label for="smFormGroupInput" class="col-sm-2 col-form-label col-form-label-sm">Contact Person</label>
            <div class="col-sm-10">
              <input type="text" class="form-control form-control-lg" id="lgFormGroupInput" placeholder="Contact Name" name="contact_person">
            </div>
          </div>


          <div class="form-group row">
            <label for="smFormGroupInput" class="col-sm-2 col-form-label col-form-label-sm">Contact Email</label>
            <div class="col-sm-10">
              <input type="email" class="form-control form-control-lg" id="lgFormGroupInput" placeholder="email" name="contact_email">
            </div>
          </div>

        {{--  submit button   --}}
      <div class="form-group row">
        <div class="col-md-2"></div>
        <input type="submit" class="btn btn-primary">
      </div>


    </form>
</div>



<script>

  $(document).ready(function(){

      $.fn.serializeObject = function()
  {
      var o = {};
      var a = this.serializeArray();
      $.each(a, function() {
          if (o[this.name] !== undefined) {
              if (!o[this.name].push) {
                  o[this.name] = [o[this.name]];
              }
              o[this.name].push(this.value || '');
          } else {
              o[this.name] = this.value || '';
          }
      });
      return o;
  };

  $(function() {
      $('form').submit(function() {
          $('#result').text(JSON.stringify($('form').serializeObject()));

        //  $('#result').text(JSON.stringify($('form').serializeObject()));
         form.submit().val('#result');
          //return false;
      });
  });

  });


</script>

<h2>JSON</h2>
<pre id="result">
</pre>

1 个答案:

答案 0 :(得分:0)

如果使用ajax,

会更容易

调整代码,您可以使用来自<pre>标记的值传递整个元素,而不是发送参数。 还可以创建一个在单击提交按钮时运行的功能。

- HTML -

  • 在表单上添加ID
<form id="yourForm">
</form>
  • 为“提交按钮”添加ID
<div class="form-group row">
      <div class="col-md-2"></div>
      <input type="submit" class="btn btn-primary" id="SubmitBtn">
</div>

- 的JavaScript -

$(document).on("click","#SubmitBtn", function(){
   var pre_code = $("#result").html();
   $('#yourForm').append("<textarea name='myparam'>"+pre_code+"</textarea>");
   $('#yourForm').submit();

});

- api / v1 / vendors / store file -

然后你可以访问你的param

$result = $_POST['myparam'];