I have a table callled tb_app with fields 'id','name','aic','batchcode'
example: field values '1','james','0001','1'
If type james in the textbox(name) corresponding values for other fields(aic,batchcode) should be displayed in textboxes. Is this possible? can anyone help me...I'm a php beginner ...Please!
Form code:
<form method="post">
<input type="text" name="names" id="query" />
<input type="text" name="aic" />
<input type="text" name="batchcode" />
<input type="submit" name="show" />
</form>
You can do this by Jquery ajax Try in this way by using your exact field names it might help you
Your jquery script should be something like this
function getvalues()
{
var selname = $("input[name='names']:text"").val();
$.ajax({ url: "getuserdata.php",
data: {"selname":selname},
type: 'post',
success: function(output) {
$("#aic").val(output);
$("#batchcode").val(output);
}
});
}
and your Html code
<input type="text" name="names" id="query" onblur="getvalues()"/>
<input type="text" name="aic" id="aic"/>
<input type="text" name="batchcode" id="batchcode" />
The getuserdata.php
<?php
include("database connection file here");
$selname = $_POST['selname'];
$query = "SELECT * FROM table_name WHERE youruser_id = $selname";
$res = mysql_query($query);
$rows = mysql_fetch_array($res);
echo $rows['aic'];
echo $rows['batchcode'];
?>
Related
Wondering if someone can point me in the right direction.
This is the main page of the project (index.php). The script below is receiving values from fetch.php which displays properly. All I need is to autocomplete the 2 input boxes client_id and title. I know the problem is with the script, but can't figure it out.
<input type="text" id="client_id" name="client_id" placeholder="ID" />
<input type="text" id="status" name="status" placeholder="Status" autocomplete="off" />
<input type="text" id="title" name="title" placeholder="Client" autocomplete="off" />
function setText(obj){
var val = obj.value;
console.log(val);
function concat(){
var x = <?php echo $client_id; ?>
var y = <?php echo $first_name; ?>
document.getElementById("client_id").value = x;
document.getElementById("title").value = y;
}
concat();
}
If was was to have the following script, title would fill in automagically.
function setText(obj){
var val = obj.value;
console.log(val);
document.getElementById('title').value = val;
}
You're mixing php in with javascript in a way that doesn't make sense, since you say the values are coming in from a fetch
If it really is PHP, then (obviously) you could set the inputs directly
<input type="text" id="client_id" name="client_id" placeholder="ID" value="<?php echo $client_id; ?>" />
<input type="text" id="status" name="status" placeholder="Status" autocomplete="off" />
<input type="text" id="title" name="title" placeholder="Client" autocomplete="off" value=" <?php echo $first_name; ?>" />
If it's coming in through fetch, you could do it this way:
let ref = 12; // the reference to get the data
fetch(`http://example.com/getClientData.php?ref=${ref}`)
.then(response => response.json())
.then(data => {
document.getElementById("client_id").value = data.client_id;
document.getElementById("title").value = data.client_title;
console.log(data)
});
I have a form which is made dynamically with jquery ajax and input fields names values comes dynamically, I want to update these fields with php I am not sure how to do this.
when form is submitted I does not know what will be the name of input fields.
<form id="modalform" action="#" method="post">
<input type="text" name="46" class="form-control margin-top20 " value="selcetopt 1" />
<input type="text" name="50" class="form-control margin-top20 " value="selcetopt 2" />
<input type="text" name="56" class="form-control margin-top20 " value="selcetopt 3" />
<input type="text" name="66" class="form-control margin-top20 " value="selcetopt 4" />
<input type="text" name="96" class="form-control margin-top20 " value="selcetopt 5" />
<input type="submit" value="Update" name="submit" />
</form>
You can iterate over $_POST to get all input filed values, Based on your question I have added a sample code below
<?php
if(!empty($_POST)){
foreach($_POST as $key => $value){
// Preprocess $key which holds name of input field
// You can apply your logic to process value for an input $key here
// From your example it looks like name is a number so special case can check within a condition for $key as number
if(ctype_digit($key)){
// This will only get the value of all dynamic input fields if name is a number
}
}
}
I hope it helps you
See if that helps in any way, create a form like that
<form onsubmit="return submitForm(this);">
<input data-key="field-1" value="" />
<input data-key="field-2" value="" />
<input data-key="field-3" value="" />
...
<button type="submit">Submit form</button>
</form>
JQuery code:
var form_data = {};
function parseInputs(form) {
$(form).find("input").each(function() {
form_data[$(this).data("key")] = $(this).val();
})
return form_data;
}
function submitForm(form) {
var options = {
type: "POST",
url: "form_handling.php",
data: parseInputs(form),
success: function (response) {alert(response)}
};
$.ajax(options);
return false;
}
And form_handling.php would be:
<?php
foreach($_POST as $key => $value) {
echo $key . " = " . $value;
}
?>
Imagine I have 3 data's in my room_table and the column is room_id, image, room_name then I'm going to display the data of my room_table in my html code.
PS: Ignore the text_checkin, text_checkout first. I'm going to explain after the code.
HTML code:
$db = mysqli_connect('xxxxxx', 'xxxx', '', 'xxxx');
$rooms = mysqli_query($db, "SELECT * FROM rooms ORDER BY id ASC;");
<script src = "http://code.jquery.com/jquery-1.9.1.js"></script>
<?php while($row = mysqli_fetch_array($rooms)) { ?>
<div>
<form >
<img src="upload/<?php echo $row['image']; ?>" style="width: 20%;">
<label>Check IN</label>
<input type="date" name="text_checkin" id="text_checkin">
<br>
<label>Check OUT</label>
<input type="date" name="text_checkout" id="text_checkout">
<br>
<label>Room ID</label>
<input type="text" name="text_roomid" id="text_roomid" value="<?php echo $row['id']; ?>">
<br>
<input type="submit" value="submit" name="submit" id="submit" onclick="return chk()">
<br><br><br>
</form>
<p id="msg"></p>
</div>
<?php } ?>
I have table named reservation then the columns are room_id, checkin, checkout.
the 3 data's in my room_table will display. Then the textbox, and the button will be thrice cause of the while loop. Then imagine I clicked the button submit in the 2nd row, then the 2nd row id should insert on my table reservation but the problem is only first row id is inserting on table reservation
Here's my script:
<script type="text/javascript">
function chk()
{
var roomid = document.getElementById('text_roomid').value;
var checkin = document.getElementById('text_checkin').value;
var checkout = document.getElementById('text_checkout').value;
var dataString = 'roomid='+ roomid + '&checkin=' + checkin + '&checkout=' + checkout;
$.ajax({
type: "post",
url: "server.php",
data:dataString,
cache:false,
success: function(html){
$('#msg').html("success");
}
});
return false;
}
</script>
PHP code: server.php
$roomid = $_POST['roomid'];
$checkin = $_POST['checkin'];
$checkout = $_POST['checkout'];
$query = "INSERT INTO reservation (room_id, checkin, checkout) values ('$roomid', '$checkin', '$checkout')";
mysqli_query($db, $query);
echo "success!";
please help me out of this problem, tyia!
The error lies within your while loop. Your printed elements will all have the same id's. When your function is looking for an id to get the value, it will always return the first that it finds, no matter how many instances there are of that id. So you're having conflicting id's. id's should always be unique.
What you could do to avoid this, is to declare a counter outside your while loop and increment it inside your while loop, then attach that onto your id. In that way, you will always have a unique id to parse along.
For instance:
<?php $count=0; while($row = mysqli_fetch_array($rooms)) { $count++;?>
<div>
<form >
<img src="upload/<?php echo $row['image']; ?>" style="width: 20%;">
<label>Check IN</label>
<input type="date" name="text_checkin" id="text_checkin<?php echo $count; ?>">
<br>
<label>Check OUT</label>
<input type="date" name="text_checkout" id="text_checkout<?php echo $count; ?>">
<br>
<label>Room ID</label>
<input type="text" name="text_roomid" id="text_roomid<?php echo $count; ?>" value="<?php echo $row['id']; ?>">
<br>
<input type="submit" value="submit" name="submit" id="submit" onclick="return chk()">
<br><br><br>
</form>
<p id="msg<?php echo $count; ?>"></p>
</div>
<?php } ?>
However, you will then need to change your logic for how you fetch the data from each element, as you don't really know what their id's could end up being due to the incrementor. It's not static.
If you need any further help, let me know.
As Martin said there is the problem with the id's so you have to change the logic a little bit.
$db = mysqli_connect('xxxxxx', 'xxxx', '', 'xxxx');
$rooms = mysqli_query($db, "SELECT * FROM rooms ORDER BY id ASC;");
<script src = "http://code.jquery.com/jquery-1.9.1.js"></script>
<?php while($row = mysqli_fetch_array($rooms)) { ?>
<div>
<form >
<img src="upload/<?php echo $row['image']; ?>" style="width: 20%;">
<label>Check IN</label>
<input type="date" name="text_checkin" class="text_checkin">
<br>
<label>Check OUT</label>
<input type="date" name="text_checkout" class="text_checkout">
<br>
<label>Room ID</label>
<input type="text" name="text_roomid" class="text_roomid" value="<?php echo $row['id']; ?>">
<br>
<input type="submit" value="submit" name="submit" id="submit" onclick="return chk()">
<br><br><br>
</form>
<p id="msg"></p>
</div>
<?php } ?>
Then you can get the values individually and pass them as array to the server.
<script type="text/javascript">
function chk()
{
var roomidArr = $(".text_roomid");
var checkinArr = $(".text_checkin");
var checkoutArr = $(".text_checkout");
/*
You can get value of each element as;
for(var i = 0; i < roomidArr.length; i++){
console.log($(roomidArr[i]).val());
}
*/
//var dataString = Apply your logic here as;
$.ajax({
type: "post",
url: "server.php",
data:dataString,
cache:false,
success: function(html){
$('#msg').html("success");
}
});
return false;
}
</script>
I am doing a registration page where the one input textbox should be populated based on 2 other input textboxes.
tblEntries
Id; firstname; lastname; age; gender; categories
tblCategories
Id; categories; age_from; age_to, gender
Data inserted: 1; Veteran_male; 20; 30; male
frmEntries.php is populated with tblEntries data onload already using localstorage.
(may look like this
Firstname=Peter
Lastname=Trump
Age=25
Gender=male
Categories= ?(from sql)
include("conn.php");
include("categories.php");
<input id="firstname" type="text" name="firstname" value="" />
<input id="lastname" type="text" name="lastname" value="" />
<input id="age" type="text" name="age" value="" />
<input id="gender" type="text" name="gender" value="" />
<input id="categories" type="text" name="categories" value="<?php echo $output; ?>" />
(the 25 fall in between 20 and 30 in the tblCategories and the gender is shown in both tables)
categories.php
<php?
include ('conn.php');
$gender = $_POST["gender"];
$age = $_POST["age"];
$result = $con->query("SELECT categories FROM tblCategories WHERE '$age' BETWEEN age_from AND age_to AND gender='$gender'”);
$result = mysqli_query($con, $query);
$output = '';
while($row = mysqli_fetch_array($result))
{
$output = $row["categories"];
}
echo($output);- //(to be populated inside the frmEntries and the
“categories” field onload)
}
?>
Should i use Ajax with a button?
<script>
$('#updateBtn').click(function(e){
//to disable the click from going to next page
e.preventDefault();
$.ajax(
'categories.php', function(data){
$('#categories').val(data);
}
);
});
</script>
Please advise on how to do this. Should I rather use a button to populate "categories" after onload? I get variable not find errors
Need your help and suggestions please. I have a form that submits data to MySQL database and images to database + Sql. The problem i'm facing is that I can submit data successfully using method but cannot submit the images because it requires <form method="post" enctype="multipart/form-data" action="myFile.php">. The same goes for images. I can submit the images successfully to ftp but then the data won't post using <form method="post" enctype="multipart/form-data" action="myFile.php">.
I've tried every possible method in the book and researched so many sites. I've tried approaching this with Ajax, Jquery (Two forms, two actions and one submit button). Please please point me in the right direction.
My code: Form.php (I currently ended up making two forms):
<form method="post">
<input name="haz1" type="text" value="<?php echo $haz1; ?>">
<input name="haz2" type="text" value="<?php echo $haz2; ?>">
<input name="submit" type="submit" id="submit" value="SAVE FORM">
</form>
<form method="post" enctype="multipart/form-data" action="myFile.php">
<input type="hidden" name="MAX_FILE_SIZE" value="10000000" />
<input name="haz_img1" type="file" id="img" />
<br>
<input name="submit" type="submit" id="submit" value="SAVE FORM">
</form>
myFile.php
<?php
require("../db.php");
$id =$_REQUEST['id'];
$result = mysql_query("SELECT * FROM haz3 WHERE id = '$id'");
$test = mysql_fetch_array($result);
if(!$result)
{
die("Error: Data not found..");
}
$haz_img1 = $test['haz_img1'];
$haz1 = $test['haz1'];
$haz2 = $test['haz2'];
if(isset($_POST['submit']))
{
$haz_img1_save = $_POST['haz_img1'];
$haz1_save = $_POST['haz1'];
$haz2_save = $_POST['haz2'];
$remote = "hazard-access/";
$target1 = $remote . basename( $_FILES['haz_img1']['name']);
$haz_img1 = ($_FILES['haz_img1']['name']);
move_uploaded_file( $_FILES['haz_img1']['tmp_name'], $target1 );
mysql_query("UPDATE haz3 SET haz_img1 = '$haz_img1_save',haz1 ='$haz1_save',haz2 ='$haz2_save' WHERE id = '$id'")
or die(mysql_error());
echo "";
}
mysql_close($conn);
?>
I'm trying to submit the data and files together. I do not know if this is possible with one form or two forms or whether I should async via ajax.
I tried this approach:
function sendData()
{
var formData = new FormData(document.getElementById('form1'));
$.ajax({
url: 'h1_temp.php', //Server script to process data
type: 'POST', //POST or GET
xhr: function()
{ // Custom XMLHttpRequest
var myXhr = $.ajaxSettings.xhr();
return myXhr;
},
data: formData, //form data
//Options to tell jQuery not to process data or worry about content-type.
cache: false,
contentType: false,
processData: false
});
}
Why not sending all data to only one script?
<form method="post" enctype="multipart/form-data">
<input name="haz1" type="text" value="<?php echo $haz1; ?>" />
<input name="haz2" type="text" value="<?php echo $haz2; ?>" />
<input type="hidden" name="MAX_FILE_SIZE" value="10000000" />
<input name="haz_img1" type="file" id="img" />
<br>
<input name="submit" type="submit" id="submit" value="SAVE FORM">
</form>
You than just save the image in form.php (maybe using the myFile.php script).