How to disable textbox and assign default value on it? - javascript

this is my textbox with id of brgy_name:
<select name="brgy_name" class="" style="width:240px" id="brgy_name" required >
<option value="">Select Barangay</option>
<option value="ALL">ALL</option>
<?php $result = pg_query("SELECT * FROM tbl_barangay order by cbrgyname");
while($row = pg_fetch_array($result)){ ?>
<option value="<?php echo $row['cbrgyname']; ?>"><font style="margin-top:-20px"><?php echo $row['cbrgyname'];?></font></option>
<?php } ?>
</select>
<input type="hidden" id="asgn_brgy" value="<?php echo $_POST['brgy_name']; ?>">
<input type="hidden" id="frm" value="<?php echo $_POST['fromyear']; ?>">
<input type="hidden" id="to" value="<?php echo $_POST['toyear']; ?>">
<input type="hidden" id="usertype" value="<?php echo $_SESSION['admin_usertype'] ?>"> <!--ADMIN-->
<input type="hidden" id="userbrgy" value="<?php echo $_SESSION['admin_brgycode'] ?>"> <!--TAGUIBO-->
This is my script:
<script text="text/javascript">
var holderu = document.getElementById('usertype').value;
var holderb = document.getElementById('userbrgy').value;
if(holderu=='ADMIN'){
}else{
}
</script>
if holderu == 'ADMIN' is true.. i want the value of holderb to be put into the textbox..

i hope this will help..
<script text="text/javascript">
var holderu = document.getElementById('usertype').value;
var holderb = document.getElementById('userbrgy').value;
if(holderu=='ADMIN'){
$("#brgy_name").empty();
var select = '<option>'+holderb+'</option>';
$("#brgy_name").append(select);
$("#brgy_name").prop('disabled',true);
}else{
//your code
}

