私は現在、私の仕事でプロジェクトを開発しています.Laravelをフレームワークとして使用し、KeenThemesをフロントエンドとして使用しています。彼らには Datatables ライブラリのバリエーションがあると思います。おそらくそれが原因で、この問題が発生しています。よく文書化されたメトロニック Datatable ライブラリの例が見つからないため、元の Datatable ドキュメントを使用してこのプロジェクトに取り組んでいます。さて、問題に進みます。これは、データテーブルのブレード コンポーネントです。
<div class="m-portlet m-portlet--mobile m-portlet--rounded">
<div class="m-portlet__head">
<div class="m-portlet__head-caption">
<div class="m-portlet__head-title">
{{$title}}
</div>
</div>
<div class="m-portlet__head-tools">
{{$buttons}}
<ul class="m-portlet__nav">
<li class="m-portlet__nav-item">
<div class="m-dropdown m-dropdown--inline m-dropdown--arrow m-dropdown--align-right m-dropdown--align-push" m-dropdown-toggle="hover"
aria-expanded="true">
<a href="#" class="m-portlet__nav-link btn btn-lg btn-secondary m-btn m-btn--icon m-btn--icon-only m-btn--pill m-dropdown__toggle">
<i class="la la-ellipsis-h m--font-brand"></i>
</a>
<div class="m-dropdown__wrapper">
<span class="m-dropdown__arrow m-dropdown__arrow--right m-dropdown__arrow--adjust"></span>
<div class="m-dropdown__inner">
<div class="m-dropdown__body">
<div class="m-dropdown__content">
<ul class="m-nav">
<li class="m-nav__section m-nav__section--first">
<span class="m-nav__section-text">Acciones</span>
</li>
{{$actions}}
<li class="m-nav__separator m-nav__separator--fit m--hide">
</li>
<li class="m-nav__item m--hide">
<a href="#" class="btn btn-outline-danger m-btn m-btn--pill m-btn--wide btn-sm">Submit</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>
<div class="m-portlet__body">
{{-- begin - search input --}}
<div class="m-form m-form--label-align-right m--margin-top-20 m--margin-bottom-30">
<div class="row align-items-center">
<div class="col-xl-8 order-2 order-xl-1">
<div class="form-group m-form__group row align-items-center">
<div class="col-md-4">
<div class="m-form__group m-form__group--inline">
<div class="m-form__label">
<label>Status:</label>
</div>
<div class="m-form__control">
<select class="form-control m-bootstrap-select" id="m_form_estado">
<option value="">All</option>
<option value="1">En servicio</option>
<option value="6">En Busqueda</option>
<option value="5">En Saneamiento</option>
<option value="3">En Obra</option>
<option value="2">En Instalación</option>
<option value="4">Listo Para Ejecutar</option>
<option value="12">Sin Estado</option>
<option value="14">Caido</option>
<option value="15">Retirado</option>
</select>
</div>
</div>
<div class="d-md-none m--margin-bottom-10"></div>
</div>
<div class="col-md-4">
<div class="m-form__group m-form__group--inline">
<div class="m-form__label">
<label class="m-label m-label--single">Type:</label>
</div>
<div class="m-form__control">
<select class="form-control m-bootstrap-select" id="m_form_type">
<option value="">All</option>
<option value="1">Online</option>
<option value="2">Retail</option>
<option value="3">Direct</option>
</select>
</div>
</div>
<div class="d-md-none m--margin-bottom-10"></div>
</div>
<div class="col-md-4">
<div class="m-input-icon m-input-icon--left">
<input type="text" class="form-control m-input" placeholder="Search..." id="generalSearch">
<span class="m-input-icon__icon m-input-icon__icon--left">
<span><i class="la la-search"></i></span>
</span>
</div>
</div>
</div>
</div>
</div>
</div>
{{-- end - search input --}}
<!--begin: Datatable -->
<div class="m_datatable" id="m_datatable"></div>
<!--end: Datatable -->
</div>
さて、これはテーブルをレンダリングしてデータを入力するために使用する javascript の一部です。貼り付ける部分は、データを検索する機能を定義する場所であり、行から取得したい列の定義も定義します。
{
field: "IdEstacion",
title: "#",
width: 40,
sortable: !0,
selector: !1,
textAlign: "center",
responsive: {
hidden: 'lg'
},
template: '{{IdEstacion}}',
query: {},
sort: {
sort: "asc",
field: "IdEstacion"
}
{...}
$("#m_datatable").on("click", "tr", function () {
var tr=$(this).parents("tr")[0];
var row=t.row(row).data();
console.log(row));
alert(row);
})
コンソールを確認し、デバッグで値も確認しましたが、行はオブジェクトを返していますが、クリックした行だけでなくデータテーブル全体を返しています。行変数から値を参照しようとすると、コンソールとアラートで未定義のままになります。何か不足していますか？前もって感謝します。
編集: json 構造を追加する
