将HTML输入值传递给jQuery表单值

时间:2018-06-22 10:08:00

标签: javascript php jquery laravel forms

有一个表单,我需要将HTML文本输入值传递给Stripe表单。

我该如何实现?

我所拥有的代码段

<input type="text" name="trip" id="trip" value="">

JS :(表单的部分

.append(jQuery('<input>', {
        'name': 'trip',
        'value': getElementById('#trip'),
        'type': 'hidden'
      }))

我为获取该价值所做的尝试:

  • 'value': $("#trip").val(),
  • 'value': document.querySelector('#trip'),
  • 'value': document.getElementById('#trip')

在这一点上,我只是在谷歌搜索和猜测。 = /


### UPDATE ###

我试图避免代码转储,但问题可能还有很多。

这是更详细的更新。
我需要将表单的一部分存储在数据库中,并不断收到此错误。

我已经尝试了该线程中的大多数解决方案,但始终收到此错误。

  

SQLSTATE [23000]:违反完整性约束:1048列   gift_trans_fee'不能为空

这是我需要将HTML传递给Stripe脚本的原因。

大多数JS表单字段用于在Stripe中创建费用/客户, 但是我有一些东西需要存储在数据库中

HTML字段

<input type="checkbox" class="faChkSqr" value="yes" name="gift_trans_fee" id="gift-check" autocomplete="off" checked>

   //DEPENDING ON WHAT'S CHOSEN WILL BRING UP DIFFERENT FIELDS  
<select onchange="tripbehalf(this);" class="custom-select marb-15" id="tripbehalf">
<option selected="true">Optional Info</option>
<option value="trip">This is for a trip.</option>
<option value="behalf">This is on behalf of...</option>
<option value="both">Both Options</option>
</select>

<input type="text" id="trip_participants" name="trip_participants" value="">

<input type="text" id="behalf_of" name="behalf_of" value="">

完整JS表单

function createHandler(route) {
return StripeCheckout.configure({
key: '{{ config("services.stripe.key") }}',
image: 'https://xxxx-stripe.jpg',
locale: 'auto',
token: function(token) {
  // Use the token to create the charge with a server-side script.
  // You can access the token ID with `token.id`
  var newForm = jQuery('<form>', {
    'action': route,
    'method': 'POST',
  }).append(jQuery('<input>', {
    'name': 'stripe_token',
    'value': token.id,
    'type': 'hidden'
  })).append(jQuery('<input>', {
    'name': 'csrfmiddlewaretoken',
    'value': getCookie('csrftoken'),
    'type': 'hidden'
  })).append(jQuery('<input>', {
    'name': 'amount',
    'value': Math.round(document.querySelector('.total').innerText * 100),
    'type': 'hidden'
  })).append(jQuery('<input>', {
    'name': 'email',
    'value': token.email,
    'type': 'hidden'
  }))
///EXTRA VALUES NEEDED IN DATABASE///
  .append(jQuery('<input>', {
    'name': 'gift_trans_fee',
    'value': getElementById('gift-check'),
    'type': 'hidden'
  })).append(jQuery('<input>', {
    'name': 'trip',
    'value': getElementById('tripbehalf'),
    'type': 'hidden'
  })).append(jQuery('<input>', {
    'name': 'trip_participants',
    'value': getElementById('trip_participants'),
    'type': 'hidden'
  })).append(jQuery('<input>', {
    'name': 'behalf',
    'value': getElementById('tripbehalf'),
    'type': 'hidden'
  })).append(jQuery('<input>', {
    'name': 'behalf_of',
    'value': getElementById('behalf_of'),
    'type': 'hidden'
  }));


  $("body").append(newForm);
  newForm.submit();
}
});
}

PHP逻辑:

$stripeTransaction->transactions()->create([
    'user_id' => auth()->id(),
    'customer_email' => $charge->receipt_email,
    'amount' => $charge->amount,
    'recurring' => false,
    'gift_trans_fee' => $request->gift_trans_fee,
    'trip' => $request->trip,
    'trip_participants' => $request->trip_participants,
    'behalf' => $request->behalf,
    'behalf_of' => $request->behalf_of,

]);

2 个答案:

答案 0 :(得分:2)

使用$('#trip').val()

.append(jQuery('<input>', {
        'name': 'trip',
        'value': $('#trip').val(),
        'type': 'hidden'
      }))

或删除#

   .append(jQuery('<input>', {
            'name': 'trip',
            'value': document.getElementById('trip').value,
            'type': 'hidden'
          }))

答案 1 :(得分:1)

只是做

var inputtext = jQuery("#trip").val();

如果没有其他包含ID行程的字段,因为它是一个ID,则应该没有问题。

使用

jQuery(idorclassorsomething).html(inputtext);

显示您的文本,将idorclass或其他内容更改为您想要显示输入文本的id,class或其他内容。您可能希望将其放在按钮上,或在按下或按下键盘上的键。