<script text="text/javascript">
var holderu = document.getElementById('usertype').value;
var holderb = document.getElementById('userbrgy').value;
if(holderu=='ADMIN'){
document.getElementById('brgy_name').innerHTML = ('<option>+holderb+
</option>');
}
else{
}

To add an option to select and remove one from it, you can do this:
var holderu = document.getElementById('usertype');
var holderb = document.getElementById('userbrgy');
if (holderu.value == 'ADMIN') {
var sel = document.getElementById('brgy_name');
var option = document.createElement("option");
option.text = holderb.value;
option.value = holderb.value;
sel.add(option);
sel.removeChild( sel.options[0] ); //To remove the 1st option which is `Select Barangay`
}

Related

How to calculate amount by javascript?

As u can see i have this form that calculate number of employees multiply by test that will be select by user. number of employees will be input by user and test are coming from database. each test have their individual price set in database. I used script for dropdown list.
If user put any value in no.of employees and check on anytest then in total amount sum should be calculate onclick buytest?
<form action="add_corporate_test.php" method="POST">
<script type="text/javascript">
$(document).ready(function () {
$('#example-onDeselectAll').multiselect({
includeSelectAllOption: true,
onDeselectAll: function () {
alert('please select any test!');
}
});
});
</script>
<div class="row">
<h5 class="cor_label">No. of Emp/Students:</h5>
<input
type="text" id="no_emp"
placeholder="No. of Employees/Students"
class="normal" required
>
<h5 class="cor_label">Email Address:</h5>
<input
type="text"
id="no_emp2"
placeholder="Email Address"
class="normal" value="<?php echo $_SESSION[email]; ?>"
required
disabled
>
<h5 class="cor_label">Select Test:</h5>
<select id="example-onDeselectAll" multiple="multiple">
<?php
$sql = mysql_query("select * from `test` ");
while ($data = mysql_fetch_assoc($sql)) {
$sum = 0;
?>
<option value="<?php echo $data['test_name']; ?>">
<?php echo $data['test_name']; ?>
</option>
<?php } ?>
</select>
<h5 class="cor_label">Total Amount:</h5>
<input
type="text"
id="no_emp3"
class="normal"
name="total_amount"
placeholder="total amount"
value="<?php echo $sum; ?>"
disabled
>
<button class="btn btn-primary" type="submit" name="corporate_buy">
Buy Test
</button>
</div>
</form>
Hi bro, use for loop for script b'coz u have multiple select option
`
<script>
$('#example-onDeselectAll').change(function() {
var value = $(this).val();
var i=0;
var len = value.length;
var no_emp = $("#no_emp").val();
for(i; i < len; i++){
var res = value[i] .split("_");
var tot_amount += res[1]*no_emp;
}
$("#no_emp3").val(tot_amount);
});
</scrit>
`
get the test and value on select option. on select split the value using javascript. and then sum the amount and no.of.employee
`
<select id="example-onDeselectAll" multiple="multiple" >
<?php
$sql=mysql_query("select * from `test` ");
while($data=mysql_fetch_assoc($sql))
{
$sum=0;
?>
<option value="<?php echo $data['test_name'];?>_<?php echo $data['price'];?>"><?php echo $data['test_name'];?></option>
<?php }?>
</select>
<script>
$('#example-onDeselectAll').change(function() {
var value = $(this).val();
var no_emp = $("#no_emp").val();
var res = value .split("_");
var tot_amount = res[1]*no_emp;
$("#no_emp3").val(tot_amount);
});
</scrit>
`

automatically populate text box based on select entry

Is there a way within php to get a value picked up from database automatically?
Basically, If I have a select box & I select option "Laptop-01" , is there a way within PHP to check the database for that row and then automatically pick up the serial number of Laptop-01 and populate it within the text box for the devices serial number.
At the moment I've just got two text boxes and user would need to manually enter both the product number (Laptop-01) & then the serial number.
I've currently got the following code;
PHP
<?php
$selectquery = "SELECT * FROM `loanproducts`";
$selectresult = mysqli_query($connection, $selectquery);
$selectusersquery = "SELECT * FROM `loanusers`";
$selectusersresult = mysqli_query($connection, $selectusersquery);
if (isset($_POST['editloan'])):
$loanid = $_POST["loanid"];
$username = $_POST["username"];
$product=$_POST["product"];
$product_desc=$_POST["product_desc"];
$serial=$_POST["serial"];
$date_collected=$_POST["date_collected"];
$date_return = $_POST["date_return"];
$returned = $_POST["returned"];
$edit_query="UPDATE loans SET
username = '$username',
product = '$product',
product_desc = '$product_desc',
serial = '$serial',
date_collected ='$date_collected',
date_return = '$date_return',
returned = '$returned'
WHERE loanid ='$loanid'";
$edit_result= mysqli_query($connection, $edit_query);
if ($edit_result) :
header ('location: editloan.php?confirm=Loan successfully updated');
else :
echo "<b>This didn`t work, error: </b>";
echo mysqli_error($connection);
endif;
endif;
$loanid=$_GET['loanid'];
$my_query="select * from loans where loanid=$loanid";
$result= mysqli_query($connection, $my_query);
while ($myrow = mysqli_fetch_array($result)):
$username = $myrow["username"];
$product = $myrow["product"];
$product_desc = $myrow["product_desc"];
$serial = $myrow["serial"];
$date_collected=$myrow["date_collected"];
$date_return=$myrow["date_return"];
$returned=$myrow["returned"];
endwhile;
?>
HTML
<html>
<h2 align="center">Edit Product Form</h2>
<body>
<div id="loginp"<p align="center">Edit this loan for the Coleg Sir Gar Loan System</p></div>
<form method="POST" action="editloaninfo.php">
<div id="editp"><p align="center">
<label class="labelform">Username:</label><select name="username" style="width: 150px">
<?php while($row1 = mysqli_fetch_array($selectusersresult))
{ if ( $row1[1] == $username )
$selected = "selected";
else $selected = "";
echo "<option $selected>{$row1[1]}</option>";
}?>
</select></p></div>
<div id="editp"><p align="center">
<label class="labelform">Product:</label><select name="product" style="width: 150px">
<?php while($row1 = mysqli_fetch_array($selectresult))
{ if ( $row1[1] == $product )
$selected = "selected";
else $selected = "";
echo "<option $selected>{$row1[1]}</option>";
}?>
</select></p></div>
<div id="editp"><p align="center">
<label class="labelform">Product Description:</label><input class="inputform" type="text" name="product_desc" placeholder="Product Description..." autocomplete="off" required size="18" value="<?php echo $product_desc; ?>"></p></div>
<div id="editp"><p align="center">
<label class="labelform">Serial Number:</label><input class="inputform" type="text" name="serial" placeholder="Serial Number..." autocomplete="off" required size="18" value="<?php echo $serial; ?>"></p></div>
<div id="editp"><p align="center">
<label class="labelform">Date Collected:</label><input class="inputform" type="date" name="date_collected" autocomplete="off" size="30" value="<?php echo $date_collected; ?>"></p></div>
<div id="editp"><p align="center">
<label class="labelform">Date Returned:</label><input class="inputform" type="date" name="date_return" autocomplete="off" size="30" value="<?php echo $date_return; ?>"></p></div>
<div id="editp"><p align="center">
<label class="labelform">Returned:</label><select name="returned" style="width: 150px">
<option value="Yes" <?php echo $returned === 'Yes' ? 'selected="selected"' : '' ?>>Yes</option>
<option value="No" <?php echo $returned === 'No' ? 'selected="selected"' : '' ?>>No</option>
</select></p></div>
<br>
<input type="hidden" name=loanid value= "<?php echo $loanid; ?>" >
<div id="editp"><input class="inputform" type="submit" name="editloan" value="Save Changes">
<input class="inputform" type="button" name="Cancel" value="Cancel" onClick="window.location.href='editloan.php'"></div>
</form>
</body>
</html>
</div>
Basically you want to do is :
When User select 'Laptop-01' you page must update all INPUTS with information related to user's laptop (like Serial number).This can be done by adding AJAX
Please note : This answer will give you idea about how to Populate data from data base then you can do this for any information you needed.
<form>
<select id='product_name' onchange="get_data()">
<option value='Laptop-01'>Laptop-01</option>
</select>
<input name='serial_no' id='serial_no'>
<input name='product_no' id='product_no'>
</form>
<script src="js/ajax.js"></script>
<script>
function get_data(){
//In very short what this do is :
//get values
var serial_no = document.getElementById('product_name').value;
//create an Object
var ajax = ajaxObj("POST", "yourpage.php");
ajax.onreadystatechange = function() {
if(ajaxReturn(ajax) == true) {
//ajax.responsetex is things you echo from script next to it
var index1 = ajax.responseText.split(",");
//index1 is array holding values
//index1[0]=$serial_no
//index1[1]=$product_no
//Now set value of your serian_no INPUT to $serial_no = index1[0];
document.getElementById('serial_no').value = index1[0];
document.getElementById('product_no').value = index1[1]
}
}
//ajax.send = POST/GET method
ajax.send("product_name="+product_name);
}
</script>
<?php
if(isset($_POST['product_name'])){
$sql = "SELECT serial_no,product_no FROM loanuser WHERE username='$username'";
$query = ($connection , $query);
while ($myrow = mysqli_fetch_array($query)){
$serial_no = $myrow["serial_no"];
$product_no = $myrow["product_no"];
}
//form a (,) separated list and echo it.
echo $serial_no.",".$product_no;
exit();
}
?>
Ajax.js
function ajaxObj(meth, url) {
var x = new XMLHttpRequest();
x.open(meth, url, true);
x.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
return x;
}
function ajaxReturn(x){
if(x.readyState === 4 && x.status === 200){
return true;
}
}
If you want me to add more explanation on AJAX used in this page , please add request in comment section i will edit it to more better answer

how to clear multple select box data

I want to clear the selected data on multiple select boxes but it won't work for me.
<select name="age" id="age" class="span2 typeahead" multiple data-rel="chosen">
<?php
$age_arr = explode(",", $result['age']);
foreach ($age as $a)
{
$select = "";
for ($is = 0; $is < count($age_arr); $is++)
{
if ($age_arr[$is] == $a['age_id'])
{
$select = "selected";
}
} ?>
<option id="age2" value="<?php echo $a['age_id']; ?>" <?php echo $select; ?>><?php echo $a['age']; ?></option>
<?php
}
?>
</select>
<input type="hidden" id="age_val" name="age_val" value="<?php echo $result['age']; ?>" />
<input type="button" value="Clear" id="clear" class="btn" onClick="clearFields()">
This is what I tried:
<Script>
function clearFields(){
document.getElementById("age_val").value = "";
document.getElementById("age").value = '';
}
</Script>
Please advice me how to clear data when clear button clicked,
selectbox
As you have a multiple select, not a standard select, you need to set the selected property of each option element to false. Try this:
function clearFields() {
$('#age option:selected').prop("selected", false);
$('#age_val').val('');
}
Working example
Javascript:
function clearFields(){
document.getElementById("age_val").value = "";
var collection = document.getElementById('age').getElementsByTagName('option');
for(var i = 0; i<collection.length; i++){
collection[i].selected = false;
}
// for chosen
$('#age').trigger('chosen:updated');
}
But as long as you using jquery, then you can use code in answer provided by #Rory McCrossan and add to the function: $('#age').trigger('chosen:updated');

Get patient details on combo box change

I need the code for getting the addr and pnum of the patient when I choose the pname in the combo box.
How can I do that?
<script>
function getVal() {
document.getElementById("text2").value = document.getElementById("model").value;
}
</script>
<body>
//code in opening and getting my addr and pnum in dbase
<?php
include('connect.php');
$pname=$_GET['tpname'];
$result = mysql_query("SELECT * FROM tblnpatient where pname='$pname'");
while($row = mysql_fetch_array($result))
{
$pnum=$row['pnum'];
$addr=$row['addr'];
}
?>
//code for choosing pname
<tr><td>Patient Name:
<div id="ma">
<select name="pname" class="textfields" id="model" style="width:180px;" onchange="getVal();">
<option id="0" >--Select Patient Name--</option>
<?php
$con=mysqli_connect("localhost","root","","dbnpatient");
if (mysqli_connect_errno()){
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
$pnum=$_GET['pnum'];
$query = mysqli_query($con, "SELECT * FROM tblnpatient");
while($row = mysqli_fetch_array($query)){
$pnum = $row['pnum'];
$pname = $row['pname'];
?>
<option id="<?php echo $pnum; ?>" value="<?php echo $pname; ?>"><?php echo $pname; ?> </option>
<?php } ?>
</select>
//code for getting pname and addr
Address:<input type="text" name="ename" size="20" id="ma" value="<?php echo $addr ?>"/>
Name:<input type="text" name="ename" size="20" id="ma" value="<?php echo $pname ?>"/>
In your while loop add the following (if you have that column otherwise replace with something similar)
$paddress = $row['paddress'];
You can store the needed information by using the data attribute in your options
<option id="<?php echo $pnum; ?>" data-pname="<?php echo $pname; ?>" data-paddress="<?php echo $paddress; ?>" value="<?php echo $pname; ?>"><?php echo $pname; ?></option>
Then change your getVal() function
function getVal() {
var options = document.getElementById("model").options;
if (options.selectedIndex != -1) {
var addr = document.getElementById('paddress');
var name = document.getElementById('pname');
addr.value = options[options.selectedIndex].getAttribute('data-paddress');
name.value = options[options.selectedIndex].getAttribute('data-pname');
}
}
Now change the id's of the input fields for the address and the name to paddress and pname. It is important to know to never have duplicate id's
I hope that helped

Ajax does not take all params

I have a litte problem with the update. I have a couple of forms (over a loop). The script works fine with the first form, but with the others there is a problem.
while ($zeile = mysqli_fetch_array( $result, MYSQL_ASSOC))
{
....
$_SESSION['date'][$a] = $zeile['submit_time'];
$_SESSION['bes'][$a] = $zeile['date'];
<form id="upload" method="post" name="form">
<td>
<input onclick="this.value='';" class="datepicker" type="text" name="date" value="<?php echo $date_bes; ?>"/ readonly></td>
<script>
$(function() {
$( ".datepicker" ).datepicker();
});
</script>
<td style='text-align:center;width:120px;'>
<input id="chk<?php echo $a; ?>" class="chk" name="chk" type="checkbox" value=""
<?php if($check == 1){ echo "checked"; }else{ echo "";} ?>/>
<input type="hidden" class="id" value="<?php echo $id_submit; ?>">
</td>
<td style="text-align:center;width:240px;">
<textarea id="remark<?php echo $a; ?>" class="remark" name="remark" cols="30" rows="1" ><?php echo $remark; ?></textarea>
</td>
<td>
<input class="submit" type="image" src="save.jpg"></td>
</form>
...
}
my ajax_script.js
$(document).ready(function() {
$( "#upload" ).on("submit", function(e) {
e.preventDefault();
var id = $('.id').val();
var date = $('.datepicker').val();
var chk = $('.chk').prop('checked');
var remark = $('.remark').val();
$.ajax({
type: 'POST',
url: 'update.php',
data: {id: id, date: date, chk: chk, remark: remark},
success: function (data) {
if(data.success == true)
{
console.log('everything fine');
}
},
error: function(){
console.log('something bad happened');
}
});
alert('Job done');
});
});
and the update.php
<?php
$id = $_POST['id'];
$date = $_POST['date'];
$chk = $_POST['chk'];
$cancel_bool = ((int)$chk) ? 1 : 0;
$remark = $_POST['remark'];
$year = substr($date,6,4);
$mon = substr($date,3,2);
$day = substr($date,0,2);
$date = $year.'-'.$mon.'-'.$day;
if($chk == "true"){
$chk = 1;
}else{
$chk = 0;
}
echo "<br>";
echo $id ."<br>".$date."<br>".$chk."<br>".$remark;
require_once('config.php');
$link = mysqli_connect (
MYSQL_HOST,
MYSQL_USER,
MYSQL_PASSWORD,
MYSQL_DATABASE
);
if(!$link){
die('connection failed: ' .mysql_error());
}
$sql = "UPDATE table1
SET date = '$date', cancel_bool ='$chk', remark = '$remark' WHERE id_submits = $id";
$result = mysqli_query( $link, $sql );
?>
With the first form it posts the following param by clicking on save.jpg:
chk true
date 16.04.2014
id 1396002713.9412
remark mytext_one
second form:
chk
date 08.04.2014
remark mytext_two
Where is the id?
Any help or idea?
Greets Yab86

Categories

Resources