If you're using Vue then add the prevent modifier to the click event.
<button @click.prevent="method">Next</button>
But why not use an autosuggest field?
Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.
I have a form that i used to add data to database, then i have a value that need to be choose from a database table, what i have in my mind is make a button, then after i click the button, it pop up a modal dan have pagination table, i already do this, but after clicking next it goes to another page. Any help would be appreciated. I didn't have another idea in my mind beside pagination.
Beside the field /s you want looked up you have code to open the lookup table:
echo '<a href="JavaScript:void(0);" onclick="WriteBack()">Click Me</a>';
Which calls this code to open and center new popup window
function WriteBack() {
var iMyWidth;
var iMyHeight;
iMyWidth = (window.screen.width / 2) - (250 + 10);
iMyHeight = (window.screen.height / 2) - (250 + 50);
var map = window.open("/pets/owner/indexsch", "map", "status=no,height=500,width=500,resizable=yes,left=" + iMyWidth + ",top=" + iMyHeight + ",screenX=" + iMyWidth + ",screenY=" + iMyHeight + ",toolbar=no,menubar=no,scrollbars=no,location=no,directories=no");
}
The table that's loaded has unique row id's so you can call this now once a row id is clicked
<script>
$(function () {
function makeAJAXRequest (text) {
$.ajax({
url: 'owner/getowner',
type: 'GET',
dataType: 'json',
data: { id: text },
success: processSuccess
});
}
function processSuccess (data) {
$.each(data, function (key, value) {
var id = '#' + key,
elem = window.opener.$(id);
if (key === 'ocheck') {
elem.attr('checked', value === '1');
}
else {
elem.val(value);
}
});
self.close();
}
$("#myTable td:nth-child(1)").click(function (event) {
event.preventDefault();
var $td = $(this).closest('tr').children('td');
var currentCellText = $td.eq(0).text();
makeAJAXRequest(currentCellText);
});
});
</script>
This in turn retrieves the correct owner from database, note old example, not laravel code, but basics are the same or similar.
public function getowner()
{
$this->chkLog();
$ownerid = $_GET['id'];
$row = end($this->Owner->getownerList2($ownerid));
// above line calls model to retrieve data
$petowner = $row->oname;
$ostreet = $row->ostreet;
$odate = $row->odate;
$ocheck = $row->ocheck;
echo json_encode(compact('ownerid', 'petowner', 'ostreet', 'odate', 'ocheck'));
//echo json_encode($row);
}
just a quick example, security would need to be implmented, etc.
But you really need to take some tutorials and view some youtube videos on ajax and json return. Doesn't even have to be json, even an array return works.
There are other options for you, like select2 https://select2.org/
Please or to participate in this conversation.