using selected value from dropdown list - javascript

I have a HTML form with dropdown list populated by php. I want the user to be able to select an option from the dropdown list and click on "Proceed" button which would open a new page based on the selected value.
<form name="selectPatient" method="post">
<div align="centre">
<select name="patient_dropdown">
<?php
include "connection.php";
$sql = mysql_query("SELECT Name from patient_info");
while ($row = mysql_fetch_array($sql)) {
echo "<option value=".$row['Name'].">".$row['Name']."</option>";
}
?>
</select>
</div>
<br>
<br>
<input type="submit" name="submit" value="Proceed"/>
</form>
<?php
if(isset($_POST['submit'])) {
header("Location: http://localhost/lei/test.com/proper/specific_patient.php");
}
?>
The code above works fine. How do I get the selected value from dropdown list?? I want to use the selected value to run a SQL query using php to get other details of the patient and then call a javascript file with that information. How can I do that??
Thanks in advance !

You need to check your $_POST variables on submit:
$patient_dropdown = isset($_POST['patient_dropdown']) ? $_POST['patient_dropdown'] : false;

Related

Get value of an element inside a div printed by PHP

I have a code in PHP that prints HTML elements based on the information we got in the database, so if we have for example 8 products the code will print 8 divs with the following elements inside
h1 the id of this element will be the same as the product in the database
input for client name
buy button that send the ID of the H1 to the database
here is some code i made
<?php
while($row=$consulta->fetch())
{
?> <img src="<?php echo $row["Imagen"];?>"style="width:12rem;height:12rem;" alt="Scotter" >
<br>
<div>
<h4 id="<?php echo $row["ID_Scooter"]; ?>"> <?php echo $row["ID_Scooter"]; ?> </h4>
<br>
<?php
echo $row["Nombre"];
?>
<br>
<?php
echo $row["Descripcion"];
?>
<br>
<?php
?>
<button onclick="abrir()">Alquilar</button>
<br>
</div>
<?php
}
?>
JavaScript
function abrir(){
var dialog = document.getElementById('favDialog');
dialog.show();
var id=document.getElementById("heres is where im supposed to get the id of the id i clicked");
alert("div id is="+id);
}
php assing ID for example (3,4,5,6,7) but when i click the button inside the div with id=5 it prints the id=3 no matter which button i click
please note that you've set onclick="abrir()" without passing any specific data!
you have got 2 way to do it:
1- passing data with php:
HTML:
abrir(<?php echo $row["ID_Scooter"]; ?>)
and use it in your js :
function abir(id){
let id_scooter = id;
...
}
2- passing clicked element with js:
HTML:
onclick="abrir(this)"
JS:
function abir(el){
let id_scooter = (el).attr(id);
...
}

jQuery not showing next drop down list according to condition

MY logic is to make a Library Management System in which it first asks for students Class Name, than if Intermediate is selected (which is 1 in database) then show Intermediate Groups else if BS is selected than show BS Department.
<?php
require '/include/connect.inc.php';
require '/include/core.inc.php';
?>
<script type="text/javascript" src="include/JS/jquery-1.11.2.min.js"></script>
<script type="text/javascript" src="include/JS/jQuery.js"></script>
<style>tr.Department_Options{ display: none; }</style>
<div class="articles">
<form method="POST" action="#">
<table align="center">
<tr><th><label for="ChoosedClassID">Class : </label></th><td><select name="ChoosedClassID" id="ChoosedClassID"><option disabled selected>Select Class :</option><?php
$query="SELECT ClassID,ClassName from class ORDER BY ClassName ASC";
$query_run=mysqli_query($connect,$query) OR die(mysqli_error($connect));
while($catch=mysqli_fetch_array($query_run)) {
$ClassName=$catch['ClassName'];
$ClassID=$catch['ClassID']; ?>
<option value="<?php echo $ClassID;?>"><?php echo $ClassName; ?></option>
<?php } ?></select><br></td></tr>
<tr id="tr_A" class="Department_Options"><th><label for="id_A">Choose Your Group : </label></th><td><select name="InterGroupID" id="InterGroupID"><option disabled selected>Intermediate Group :</option><?php
$query="SELECT DID,DepartmentName from department WHERE ClassID=1 ORDER BY DepartmentName ASC";
$query_run=mysqli_query($connect,$query) OR die(mysqli_error($connect));
while($catch=mysqli_fetch_array($query_run)) {
$DepartmentName=$catch['DepartmentName'];
$DID=$catch['DID']; ?>
<option value="<?php echo $DID;?>"><?php echo $DepartmentName; ?></option>
<?php } ?></select><br></td></tr>
<tr id="tr_B" class="Department_Options"><th><label for="id_B">Choose Department : </label></th><td><select name="DepartmentName" id="DepartmentName"><option disabled selected>BS Department Name</option><?php
$query="SELECT DID,DepartmentName from department WHERE ClassID=2 ORDER BY DepartmentName ASC";
$query_run=mysqli_query($connect,$query) OR die(mysqli_error($connect));
while($catch=mysqli_fetch_array($query_run)) {
$DepartmentName=$catch['DepartmentName'];
$DID=$catch['DID']; ?>
<option value="<?php echo $DID;?>"><?php echo $DepartmentName; ?></option>
<?php } ?></select><br></td></tr>
</table>
</form>
</div>
The jQuery.js File
$(document).ready(function(){
$('#ChoosedClassID').on('change', function() {
$('tr.Department_Options').hide();
$('#tr_' + $(this).val() ).show();
});
});
According to code above, When I select BS,Intermediate, Next Drop Down Meny doesn't appear.
What I want is that drop down menu appear and when I select some value from it, it should ask for Student Library Number and then I want to make insert query.
Did you try some debugging in your JavaScript? Put temporary alert() statements in, thus:
$(document).ready(function(){
alert(1);
$('#ChoosedClassID').on('change', function() {
alert(2);
$('tr.Department_Options').hide();
$('#tr_' + $(this).val() ).show();
});
});
Do you get "1" on page load and "2" on the control change event? That's the first thing you need to do. If you do, you could perhaps move onto looking at $(this).val() to see what value that resolves to.
As I outlined in the comments, it is worth checking your browser's console, in case any JavaScript errors pop up. Also, check your network panel to ensure your external JavaScript resources (jQuery in particular) are loaded correctly.

