HTML element passing first value in PHP array - javascript

I've got a php page that gets data from mysql database as $certs[] and populates that as a table:
($db is read from file, it is constant)
<?php echo $cert["id"] ?>
<button type="button" class="awe" title="Edit" id="editbtn" onclick="openNewModalWithValue('Modal2')" value =<?php echo $cert["id"] ?> >&#xf019</button>
<form action="sample.php" method="POST">
<input type="hidden" name="id" value=<?php echo $cert["id"] ?>>
<input type="hidden" name="db" value=<?php echo $db ?>>
<button type="submit" name="mission" title="Delete">&#xf00d</button>
</form>
And I try to get id value in Modal window. (Like press 'EDIT' button and you get modal window with values set.) So my Modal window is:
<form id="modal-form" method="POST" action="sample2.php">
<input type="number" id="idb" name="idbase" />
<input type="text" id="nme" name="name"/>
<input type="hidden" name="db" value=<?php echo $db; ?>>
<input type="hidden" id= "idbs" name="idbs" />
<button id="form-submit" type="submit" >Edit</button>
</form>
and the Javascript for opening modal window is:
function openNewModalWithValue(modal){
document.getElementById(modal).style.display = "block";
document.getElementById("idb").value = document.getElementById("editbtn").value;
}
The problem is that even though PHP sends $certs[] values correctly, and table populates correctly, when I hit 'edit' button, I get preserved values of item#1 in PHP array, no matter which row/data I click.
Is there an easier way rather than applying counter to every row and operating with it?

Problem may be idb is multiple id in DOM. document.getElementById find Dom in whole page. so you must provide unique id

Related

Form is auto submitting but the data is not getting passed/received

I have a problem in automating a form with hidden inputs in PHP. Basically I'm doing an input for a barcode scanner where the user will input the barcode and it will auto-submit, just like in a cash registry.
The conflict which I think is the cause of the problem is because of a conditional form. Here is a snippet:
<form method="post" id="form1">
<div class="products">
<input type="text" name="code" class="form-control" autofocus required onchange="submit()" />
</div>
</form>
<?php
$query = 'SELECT * FROM product WHERE PRODUCT_CODE='.$code.' GROUP BY PRODUCT_CODE ORDER by PRODUCT_CODE ASC';
$result = mysqli_query($db, $query);
if ($result):
if(mysqli_num_rows($result)>0):
while($product = mysqli_fetch_assoc($result)):
?>
<form id="form2" method="post" action="pos.php?action=add&id=<?php echo $product['PRODUCT_CODE']; ?>" >
<input type="hidden" name="quantity" class="form-control" value="1" />
<input type="hidden" name="name" value="<?php echo $product['NAME']; ?>" />
<input type="hidden" name="price" value="<?php echo $product['PRICE']; ?>" />
<input type="submit" name="addpos" style="margin-top:5px;width: 462px" class="btn btn-info" value="Add"/>
</form>
<?php
endwhile;
endif;
endif;
?>
<script>
function submit() {
document.getElementById("form1").submit();
}
document.getElementById("form2").submit();
</script>
The data from form1 has no trouble auto-submitting, then the form2 will auto-submit but nothing happens. I need help on how can I make form2 auto-submit correctly too. I have tried different event handling for form2 but nothing happens. I only know a little bit of javascript so that's just how my script turned out.
Thank you, Programming kings!
Because the second form is inside the while loop, if there are multiple results there will be multiple forms with the same id = "form2".
You need an increment variable $incrm = 2 inside the loop,
form id='form<?php echo $incrm;?>',
with $incrm++ before ending it. I also recommend to add ann onchange event to the last input 'price' ; onchange = submit(this).
function submit(inp) {
inp.parentElement.submit();
}

Delete Button in a loop giving same ID in Laravel App

