I am generating a table of divs from mysql database with code as below :
<?php
$sql = "SELECT * FROM menuitem";
$result = mysql_query($sql); $i =1;
while ($row = mysql_fetch_array($result)) {?>
<div class="orderblock">
<div class="orderlist">
<div class="pimage">
<p></p>
</div>
<div class="pdesc">
<p><?php echo $row['prodname']; ?></p>
<p><?php echo substr($row['proddesc'], 0, 20); ?></p>
</div>
<div class="portion">
<input type="text" onblur="document.getElementById('tot<?php echo $i;?>').value=document.getElementById('por<?php echo $i;?>').value * document.getElementById('pri<?php echo $i;?>').value;" id="por<?php echo $i;?>" name="<?php echo $row['prodname']; ?>" >
</div>
<div class="price">
<p id="pri<?php echo $i;?>"><?php echo $row['price']; ?></p>
</div>
<div class="total">
<p><input style="border: none;" type="text" id="tot<?php echo $i;?>" disabled="disabled" value=""> </p>
</div>
</div>
</div>
<?php $i++; }
?>
this is my final code, finally I got it working but I am getting NaN as result could any please sort it for me.
thanks
Try this now. Before try this remove your blur event from html.I hope this will help you.
$(document).ready(function () {
$("input[type=text]").blur(function () {
var portion = $(this).val();
var price = $(this).parent().parent().find(".price p").text();
if(isNaN(portion)==false)
{
var tot = portion * price;
$(this).parent().parent().find(".total p input").val(tot);
}
else
{
$(this).parent().parent().find(".total p input").val(0);
}
});
});
Demo here
Related
I want to build filtering sidebar and search box . My problem is, I can't make it run searching box and filtering items together at the same time. I hope any of u can help me?
I think,the main problem is in my script "var s" php parameter where I'm getting cities from
Let's see what I've done so for,
Here's my script;
<script>
$(function(){
$('.item_filter').change(function(){
var p = multiple_values('p');
var s ='<?php echo $_POST["search"]; ?>';
var url ="product.php?product=<?php echo
htmlentities($_GET['product']) ?>&s="+s+"&b="+b+"&p="+p;
window.location=url;
});
});
function multiple_values(inputclass){
var val = new Array();
$("."+inputclass+":checked").each(function() {
val.push($(this).val());
});
return val.join('-');
}
</script>
Search Box
<form class="search" name="search" method="POST"
action="product.php?product=<?php echo
''.htmlentities($_GET['product']).''; ?>" >
<a href="javascript:void(0);"><input id="small_search"
name="searchTerm" class="item_filter s" <?php { echo "checked"; } ?>
list="local" /></a>
<?php
while($row = mysqli_fetch_assoc($result)){
$local = ($row['local']); ?>
<a href="javascript:void(0);" target="_blank"><input type="submit"
id="small_search_btn" value="Search"></a >
<datalist id="local">
<option value="<?php echo ''.htmlentities($row['local']).''; ?
>"></option>
<?php } ?>
</form >
**Filtering **
<div class="list-group" style="font-size:14px;">
<h4 style="font-size:16px; font-weight: bold; color:black;">
</h4>
<?php
some sql statement..
?>
<a href="javascript:void(0);" class="list-group-item"
id="left_filtering" >
<label >
<input type="checkbox" class="item_filter b" value="<?php echo
htmlentities($row['brand']); ?>" <?php if(in_array($row['brand'],$b
{echo "checked"; } ?> > <?php echo ucfirst($row['brand']);
?></a>
</label>
<?php } ?>
</div>
I want to move document.getElementById("b") checked in a loop.Is it possible? How can I make it happen?
<img class="img-responsive pic" id="picture" src="images/step1.png">
<?php
//get rows query
$query = $db->query("SELECT * FROM `template_design` WHERE `panel` = 'front'");
if($query->num_rows > 0){
while($row = $query->fetch_assoc()){
$im_id = $row['id'];
$images = "images/" .$row['image']. "";
?>
<div class="col-md-4 col-sm-4 wel-grid wow fadeInDown">
<div class="wel11">
<input type="radio" id="<?php echo 'radio_'.$im_id; ?>" name="front" onClick="changeSrc(<?php echo $im_id; ?>)">
<label for="<?php echo 'radio_'.$im_id; ?>" style="font-size:12px; cursor: pointer;">
<img id="<?php echo 'picture_'.$im_id; ?>" style="border: 1px solid #ccc;" class="img-responsive" src="<?php echo $images; ?>"></label>
</div>
</div>
<?php } } ?>
<script type="text/javascript">
function changeSrc(id) {
if (document.getElementById("radio_"+id).checked) {
document.getElementById("picture_"+id).src = "images/Ppicture3.png";
}
}
</script>
I want to repeat it in a loop ,as fradio0 i.e $front will increment, JavaScript also repeat in a loop to match each.
You can pass parameters with your id for example:
<input type="radio" id="<?php echo 'radio_'.$im_id; ?>" name="<?php echo $fname; ?>" onClick="changeSrc(<?php echo $im_id; ?>)">
and use it on script like
<script type="text/javascript">
function changeSrc(id) {
if (document.getElementById("radio_"+id).checked) {
}
}
</script>
Please try this. Pass radio id as attr id & save each images by respective id's, followed by respective id.png. Also remove onclick function from your html code.
<script type="text/javascript">
$("input:radio[name=front]").click(function() {
var id= $(this).attr('id');
document.getElementById("picture").src = "panel/front/" + id + ".png";
});
</script>
i have dynamic number of checkboxes and a button to post the checked elements to another page .. here is the code:
<div class="overSelect"></div>
<div id="checkboxes<?php echo $aa['id']; ?>">
<?php
$pid = select::property($aa['name']);
$arr2 = select::properties($pid);
$cc = 1;
foreach ($arr2 as $aa2) { ?>
<div style="padding-right: 20px" class="row"><label>
<input type="checkbox" value="<?php echo $aa2['name'] ?>" name="checks<?php echo $aa['id'] ?>[]"id="check<?php echo $aa['id']; ?>"><?php echo $aa2['name'] ?>
</label></div>
<?php } ?>
</div>
<a class="btn btn-primary btn-sm" name="update-all"onclick="update_all('prop_id<?php echo $aa['id']; ?><?php $counter; ?>','checks<?php echo $aa['id'] ?>')"id="btn-all<?php echo $aa['id']; ?><?php $counter; ?><?php echo $p['id']; ?>">save</a>
i tried this code but it is not working
<script type="text/javascript">
function update_all(a, b) {
var aa = document.getElementById(a).value;
var values = new Array();
$("input:checkbox[name=b]").each(function () {
if ($(this).is(":checked")){
values.push($(this).val());
}
});
alert(aa);
alert(values.length);
alert(values);
}
</script>
if the checkboxes checked .. it's value will be added to the array and posted to php page
any help please .. thanks in advance
I have created a form in yii and tried using the append method. In said form the user selects the items and enters the amount. If they click the button it will call the function. In output it shows "object text". How do I retrieve it?
<script type="text/javascript">
function myfunction ()
{
var newElem = document.createElement ("div");
newElem.innerHTML =document.createTextNode(amount);
newElem.style.color = "red";
var container = document.getElementById ("new");
container.appendChild (newElem);
}
</script>
<div class="form">
<?php $form=$this->beginWidget('CActiveForm', array(
'id'=>'travel1-form',
'enableClientValidation'=>true,
'clientOptions'=>array(
'validateOnSubmit'=>true,
),
)); ?>
<p class="note">Fields with <span class="required">*</span> are required.</p>
<div class="row">
<?php echo $form->labelEx($model,'name'); ?>
<?php echo $form->textField($model,'name',array('name'=>'name'),array('class'=>'addtocarts')); ?>
<?php echo $form->error($model,'name'); ?>
</div>
<div class="row">
<?php echo $form->labelEx($model,'Seattype'); ?>
<?php echo $form->dropDownList($model,'seattype',
array('S' => 'Sleeper', 'M' => 'Semi-sleeper','A'=>'Seater'),
array('empty' => '(Select Type)','name'=>'seattype'));?>
<?php echo $form->error($model,'seattype'); ?>
</div>
<div class="row">
<?php echo $form->labelEx($model,'amount'); ?>
<?php echo $form->textField($model,'amount',array('name'=>'amount')); ?>
<?php echo $form->error($model,'amount'); ?>
</div>
</div>
<?php echo CHtml::submitButton('Submit',array('name'=>'submit'))?>
<?php echo CHtml::htmlButton('AddtoCart',array('name'=>'addtocart','onclick'=>'myfunction();'))?>
<div id="new">
</div>
<?php $this->endWidget(); ?>
</div>
Please change your js function like below,
<script>
function myfunction ()
{
var container = document.getElementById ("new");
var newElem = document.createElement ("div");
newElem.innerHTML =$('#amount').val();
newElem.style.color = "red";
container.appendChild (newElem);
}
</script>
this amount textfield should include "id",
<div class="row">
<?php echo $form->labelEx($model,'amount'); ?>
<?php echo $form->textField($model,'amount',array('name'=>'amount','id'=>'amount')); ?>
<?php echo $form->error($model,'amount'); ?>
</div>
You need to get the amount from the textfield and then after creating the text node, append it to the newElem.
function myfunction() {
var amount = document.getElementById('amount').value; // amount value from textfield
var newElem = document.createElement("div");
newElem.appendChild(document.createTextNode(amount));
/* You can also use innerHTML instead of the above line like this newElem.innerHTML = amount; */
newElem.style.color = "red";
var container = document.getElementById("new");
container.appendChild(newElem);
}
<div id="new"></div>
<input type="text" id="amount" />
<button onclick="myfunction()">Click</button>
hi i am new to php and javascript. i have a problem. i wanted to obtain a value from javascript function and pass it on to php and use that value for a query. here's the code:
<?php
$link=mysqli_connect("localhost","root","", "personinfo") or die("Error " .mysqli_error($link));
?>
<body>
<div id="qBox">
<p>Name: </p>
<select id="sel">
<option value="1">Person1</option>
<option value="2">Person2</option>
<option value="3">Person3</option>
</select>
<button onclick="myFunction()">Submit</button>
</div>
<script>
function myFunction(){
var x = document.getElementById("sel").value;
}
</script>
<?php
$did=x;
$sql="SELECT * FROM personinfo where id=$did limit 1" or die("Error in the consult.." . mysqli_error($link));
$aResult=mysqli_query($link, $sql);
while($rows = mysqli_fetch_array($aResult))
{
$id = $rows['ID'];
$pid = $rows['personID'];
$fname = $rows['firstName'];
$lname = $rows['lastName'];
$department = $rows['department'];
$type = $rows['fType'];
?>
<div id="combi">
<div id="tag">
<p id="pColor">ID</p>
<p id="pColor">FIRST NAME</p>
<p id="pColor">LAST NAME</p>
<p id="pColor">DEPARTMENT</p>
<p id="pColor">TYPE</p>
</div>
<div id="content">
<b><?php echo $pid;?><?php echo $id;?></b><br />
<b><?php echo $fname;?></b><br />
<b><?php echo $lname;?></b><br />
<b><?php echo $department;?></b><br />
<b><?php echo $type;?></b>
</div>
</div>
<?php }
?>
</body>
if there's a way to do that it will be much appreciated, if not, what do i need to do to make this work? i hope you could help. thanks.
You need to submit a form using javascript for passing value in PHP. Try this-
CODE:
<html>
<?php
$link=mysqli_connect("localhost","root","", "personinfo") or die("Error " .mysqli_error($link));
?>
<body>
<div id="qBox">
<p>Name: </p>
<select id="sel">
<option value="1">Person1</option>
<option value="2">Person2</option>
<option value="3">Person3</option>
</select>
<button onclick="myFunction()">Submit</button>
</div>
<script>
function myFunction(){
var x = document.getElementById("sel").value;
var form = document.createElement("form");
input = document.createElement("input");
form.action = "";
form.method = "post"
input.name = "x";
input.value = x;
form.appendChild(input);
document.body.appendChild(form);
form.submit();
}
</script>
<?php
$x = '';
if(isset($_POST['x'])){ $x = $_POST['x'];}
$did = $x;
$sql="SELECT * FROM facultyinfo where id=$did limit 1" or die("Error in the consult.." . mysqli_error($link));
$aResult=mysqli_query($link, $sql);
while($rows = mysqli_fetch_array($aResult))
{
$id = $rows['ID'];
$pid = $rows['personID'];
$fname = $rows['firstName'];
$lname = $rows['lastName'];
$department = $rows['department'];
$type = $rows['fType'];
?>
<div id="combi">
<div id="tag">
<p id="pColor">ID</p>
<p id="pColor">FIRST NAME</p>
<p id="pColor">LAST NAME</p>
<p id="pColor">DEPARTMENT</p>
<p id="pColor">TYPE</p>
</div>
<div id="content">
<b><?php echo $pid;?><?php echo $id;?></b><br />
<b><?php echo $fname;?></b><br />
<b><?php echo $lname;?></b><br />
<b><?php echo $department;?></b><br />
<b><?php echo $type;?></b>
</div>
</div>
<?php } ?>
</body>