skip to Main Content

I am beginner in javascript.

I have a GET api for Customer lists. I am consuming it in jquery and displaying customer list in html table.

  $('document').ready(function(){
    $.get('http://127.0.0.1:8000/api/customers',function(result){
      $.each(result, function(data, value){
        $('.custtable').append(
          '<tr>'+
          '<td><a id="'+value.id+'" class="btn btn-sm btn-info" href="">View</a></td>' +
          '<td>'+ value.first_name + " " + value.last_initial + '</td>' +
          '<td>' + value.phone + '</td>' +
          '</tr>'
        )
      })
    })
  })

So every customer row has a button View. What I want is, when I click on the View button, another ‘Customer detail’ page should open which will be consuming customer detail api.
for example when I click on View button with customer id = 12, the next page should consume api which is http://127.0.0.1:8000/api/customerdetail/12 .
How to achieve this ?

2

Answers


  1. You can give your link a query parameter like this: /customer/view.html?id=12.

    On your view.html page you can read this query parameter

    const params = new URLSearchParams(window.location.search)
    const id = params.get('id')
    
    console.log(id)
    
    Login or Signup to reply.
  2. you can send id to navigation url="/http://127.0.0.1:8000/api/customerdetail?id=12 on button click
    and at customerdetail page fetch the id from url

     var a = window.location.href
        var c = a.substring(a.lastIndexOf('=')+1)
         id=parseInt(c)
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search