Good day. There is a list of items with two different buttons in my laravel app. One is for updating while the other deletes. I'm using a form (with POST methods) for the two buttons. So, basically, I have two forms on the page. The "update" button works quite well. But the delete button keep on giving me the same ID when I "dd" the request. I am using javascript to submit the "Delete" form because I want to use sweet alert for the user to confirm delete. The code is shown below. Please what may be wrong with it. Also, I'll be glad if I can get a better way of doing it.
This are my forms
<form action="{{route('update.cart')}}" method="POST">
{{csrf_field()}}
<input type="hidden" name="id" value="{{$product->id}}">
<td class="product-quantity"><input type="number" name="quantity" value="{{$product->quantity}}"></td>
<td class="product-subtotal">₦{{$product->price * $product->quantity}}</td>
<td class="product-remove">
<input type="submit" class="login-btn" value="Update" style="width:90px!important;text-transform: none!important;">
</form>
<form style="display: inline!important;" action="{{route('remove.cart')}}" method="POST" name="myForm" id="myForm">
{{csrf_field()}}
<?php
$id = $product->id;
?>
<input type="hidden" name="cart_id" value="<?php echo $id?>">
<button href="#" id="remove" type="button" onclick="removeItem({{$product->id}})"><i class="fa fa-trash" aria-hidden="true"></i></button>
</form>
</td>
My Javascript Code To Submit The Form
function removeItem(clicked){
document.getElementById('myForm').submit();
}
Controller
This gives me the same id in my controller irrespective of the button clicked
$item = $request->cart_id;
dd($item);
}
You are using the id myForm for every delete form. A page is only allowed to have an id once, because you have it multiple times, it always submits the first one.
Either remove the javascript and let the form submit directly or add unique id's for every form.
You can use AJAX to send request to your controller and add sweetalert inside success function provided by ajax.
HTML FORM
<form style="display: inline!important;" action="{{route('remove.cart')}}" method="POST" name="myForm" id="myForm">
{{csrf_field()}}
<?php
$id = $product->id;
?>
<input type="hidden" name="cart_id" value="<?php echo $id?>">
<button href="#" id="remove" type="button" onclick="removeItem({{$product->id}})"><i class="fa fa-trash" aria-hidden="true"></i></button>
</form>
JQUERY
var id = $('cart_id').value();
$('#myForm').onSubmit(function(e){
e.preventDefault();
$.ajax({
method:'POST',
url:"your link",
data:{
id
},
success: function(result)
{
sweetalert();
}
error: function(err) {}
})
})
}
Thanks all.
Changed my form and javascript to reflect the adjustments.
Form
{{csrf_field()}}
<?php
$id = $product->id;
?>
<input type="hidden" name="cart_id" value="<?php echo $id?>">
<button href="#" type="button" onclick="removeItem({{$product->id}})"><i class="fa fa-trash" aria-hidden="true"></i></button>
</form>
And my JS
function removeItem(clicked){
document.getElementById('myForm'+clicked).submit();
}
</script>

passing php variable as function argument

I have home.php and I am trying to pass two php variables in an onclick() function. But it does not work. I am new in php so any suggestion will be very helpful.
<form action="process/home.php" method="post">
<input type="text" name="userfrom" value="<?php echo htmlspecialchars($username); ?>"/>
<input type="submit" onclick=show('$user_id','$_SESSION['id']') value="Add Friend"/>
</form>
In the show() function I wanted to store the values in the database.
function show($userfrom,$userto){
$sql="INSERT INTO user (userfrom,userto) VALUES ('$userfrom','$userto')";
mysql_query($sql);
<!--it is not working-->
}
Your are new in php. So, remember this, you can't use PHP functions in JS code. onClick event needs js function. So firstly, you should pass your variables, with form then get it and after that you can use php functions.
You can use this code, but not recommended
<form action="" method="post">
<input type="text" name="userfrom" value="<?= htmlspecialchars($username); ?>"/>
<input type="submit" name="addFriend" />
</form>
<?php
if (isset($_POST['addFriend'])) {
show($user_id, $_SESSION['id']);
}
?>
You should learn about jquery ajax. (Advice for you)
Try below code, You have some syntax errors,
<form action="process/home.php" method="post">
<input type="text" name="userfrom" value="<?php echo htmlspecialchars($username); ?>"/>
<input type="submit" onclick="show(<?php echo $userid ; ?>, <?php echo
$_SESSION['id']; ?>)" value="Add Friend"/>
</form>
You need to echo your php variables into HTML elements.
onclick=show('<?=$user_id;?>','<?=$_SESSION['id'];?>')
shorthand for echo: <?=
and don't forget to add quotations when passing string values.

passing value when you press button

