I have a table that contains certain data. This data is dynamic and fetched from the database. I want to prevent the button from working if there is no relevant data (long straight line — ) in a column of this table. That is, the post(submit) operation should not occur.
Why do I want this? If there is no long straight line ( — ), then there is data here. Therefore, the relevant submit button should not work again. I wrote the following code to accomplish this. However, this is not working. Actually, I'm accessing the data but not deactivating the button.
<?php
//$args = array(1,2,3,4...);
$args = array(1,2,3); ?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<title>Document</title>
</head>
<body>
<table>
<thead>
<tr>Column 1</tr>
<tr>Column 2</tr>
<tr>Column 3</tr>
</thead>
<tbody>
<?php foreach ($args as $key => $value) { ?>
<tr>
<td>A</td>
<td><span class="related"> <?php echo !empty($value) ? $value:' — '; ?></span></td>
<form action="" method="post">
<td>
<input type="hidden" name="id">
<button type="submit" class="create-1"></button>
<button type="submit" class="create-2"></button>
<button type="submit" class="create-3"></button>
</td>
</form>
<script type="text/javascript">
jQuery(".create-1").submit(function(e){
jQuery(function() {
jQuery("span.related").each(function(index, element) {
if(jQuery(this).text() !== ' — '){
e.preventDefault();
}
});
});
});
</script>
</tr>
<?php }?>
</tbody>
</table>
</body>
</html>
