Атрибуты данных не обнаруживаются JQuery
Я пытался передать эти данные через атрибут data, который затем будет использоваться JQuery, но по какой-то причине некоторые из них не определены, когда я их консольно регистрирую. Как вы можете видеть на рисунке, только переменные $subscription->id и $subscription->tax считываются JQuery, в то время как остальные не определены.
Я использую laravel blade, и это код, который отвечает за отправку этих данных в JQuery:
<a
class="btn btn-sm mt-1 btn-light btn-outline-dark col-12"
href="#"
data-toggle="modal"
data-target="#edit-subscription-modal"
data-id="{{$subscription->id}}"
data-cId="{{$subscription->customer_id}}"
data-uId="{{$subscription->user_id}}"
data-pId="{{$subscription->product_id}}"
data-sDate="{{$subscription->startDate}}"
data-eDate="{{$subscription->endDate}}"
data-pTerms="{{$subscription->paymentTerms}}"
data-tax="{{$subscription->tax}}"
>Edit</a>
Когда я dd() переменные в блейд - файле они действительно возвращают данные, но когда я консольно регистрирую их в JQuery, они получаются как undefined. Это блок кода JQuery:
$('#edit-subscription-modal').on('show.bs.modal', function (event) {
var button = $(event.relatedTarget) // Button that triggered the modal
var subscriptionId = button.data('id')
var customerId = button.data('cId')
var userId = button.data('uId')
var productId = button.data('pId')
var startDate = button.data('sDate')
var endDate = button.data('eDate')
var paymentTerms = button.data('pTerms')
var tax = button.data('tax')
var modal = $(this)
console.log(subscriptionId)
console.log(customerId)
console.log(userId)
console.log(productId)
console.log(startDate)
console.log(endDate)
console.log(paymentTerms)
console.log(tax)
modal.find('.modal-body #subscription-id').val(subscriptionId)
})
Я пытался изменить названия $subscription->id0, но все еще не было сигары. Надеюсь, кто-нибудь прольет на это свет.
Ответы - Атрибуты данных не обнаруживаются JQuery / Data attributes not getting detected by JQuery
12.10.2020 07:12:18
вам нужно добавить класс в тег <a>, а затем прослушать событие click для этого класса, например
<a
class="btn btn-sm mt-1 btn-light btn-outline-dark col-12 subscription-modal-click"
href="#"
data-toggle="modal"
data-target="#edit-subscription-modal"
data-id="{{$subscription->id}}"
data-cId="{{$subscription->customer_id}}"
data-uId="{{$subscription->user_id}}"
data-pId="{{$subscription->product_id}}"
data-sDate="{{$subscription->startDate}}"
data-eDate="{{$subscription->endDate}}"
data-pTerms="{{$subscription->paymentTerms}}"
data-tax="{{$subscription->tax}}"
>Edit</a>
<script>
$('.subscription-modal-click').click(function(){
var button = $(this) // Button that triggered the modal
var subscriptionId = button.data('id')
var customerId = button.data('cId')
var userId = button.data('uId')
var productId = button.data('pId')
var startDate = button.data('sDate')
var endDate = button.data('eDate')
var paymentTerms = button.data('pTerms')
var tax = button.data('tax')
var modal = $(this)
console.log(subscriptionId)
console.log(customerId)
console.log(userId)
console.log(productId)
console.log(startDate)
console.log(endDate)
console.log(paymentTerms)
console.log(tax)
modal.find('.modal-body #subscription-id').val(subscriptionId)
})
</script>