Javascript Dialogue box in ctp?

In test.ctp file
<?php echo $form->create(null, array('url' => 'test/'.$test['Test']['id'], 'onSubmit'=>'return status(this)')); ?>
<?php echo $form->hidden('id', array('value' => $test['Test']['id'])); ?>
<dl class="editForm">
<?php echo $form->create(null, array('url' => 'test/'.$test['Test']['id'])); ?>
<?php echo $form->hidden('id', array('value' => $test['Test']['id'])); ?>
<dt><label><?php __('Update Status');?>:</label></dt>
<dd><?php echo $form->select('status_id', $statuses, $selectedStatus, array(), false); ?></dd>
<dd><?php echo $form->end(__('Update Status', true)); ?></dd>
</dl>
In the same .ctp file I need a dialogue box to appear when update button is clicked for confirmation that if user wants to continue with "No Status" or not?
Following code is not working for me, where I am not getting status_id value.
<script type="text/javascript">
function status() {
var status_id = $("#status_id").val();
alert(status_id);
}
</script>
Required: If status_id value is 1 in posted data then dialogue box should appear for confirmation.
To create one button you don't need to keep create a new form. by using form->create...
what you want is just to check the dropdown if the value equals 1 confirmation_window appears.
To do so first you have to know the basic of HTML and JS. if you could implement that you will be able to do so. convert the code blow to cakephp tagging and form. it will get it work.
<form onsubmit="status();" >
<select name="data[User][field]" id="UserField">
<option value="0">1</option>
<option value="1">2</option>
<option value="2">3</option>
</select>
<input type="submit" />
</form>
<script>
function status() {
var status_id = $("#UserField").val();
//or
var status_id = document.getElemetById("UserField");
alert(status_id.options[status_id.selectedIndex].value);
}
</script>
you could even assign id_name to your dropdown. then you should be able to get the value from dropdown using js or jQuery.
$form->select('status_id', array('id'=>'status_id')); ?>

SQL Generated select menu, updating textbox based on related value

Some Background information:
I have a table with two fields, TECHNAME and TECHCOLOR
What I am trying to do is:
Have a SQL generated Drop down menu based on TECHNAME (DONE)
Have TECHCOLOR update in text box when TECHNAME is selected (ISSUE IS HERE)
What is wrong
Currently, the textbox is showing TECHNAME insead of TECHCOLOR
Code
JavaScript:
<script type="text/javascript">
function load_value(value)
{
document.getElementById("test").value=value;
}
</script>
HTML/PHP:
<table>
<form method="post" action="">
<?php
$select_box='<select name="edittech" id="edittech" onchange="javascript:load_value(this.value);">';
$input="";
$result = $conn->query("select * from techs");
while ($row = $result->fetch_assoc()) {
$select_box .='<option id="name" value="'.$row["TECHNAME"].'">'.$row['TECHNAME'].'</option>';
}
$input ='<input type="text" name="test" id="test" value="" />';
echo $select_box."</select>";
echo $input;
?>
Thanks in advance! :D
When you submit the form, is the value for your edittech dropdown list used at all? If it isn't then you can simply change the value part of your dropdown to be TECHCOLOR and it will still show TECHNAME on the dropdown.
while ($row = $result->fetch_assoc()) {
$select_box .= "<option id=\"name\" value=\"{$row['TECHCOLOR']}\">{$row['TECHNAME']}</option>";
}

Send multiple <option>s through form

<fieldset>
<legend>Available Areas</legend>
<select id="availableAreas">
<?php
$sql = "SELECT * FROM workArea";
$result = $db->query($sql);
while ($row = $result->fetch_assoc()) {
$id = $row['id'];
$area = $row['name'];
echo "<option value='$id'>$area</option>";
}
?>
</select>
<input id="addArea" type="button" value="Add area" /><br />
<select id="workAreas" style="min-width: 200px" required multiple name="workAreaId"></select>
</fieldset>
The code above produces this output:
I haven't put the JavaScript in as it's not relevant to the question but clicking 'Add area' would add the area into the <select> element (the multiple list below the drop down).
When the user submits the form I need to send all of the <option>s that the user added to the list. Is there a way I can do this?
Thanks
Assuming you are using jQuery:
$('#yourForm').submit(function() {
$('#workAreas option').prop('selected', 'selected');
});
This should select all items in your multiple select when the form is submitted.
Another option would be to add a hidden input field for every Option. When you add [] to the name of the field it will be available on the server side as an array.
<input type="hidden" name="workareas[]" value="X" />

Categories

Resources