I am having trouble passing a value
when pressing this button(the code for the button down below).
<div class="timeline-footer">
<button class="btn btn-primary btn-xs" name="onderreact_btn" type="submit">Reageer</button>
</div>
It needs to give a <form> a id from that reaction.
the code for the form to save it in the db. this works just fine but now it needs to give the id from the reaction when pressing the button to this form.
<?php
if(isset($_POST['react_btn'])){
unset($q1);
$q1['reactie'] = $app->check_string($_POST['reactie']);
$q1['topic_id'] = $app->check_string($_POST['topicid']);
$q1['klant_id'] = $app->check_string($_POST['klantid']);
$q1['ledenpagina_id'] = $app->check_string($_POST['ledenpaginaid']);
$app->insert_query('reacties', $q1, 'id');
}
?>
<form action="" method="post">
<div class="form-group">
<label for="comment">Reactie:</label>
<textarea class="form-control" name="reactie" rows="3" id="comment"></textarea>
<input type="hidden" name="klantid" value="<?php echo $_SESSION["klant_id"] ?>">
<input type="hidden" name="topicid" value="<?php echo $actieftopicid ?>"
<input type="hidden" name="ledenpaginaid" value="<?php echo $_SESSION["ledenpagina_id"]; ?>">
<input type="hidden" name="onderreactieID" value="<?php echo $reactie; ?>">
<button type="submit" name="react_btn" class="btn btn-primary">Plaats reactie</button>
</div>
</form>
I think I need to make a hidden input where I post the reactionID in and make some kind of javascript variable with a default set to 0 and when pressing on a button it needs to give that value trough to this variable
If you just need a test, if the button was pressed, check if the button was submittd:
if (isset($_POST['react_btn')) {
// ...
}
But as the value of the button is it's text, you should also add an hidden field, storing your id.
Keep in mind, that you could also submit the form by pressing enter inside a textfield in the form - in this case, the button wasn't pressed!

How to retain values of randomly generated HTML text fields on page refresh?

I am creating HTML text at runtime like my following code.
<?php
session_start();
for(var i=1;i<=10;i++)
{
?>
<div id="mainDiv<?php echo $i; ?>">
<input type="text" id="myText<?php echo $i; ?>">
<button type="button" id="myButton<?php echo $i; ?>" onclick="myButtonClicked()">Click Me</button>
</div>
<?php
}
?>
It is working fine. Problem is now in retaining the values of these textboxes. When I refresh the page, all the values previously entered are gone. Do I need to create 10 sessions to retain the values of these 10 texts? Or, is there any other way of doing this?
You can use the locaStorage api for retain the user input by store/get to/from localStorage after page refresh.
setItem() and getItem() are used for store and get item from localStorage respectively.
Example
This html will be created by php
<input type="text" id="text1" value="" />
<button type="button" id="myButton1" onclick="myButtonClicked('text1')">Click Me</button>
<input type="text" id="text2" value="" />
<button type="button" id="myButton1" onclick="myButtonClicked('text2')">Click Me</button>
//like this other input and button will be created.
JS
if(localStorage.getItem('resArr') == null){
var resultArr = [];
}else{
resultArr = JSON.parse(localStorage.getItem('resArr'));
//---- get stored item from localStorage by json parsing
}
alert('the last item you entered is ' + resultArr[resultArr.length-1]);
function myButtonClicked(id){
var userVal = document.getElementById(id).value;
resultArr.push(userVal);
localStorage.setItem('resArr', JSON.stringify(resultArr));
//stored the entered value in localStorage by doing stringify
}
DEMO
I don't know if this will help you exactly
but you can achieve what you want through a form that submits to php_self..
<?php
//create blank array for storing text box values
for($i=1;$i<=10;$i++){
$textValue[$i]='';}
//if page reached via submission of button, store posted text box values in array
if(isset($_POST['myButton'])){
for($i=1;$i<=count($textValue);$i++){
$textValue[$i]=$_POST['myText'.$i];}}
?>
<!--create form that submits to same page-->
<form action="<?php echo htmlentities($_SERVER['PHP_SELF']); ?>" method="post" enctype="multipart/form-data" name="main">
<?php
//loop creates text boxes and buttons while getting text box default values from $textValue Array
for ($i=1;$i<=count($textValue);$i++){
echo '<div id="mainDiv'.$i.'">
<input type="text" id="myText'.$i.'" name="myText'.$i.'" value="'.$textValue[$i].'"/>
<button id="myButton'.$i.'" name="myButton" value="myButton'.$i.'">Click Me</button>
</div>
';}
?>
</form>

Categories