How to pass value of selected row to pop up alert?

Question

I have table that consist of value. So each row have duplicate button. When user push the duplicate button, it will send the value to the sweetalert2 pop up. But, it doesn't get the value. I already call the {{item->description}} inside the text at sweetalert, but it don't pass the value? How to pass it? I pass the {{item->id}} at duplicate button, but it doesn't work.

html

<table class="table table-striped">
        <thead>
            <tr>
                <th scope="col">#</th>
                <th scope="col">Description</th>
                <th scope="col">Plan</th>
                <th scope="col">From</th>
                <th scope="col">To</th>
                <th scope="col">Amount (RM)</th>
                <th scope="col">Action</th>
            </tr>
        </thead>
        <tbody>
            <?php $count = 1; ?>
            @foreach ($packages as $item)

            <tr>
                <th scope="row">{{$count++}}</th>
                <td>{{$item->description}}</td>
                <td>{{$item->Plan->name}}</td>
                <td>{{$item->from}}</td>
                <td>{{$item->to}}</td>
                <td>{{$item->price}}</td>
                <td>
                <a class="btn btn-xs btn-dark" href="/admin/insurance/product/package/edit/{{$product->id}}/{{$item->id}}">Edit</a>
                    <a class="deletePlanRecord btn btn-xs btn-danger" data-id="{{ $item->id }}"
                        id="delete" href="#">Delete</a>
                <a class="duplicatePlanRecord btn btn-xs btn-danger" data-id="{{ $item->id }}"
                            id="delete1" href="#">Duplicate</a>
                </td>
            </tr>
            @endforeach
        </tbody>
    </table>

javascript

$( ".duplicatePlanRecord" ).click(function(e) {

   Swal.fire({
   title: 'Are you sure to duplicate the plan?',
   text: 'try {{$item->description}}',
   input: 'text',
   inputAttributes: {
       autocapitalize: 'off'
   },
   showCancelButton: true,
   confirmButtonText: 'Look up',
   showLoaderOnConfirm: true,
   preConfirm: (login) => {
       return fetch(`//api.github.com/users/${login}`)
           .then(response => {
              if (!response.ok) {
                throw new Error(response.statusText)
              }
              return response.json()
            })
        .catch(error => {
          Swal.showValidationMessage(
            `Request failed: ${error}`
          )
        })
    },

Answer 1

Add one more data attribute (data-description) to duplicate button link as well as remove repetitive id (id="delete1") from it,not needed:-

<a class="duplicatePlanRecord btn btn-xs btn-danger" data-id="{{ $item->id }}" data-description="{{ $item->description }}" href="javascript:void(0);">Duplicate</a>

And in JavaScript do below changes:

$( ".duplicatePlanRecord" ).click(function(e) {
    var id = $(this).data('id'); //get id
    var desc = $(this).data('description'); //get description
    Swal.fire({
        title: 'Are you sure to duplicate the plan?',
        text: 'try id', // or use 'try desc'
        .... rest of the code

Note:- In case 'try id' or 'try desc' not work then use 'try '+id or 'try '+desc . As well as remove repetitive (id="delete") from other link as well.