I am new in php. When user select one of the option in dropdown menu, the list of selected item will shows in textarea form. I want to make each of every item on that list, link to another page. How do I write php/html statement in javascrip/jquery? Here is my javascript :
<script type="text/javascript">
function check(){
var select = document.getElementById('category');
var textarea = document.getElementById('model');
$.ajax({
type: 'POST',
url: 'http://localhost/system/ajax.php',
data: {txt:$('#category').val()},
dataType: 'json',
success: function(resp){
result = resp.success;
textarea.value = "";
for(i=0; i<result.length; i++){
textarea.value = result[i] += "\n" + textarea.value;
}
}
});
}
This is my html code :
<form action="" method="post">
<tr>
<td width="116">Category</td>
<td width="221">
<center>
:
<select name="category" id="category" onChange="check()">
<option>--- Choose Category ---</option>
<?php
mysql_connect("localhost", "root", "");
mysql_select_db("inventory");
$sql = mysql_query("SELECT * FROM equipment GROUP BY equip_category ASC ");
if(mysql_num_rows($sql) != 0){
while($row = mysql_fetch_array($sql)){
echo '<option value="'.$row['equip_category'].'">'.$row['equip_category'].'</option>';
}
}
?>
</select >
</center>
</td></td></tr>
<tr>
<td><p>Model/Brand</p>
<td>
<p align="center">:<textarea name="model" id="model" rows="5" cols="25"><?php echo (''); ?></textarea>
</p>
</td></td>
</tr></form>
To insert PHP into jQuery/JS, use the following syntax:
var phpVar = <?php echo $some_php_var;?>;
console.log(phpVar); //logs $some_php_var
However, oftentimes it is best to just echo jQuery/JS in PHP:
<?php
echo 'var phpVar = '.$some_php_var.';',
'console.log(phpVar);';
?> <!--logs $some_php_var-->
In PHP use $_POST['txt'] to access the value of category that you are passing from Javascript.
Check out this tutorial for connecting PHP-Javascript-MySQL.
this is my ajax.php :-
<?php
if(!empty($_POST)) {
include "connect.php";
$txt = $_POST['txt'];
$query = "SELECT equip_name_desc FROM equipment WHERE equip_category = '$txt'";
$number = 0;
$result = mysql_query($query)
or die(mysql_error());
while($row = mysql_fetch_array($result))
{
$time = $row['equip_name_desc'];
$testarray[$number] = $time;
$number = $number+1;
}
echo json_encode(array('success'=>$testarray));
}
?>
Below is the example of output. I want to make 'Lenovo GGG' or 'HP' is a link to another page. Question is, how to write the href link in javascript?
Related
Here i am selecting company name as an option
Here i need to show relevant categories under company name;
How can i do this?
You can do that by using Jquery and Ajax. This is a simple code snippet to achieve what you want.
First, inside your index.php:
<script
type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">
</script>
<script type="text/javascript">
$(document).ready(function(){
$(".company").change(function(){
var company = $(this).val();
var dataString = 'company=' + company;
$.ajax({
type: "POST",
url: "business.php",
// You can edit choice2.php for other filename you want
data: dataString,
cache: false,
success: function(html){
$(".business").html(html);
}
});
});
});
</script>
Company :
<select name="company" class="company">
<option selected="selected">--Select Company--</option>
<?php
include('db.php');
$sql= "SELECT Company FROM table_test";
// You should edit table_test for your table name
$result = mysqli_query($con ,$sql);
while($row = mysqli_fetch_array($result, MYSQLI_ASSOC)){
$company = $row['Company'];
echo '<option value="'.$company.'">'.$company.'</option>';
}
?>
</select>
<br/><br/>
Business :
<select name="business" class="business">
<option selected="selected">--Select Business--</option>
</select>
Then inside your second file. I called it business.php:
<?php
include('db.php');
if($_POST['company']){
$company = $_POST['company'];
$sql= "SELECT Business FROM table_test WHERE Company='$company'";
$result = mysqli_query($con ,$sql);
while($row = mysqli_fetch_array($result, MYSQLI_ASSOC)){
$business = $row['Business'];
echo '<option value="'.$business.'">'.$business.'</option>';
}
}
?>
Then to connect to the database you can use this code snippet. I called this file db.php.
<?php
$con = mysqli_connect("localhost","root","","database_test");
// You should edit database_test with your database name
if (mysqli_connect_errno()){
echo "Failed to connect to MySQL: ".mysqli_connect_error();
}
?>
I have a form in which there is a field called index. What I want to do is to generate a index number automatically as follows.
ex: option1_01 , option2_01 , option1_02 .. etc
option1 comes based on the drop down selection. and _01 comes from the database using the last id number of table option1.
here is my form.php
<body>
<form id="" method="post" action="send.php">
<select name="name" id="name">
<option value="">please select</option>
<option value="option1">option1</option>
<option value="option2">option2</option>
</select><br>
<label for="index">Index</label>
<input type="text" id="index" name="index" readonly="readonly" value=""/><br>
<label for="fname">fname</label>
<input type="text" name="fname"/><br>
<label for="lname">lname</label>
<input type="text" name="lname"/><br>
<label for="age">age</label>
<input type="text" name="age"/>
<button name="submit">sumit</button>
</form>
</body>
Also I have two tables to insert data. when we select option1, rest of details should go into option1 table.
db.php
<?php
$servername = "localhost";
$username = "root";
$password = "";
$db = "testing01";
// Create connection
$conn = mysqli_connect($servername, $username, $password,$db);
// Check connection
if (!$conn) {
die("Connection failed: " . mysqli_connect_error());
}
echo "Connected successfully <br/>";
?>
here is my jquery code
$(document).ready(function() {
$("#name option").filter(function() {
return $(this).val() == $("#index").val();
}).attr('selected', true);
var index1 = $("#index").val();
$("#name").on("change", function() {
$.ajax({
url:'table.php',
type:'post',
data:{index1:index2},
success:function(){
$("#index").val($(this).find("option:selected").attr("value"));
}
});
});
});
table.php
<?php
$index2 = $_POST['index2'];
include("db.php");
$sql = "SELECT MAX(id) FROM ".$index2." ";
$res = mysqli_query($conn,$sql);
$get = mysqli_fetch_array($res);
$next_id = $get['MAX(id)'] + 1;
}
?>
send.php
<?php
if(isset($_POST['submit'])){
$option=$_POST['name'];
$index=$_POST['index'];
$fname=$_POST['fname'];
$lname=$_POST['lname'];
$age=$_POST['age'];
include('db.php');
if($option=="option1"){
$result1=mysqli_query($conn,"INSERT INTO option1(options,fname,lname,age) VALUES('$option','$fname','$lname','$age');");
if($result1){
echo "data inserted to option1 table";
}
}
if($option=="option2"){
$result2=mysqli_query($conn,"INSERT INTO option2(options,fname,lname,age) VALUES('$option','$fname','$lname','$age');");
if($result2){
echo "data inserted to option2 table";
}
}
}
?>
I think I have the problem in $ajax code snippet. it pass index2 varible into table.php. but i am unable to get back $next_id because I am new to jquery.
anyone help me to solve this?
Use alias MAX(id) as maxId in query to get record.
Table.php
<?php
$index2 = $_POST['index2'];
include("db.php");
$sql = "SELECT MAX(id) as maxId FROM ".$index2." ";
$res = mysqli_query($conn,$sql);
$get = mysqli_fetch_array($res);
$next_id = $get['maxId'] + 1;
}
?>
finally I solved myself
my jquery code snippet should be changed as here
$(document).ready(function(){
$('#name').on('change', function() {
$('#index').val($(this).find('option:selected').attr('value'));
var index1 = $('#index').val();
$.ajax({
url:'table.php',
type:'post',
data:{index1:index2},
dataType:'json',
success:function(data){
var next_id = data;
$("#index").val(index1 + "_" + next_id);
//alert('success');
}
});
});
});
and
$sql = "SELECT MAX(id) AS max_id FROM ".$index2." ";
$res = mysqli_query($conn,$sql);
$get = mysqli_fetch_array($res);
$next_id = $get['max_id'] + 1;
echo $next_id;
your ajax script has no result.
try this
$("#name").on("change", function() {
$.ajax({
url:'table.php',
type:'post',
data:{index1:index2},
success:function(result){
//result = $next_id from your table.php script...
$("#index").val($(this).find("option:selected").attr("value"));
}
});
});
and in your insert script:
......
$res = mysqli_query($conn,$sql);
$get = mysqli_fetch_array($res);
$next_id = $get['maxId'] + 1;
echo $next_id;
$next_id will be passed back to the ajax script in the result variable. (you can actually call this whatever you want...)
you can then do what you want with result as it will = $next_id
EDIT:
Also, I dont see a definition for index2 in your jquery code.
I'm trying to implement live-table edit, but I'm having some trouble with my select options. The input type="text" is fully functional though.
Ever since I tried to add select, it seemed to brake my entire lay-out. First there were multiple rows and columns displayed on the page. But now there's only one and the columns show up empty after the one that contains select.
And the second problem is that ajax doesn't post the table edit since I added select to the mark-up. I'm thinking that this is because the mark-up breaks, but I'm not sure.
If anybody knows what to do, I'd appreciate it.
Markup
<?php
$query = ("select * from projectlist");
$resultaat = mysql_query($query) or die (mysql_error());
while($row = mysql_fetch_array($resultaat, MYSQL_ASSOC)){
$id = $row['projectid'];
?>
<tr class="predit">
<form action="" method="post">
//Working input
<td>
<span id="klant_<?php echo $id; ?>" class="text"><?php echo $row["Klant"]; ?></span>
<input type="text" class="ip" id="klant_ip_<?php echo $id; ?>" value="<?php echo $row["Klant"]; ?>">
</td>
//Same approach, but with select instead of input
<td>
<span id="project_<?php echo $id; ?>" class="text"><?php echo $row["Project"]; ?></span>
<select id="project_ip_<?php echo $id; ?>" class="ip">
<?php
//Fetch select options from another table
$query = ("select * from projecten");
$resultaat = mysql_query($query) or die (mysql_error());
while($row = mysql_fetch_array($resultaat, MYSQL_ASSOC)){
$listid = $row["projectcode"];
$projectnaam = $row["projectnaam"];
?>
<option value="<?php echo $projectnaam; ?>" id="<?php echo $listid; ?>"><?php echo $projectnaam; ?></option>
<?php
}
?>
</select>
</td>
</tr>
</form>
<?php
}
?>
JQuery Ajax
$(document).ready(function(){
//Projeclist
$(".predit").click(function(){
var ID=$(this).attr('id');
$("#klant_"+ID).hide();
$("#project_"+ID).hide();
$("#klant_ip_"+ID).show();
$("#project_ip_"+ID).show();
}).change(function(){
var ID=$(this).attr('id');
var klant=$("#klant_ip_"+ID).val();
var project=$("#project_ip_"+ID).val();
var dataString = 'id='+ ID
+'&Klant='+klant
+'&Project='+project;
//alert(dataString);
var project_txt = $("#project_ip_"+ID+" option:selected").text();
$.ajax({
type: "POST",
url: "post_table.php",
data: dataString,
cache: false,
success: function(html){
$("#project_"+ID).html(project_txt);
$("#klant_"+ID).html(klant);
},
error: function (request, error) {
console.log(arguments);
alert(" Can't do because: " + error);
},
});
});
$(".ip").mouseup(function() {
return false
});
$(document).mouseup(function(){
$(".ip").hide();
$(".text").show();
});
});
post_table.php
<?php
include('config.php');
$klant = $_POST['Klant'];
$project = $_POST['Project'];
$id = $_POST['id'];
$query = "update projectlist
set Klant='$klant',
Project='$project'
where projectid='$id'";
mysql_query($query, $con);
?>
Here is the code snippet :
<select name="isbn" onchange=" ">
<?php
//Displaying all ISBN in drop down
$result = mysqli_query($con,"SELECT * FROM book");
while($row = mysqli_fetch_array($result)) {
?>
<option> <?php echo $row['ISBN']; ?></option>
<?php } ?>
</select>
</label></td>
</tr>
<tr>
<td>Copy Number </td>
<td><select name="copy_number">
<?php
//Now based on selected book I want to fetch number of copies from database
$result = mysqli_query($con,"SELECT number_of_copies FROM book where isbn = [ SELECTE VALUE FROM ABOVE]");
?>
How can I do that?
You can do that with jQuery ajax and simple php handler to get copies of selected book,
<select name="isbn">
.....
</select>
<div id="copies"></div>
<script>
$.ajax({
url: "getCopies.php?",
data: "isbn=" + $("select[name='isbn']").val(),
type: "POST",
dataType: "json",
success: function(response) {
$.each(response, function(i, item) {
$("#copies").append(item.name); // Sample json format {id: "213123", name:"Lord of the rings", isbn:"887799..."}
})
}
});
</script>
getCopies.php
<?php
$isbn = $_POST["isbn"];
// Some db connections
$result = mysqli_query($con,"SELECT number_of_copies FROM book where isbn = $isbn");
$resultArr = array();
while($row = mysqli_fetch_array($result)) {
$resultArr[] = $row;
}
echo json_encode($resultArr); // This will return rows in json format. You can iterate it in js side
I have some problems with my html/php/ajax code about dependent (or chained) select. I want to show in my menu the list of faculties after I have decided the university.
I'll show you my (italian) code. I hope you'll help me. Thanks.
javascript ajax code:
<script type="text/javascript">
$(document).ready(function()
{
$(".universita").change(function()
{
var dataString = 'id='+ $(this).val();
$.ajax
({
type: "POST",
url: "ajax_facolta.php",
data: dataString,
cache: false,
success: function(html)
{
$(".facolta").html(html);
}
});
});
});
html code about two select boxes:
<td align="right">Università: </td>
<td>
<select class="input" name="universita">
<option selected="selected">--Seleziona Università--</option>
<?php
require('config.php');
$query = mysqli_query($con, "SELECT * FROM UNIVERSITA order by id ASC");
$num_righe = mysqli_num_rows($query);
for($x=0; $x<$num_righe; $x++)
{
$rs = mysqli_fetch_row($query);
$id = $rs[0];
$nome = $rs[1];
?>
<option value="<?php echo $id;?>"> <?php echo $nome; ?></option>
<?php
}
?>
</select></td>
</tr>
<tr>
<td align="right">Facoltà: </td>
<td><select class="input" name="facolta">
<option selected="selected">--Seleziona Facoltà--</option>
</select></td>
</tr>
the file ajax_facolta.php:
<?php
require('config.php');
if($_POST['id'])
{
$id=$_POST['id'];
$sql = mysqli_query($con, "SELECT * FROM FACOLTA WHERE id_univ='$id' ");
echo '<option selected="selected">--Selziona Facoltà--</option>';
while($row=mysqli_fetch_array($sql))
{
$id=$row['id'];
$nome=$row['nome'];
echo '<option value="'.$id.'">'.$nome.'</option>';
}
}
?>
and the simple configure.php:
<?php
$con = mysqli_connect("127.6.143.130","xxxxx","xxxxx", "jeme");
if (!$con)
{
die('Errore nella connessione: ' . mysqli_connect_error());
}
?>
The database is very simple.
UNIVERSITA has (id, nome)
FACOLTA has (id, nome, id_univ).
I do not find any errors but it does not work. Thanks for the help.
In HTML you have :
<select class="input" name="universita">
and you are using
$(".universita").change(function()
$(".universita") will try to search HTML control having class name "universita"
So change few things in code. I hope it will work
1). <select class="input" name="universita" id="universita">
2). $("#universita").change(function()
3). <td><select class="input" name="facolta" id="facolta">
4). $("#facolta").html(html);
let me know is this helpfully?.