The below coding is my doubt. the total fees value is fetched from db. and paid is currently we enter. now i want that if i enter any value in paid, the entered value is subtract from db value and new value is display in bal fees text box and as well as store in db.
my coding is...
<HTML>
<HEAD>
<script language="javascript">
function doMath()
{
var oldbal= parseInt(document.getElementById('totalfees').value);
var paid= parseInt(document.getElementById('paid').value);
var totalfees = oldbal-paid;
document.getElementById('totalfees').value = totalfees;
}
</script>
</HEAD>
<body>
<?php
//fteching query
include("db.php");
$billtype_id = $_GET['billtype_id'];
$result=mysql_query("select * from bill_type where billtype_id=$billtype_id");
while($res=mysql_fetch_array($result))
{
$totalfees=$res['totalfees'];
}
//inserting query
$sql=mysql_query("insert into fees_admin values totalfees='$balfees' WHERE billtype_id='$billtype_id'",$conn);
include("config.php");
$balfees=$_POST['totalfees'];
$sql=mysql_query("insert into fees_admin values totalfees='$balfees' WHERE billtype_id='$billtype_id'",$conn);
?>
//html form
<form name="form" method="post" action="<?php $_SERVER['PHP_SELF'];?>">
<table>
<tr>
<td>Total Fees :</td>
<td><input name="total" type="text" id="oldbal" value="<?php echo $totalfees;?>" readonly="true" style="background-color:#FFFFFF"></td>
</tr>
<tr>
<td>Paid :</td>
<td><input type="text" id="paid" name="paid" onKeyUp="doMath();"></td>
</tr>
<tr>
<td>Bal Fees</td>
<td><input name="totalfees" type="text" id="totalfees" readonly="true" style="background-color:#FFFFFF"></td>
</tr>
</table>
</form>
Thanks for reading. please clear my doubt..
To be clear, input elements will return a string when you call "value". So in your example you would need to change the subtraction equation to:
var totalfees = parseFloat(oldbal) - parseFloat(paid);
You can use parseFloat to create a float from a string or parseInt if you don't need decimal precision.
You should probably also change you HTML code to make the DOM level 0 event "change" rather than keyUp. Its more consistent across a range of different browsers (Desktop, Mobile, Tablet).
Change
var oldbal= parseInt(document.getElementById('totalfees').value);
to
var oldbal = parseInt(document.getElementById('oldbal').value);
Function should then look like
function doMath()
{
var oldbal = document.getElementById('oldbal').value;
var paid = document.getElementById('paid').value;
var totalfees = parseInt(oldbal) - parseInt(paid);
document.getElementById('totalfees').value = totalfees;
}
I believe you were retrieving the wrong input element.
Related
I am trying to push the data from this simple html grid into sql but I can't do it. in the beginning, I got the error that there was no index for the var impressions. I fixed that. when I use just the advertiser value I can push the data into mysql while with the second value, I can't succeed. can you explain me what I am doing wrong?
Thanks in advance
<?php
include_once 'con_ui.php';
if(isset($_POST['btn-save']))
{
$advertiser = $_POST["advertiser"];
$impressions = (isset($POST["impressions"])?
$_POST["impressions"]:'');
$sql_query = "INSERT INTO data(adv, imp) VALUES('$advertiser', '$impressions')";
mysql_query($sql_query);
// sql query for inserting data into database
}
?>
<html>
<head>
</head>
<body>
<form method="post">
<table id="myTable" align='center' cellspacing=0 cellpadding=5 border=1>
<tr>
<th>advertiser</th>
<th>impressions</th>
</tr>
<td>
<select name="advertiser" id="advertiser">
<option value="">Select advertiser</option>
<option value = "Brita ">Brita</option>
<option value = "Sammontana">Sammontana</option>
</select>
</td>
<td name= "impressions" id="impressions" >1000000</td>
<td>
<button type="submit" name="btn-save"><strong>SAVE</strong></button>
</td>
</form>
</body>
</html>
There's a few things wrong here:
Firstly the $POST in
$impressions = (isset($POST["impressions"])?$_POST["impressions"]:'');
Is missing an underscore and should be a $_POST
$impressions = (isset($_POST["impressions"])?$_POST["impressions"]:'');
Secondly the browser won't recognize
<td name= "impressions" id="impressions" >1000000</td>
as a form field. If you want to pass on values that the user can't edit you have a few options. You can use a hidden field like:
<td><input type="hidden" name="impressions" id="impressions" value="1000000">1000000</td>
or you can use a text input and disable user input like
<td><input type="text" name="impressions" id="impressions" value="1000000" disabled></td>
here you have the details of the code that i am using to achieve for adding the raws automatically, have the users entering data and keeping the code editable
Hey thanks for your reply. Problem being is i need to have the user enter the date into the cell and and have and the content should be editable. in addition i'm having a button add row, to insert a new raw but doesn't work if use the form type as input. here you have the full code
<?php
include_once 'con_ui.php';
if(isset($_POST['btn-save']))
{
// variables for input data
$advertiser = $_POST["advertiser"];
$impressions = (isset($_POST["impressions"])?
$_POST["impressions"]:'');
// variables for input data
// sql query for inserting data into database
$sql_query = "INSERT INTO data(adv, imp) VALUES('$advertiser', '$impressions')";
mysql_query($sql_query);
// sql query for inserting data into database
}
?>
<html>
<head>
<script>
function myFunction() {
var table = document.getElementById("myTable");
var new_client = document.getElementById("advertiser_row1").innerHTML;
var new_impressions = document.getElementById("impressions_row1").innerHTML;
var row = table.insertRow(1);
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
}
</script>
</head>
<body>
<table id="myTable" align='center' cellspacing=0 cellpadding=5 border=1>
<form method="post">
<tr>
<th>advertiser</th>
<th>impressions</th>
</tr>
<td>
<select name="advertiser" id="advertiser_row1">
<option value="">Select advertiser</option>
<option value = "Brita ">Brita</option>
<option value = "Sammontana">Sammontana</option>
</select>
</td>
<td><input type="text" name="impressions" id="impressions_row1" value="1000000"></td>
<td>
<button onclick="myFunction()">Add Row</button>
</td>
<td>
<button type="submit" name="btn-save">Save</button>
</td>
</tr>
</form>
</table>
</body>
</html>
Trying to do some calc work with a dynamic table.
I have a table which uses a PHP for loop to create 2 rows with text inputs for the amount of days in the month.
I then need to take the first text input, and multiply it by 0.25 and show the result in the text input next to it.
Everything works, but cant get it to select the next text input.
This is the current:
$(".miles-input").on('keyup', function(){
var fuel_cost = $('.fuel_cost').val();
fuel_cost = parseFloat(fuel_cost);
var miles = $(this).val();
$('.price').val('£' +miles*fuel_cost);
});
The table when created created looks like:
<td><input type="text" class="miles-input"></td>
<td><input type="text" class="price"></td>
What I currently have changes all of the price inputs (of course) but no matter what I try I cannot get only the next input to change.
I have tried:
miles.next('.price').val('£' +miles*fuel_cost);
miles.closest('.price').val('£' +miles*fuel_cost);
Heres a jsFiddle:
http://jsfiddle.net/cd7t3ohn/
etc but none work. What is the correct way?
You can use:
$(this).parents("tr:first").find(".price:first").val('£' + (miles*fuel_cost));
It is not the best answer, but it will work. It will get you at the parent tr and then finding the first .price class.
miles is a String. Use this as your reference instead
$(this).next('.price').val('£' +miles*fuel_cost);
Try this:
$(function () {
$(".miles-input").on('keyup', function () {
var fuel_cost = $('.fuel_cost').val();
fuel_cost = parseFloat(fuel_cost);
var miles = $(this).val();
$(this).closest("tr").find(".price").val('£' + miles * fuel_cost);
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
Fuel cost:
<input type='text' class='fuel_cost' value='0.25'>
<br>
<br>
<table style="width:500px">
<tr>
<td>Date</td>
<td>Miles</td>
<td>Cost</td>
</tr>
<tr class="input">
<td>1 / 2 / 2015</td>
<td>
<input type='text' class='miles-input' />
</td>
<td>
<input type='text' class='price' />
</td>
</tr>
<tr>
<td>1 / 2 / 2015</td>
<td>
<input type='text' class='miles-input'/>
</td>
<td>
<input type='text' class='price'/>
</td>
</tr>
</table>
my 5 cents
$(this).parent() // get <tr>
.next() // next row
.children('.price') // <td> with price
.etc...
I have many forms in a page, each form with several inputs. When you click Submit on a form (say Form0), inputs are send to Reassign.php,that perform a search in a DB according to user inputs, and then a cell with div id="Cell0" in a table of the page is reloaded with data echoed by Reassign.php.
<script type="text/javascript">
$(document).ready(function(){
$("#Form0").submit(function(){
var MyVariables = $(this).serialize();
$('#Cell00').load('Reassign.php?MyVariables=' + MyVariables);
return false;
});
});
$(document).ready(function(){
$("#Form1").submit(function(){
var MyVariables = $(this).serialize();
$('#Cell10').load('Reassign.php?MyVariables=' + MyVariables);
return false;
});
});
</script>
A stripped down version of the table:
<table>
<tr>
<td><div id="Cell00"><img src="Image0.jpg"/></div></td>
<td><div id="Cell01">Text1</div></td>
<td><div id="Cell02">Price1</div></td>
<td><div>
<form name="Form0" id="Form0">
<input type="hidden" name="Qst" value="0">
<input type="image" src="ReloadRed.gif" alt="Submit"/>
<select name="cmb1"><option>cmb1Option1</option><option>cmb1Option2</option></select>
<select name="cmb2"><option>cmb2Option1</option><option>cmb2Option1</option></select>
</form>
</div>
</td>
</tr>
<tr>
<td><div id="Cell10"><img src="Image0.jpg"/></div></td>
<td><div id="Cell11">Text1</div></td>
<td><div id="Cell12">Price1</div></td>
<td><div>
<form name="Form1" id="Form1">
<input type="hidden" name="Qst" value="0">
<input type="image" src="ReloadRed.gif" alt="Submit"/>
<select name="cmb1"><option>cmb1Option1</option><option>cmb1Option2</option></select>
<select name="cmb2"><option>cmb2Option1</option><option>cmb2Option1</option></select>
</form>
</div>
</td>
</tr>
</table>
A sample Reassign.php:
<?php
session_start();
$MyVariables = $_GET['MyVariables '];
$cmb1 = $_GET['cmb1'];
$cmb2 = $_GET['cmb2'];
$cmb3 = $_GET['cmb3'];
parse_str($MyVariables);
$Preg=$MyVariables;
$link = mysql_connect("localhost", usr, pswrd) or die(mysql_error());
#mysql_select_db("MyDB") or die( "Unable to select database");
mysql_query ("SET NAMES 'utf8'");
$query = "SELECT Img FROM MyTable WHERE Column1=$cmb1 AND Column2=cmb2";
if($success = mysql_num_rows($result) > 0) {
while ($row = mysql_fetch_array($result)) {
$image="../ImageFolder/".$row[0].".png";
}
}
echo "<img src=\"".$image."\" />";
?>
This is OK.
Now I want other cells in the table to change as well, but with different (and related) data. Indeed, in the DB seach by Reassign.php, $row[0] is echoed (and thus loaded) in Cell00, and I want $row[1] to be send to Cell01, $row[2] to Cell02 and so on.
My problem is that right now I'm loading Cell0 echoing their content. I think i could do the job calling different php (Reassign0.php to echo data to Cell00, Reassign1.php to echo data to Cell01) but seems rather odd. Any ideas?
Here is a better approach... You can echo JSON instead of HTML from you PHP script, with all fields of the row. (Other code must be put in place for this to work for you, I'll let you research it on your own)
echo json_encode($row);
In your JS, get that json with $.getJSON(url, callback) or $.get(url, callback) depending on your server configuration
Then, loop through the cells and inject the data in your callback
$.getJSON('Reassign.php?MyVariables='+MyVariables, function(row){
for(i=0;i<row.length;i++){
$("#Cell0"+i).html(row[i]);
}
});
EDIT: if you data is not already formatted as HTML (like for images), be sure to do it in your callback. For example, if the first element is always an image URL and the rest is plain data, you can do :
$.getJSON('Reassign.php?MyVariables='+MyVariables, function(row){
for(i=0;i<row.length;i++){
var content = ( i == 0 ) ? '<img src="'+row[i]+'" alt="" />' : row[i];
$("#Cell0"+i).html(content);
}
});
well the title may sound confusing but what im trying to do is create a php which will return a JSON array of countries. This JSON array is then converted into a HTML table. I have done the html side but i am struggling with the php side. Im not necessary asking for code, just some guidance or an example. I am struggling with linking the html with php. I have a x y and z user input where they enter a number and i have created an equation for this. I have added the extra column in the html side, however i am having difficulties with the php. Below is my html code and my php attempt. Any idea how i can go about it?
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function()
{
var x ='x';
var y = 'y';
var z = 'z';
$('<tr><td>'+x+'</td>' +
'<td><input id="'+x+'" class="textbox" type="text" value="1" />'+
'</td></tr>').appendTo('#menu');
$('<tr><td>'+y+'</td>'+
'<td><input id="'+y+'" class="textbox" type="text" value="1" />'+
'</td></tr>').appendTo('#menu');
$('<tr><td>'+z+'</td>'+
'<td><input id="'+z+'" class="textbox" type="text" value="1" />'+
'</td></tr>').appendTo('#menu');
// creating Variable x y z for user input
$('<tr><td><b>Please enter the number of results</b></td>'+
'<td><input id="num" type="text" class="textbox" value="10" />'+ // allows user to change the number of countries
'</td></tr>').appendTo('#menu');
$('<tr><td></td><td><input id="button" type="button" onClick="obtainCountries()" value="Submit"/>'+
'</td></tr>').appendTo('#menu'); // Inserting a Submit button to allow user to obtain results
$('<table id="resulttable"/>').appendTo('#result');
});
function formula(x,y,z,b,s,g) {
return (((2*x) * bronze) + ((4*y) * silver) + (8*z * gold));
}
function orderCountries() {
//will load view.php, which will return a JSON array of countries
//this is then used to create a table of results
$.get("view.php",{x:$('#x').val(),y:$('#y').val(),z:$('#z').val()},
function(data) {
for(elem in data[0])
$("<th>"+elem+"</th>").appendTo('#resulttable');
$("<th>formula val</th>").appendTo('#resulttable');
for(var i = 0; i < $('#num').val(); i++) {
$('<tr id="row'+i+'"/>').appendTo('#resulttable');
for(elem in data[i]) {
$("<td>"+data[i][elem]+"</td>").appendTo('#row'+i);
}
$("<td>"+formula($('#x').val(),$('#y').val(),$('#z').val(),
data[i]['bronze'],data[i]['silver'],data[i]['gold'])+"</td>").appendTo('#row'+i);
}
},'json')
}
</script>
</head>
<body>
<h1 style="text-align:center">Creating Equation using Olympics database</h1>
<h3 style="text-align:center">My Formula = ((2x*bronze)+(4y*silver)+(8z*gold))</h3>
<table id="menu">
<tr>
<th scope="colhead">The Variables</th>
<th scope="colhead">Input</th>
</tr>
</table>
<div id="result"/>
</body>
</html>
Below is my PHP
<?php
require_once 'MDB2.php';
include "/diska/www/include/coa123-mysql-connect.php"; //to provide $username,$password
$db =& MDB2::connect($dsn);
if(PEAR::isError($db))
{
die($db->getMessage());
}
$x = $_GET["x"];
$y = $_GET["y"];
$z = $_GET["z"];
$db->setFetchMode(MDB2_FETCHMODE_ASSOC);
$sql="SELECT ISO_id, gdp, population, country_name, gold, silver, bronze, total
FROM Country WHERE '$x'='0' AND '$y'='0' AND '$z'='0'"
$res =& $db->query($sql);
if(PEAR::isError($res))
{
die($res->getMessage());
}
echo json_encode($res->fetchAll());
?>
You are getting the parse error because you are leaving out a semicolon after constructing the sql query
$sql="SELECT ISO_id, gdp, population, country_name, gold, silver, bronze, total FROM Country WHERE '$x'='0' AND '$y'='0' AND '$z'='0'"
I have forms which work fine. I have a quiz which works fine.
When I incorporate the two they don't work fine :(
The quiz works as a quiz but it wont send it out using php to my email address.
Here is a bit of my code:
<head>
<script>
CorrectAnswers = new Array();
CorrectAnswers[0]=1;
CorrectAnswers[1]=1;
CorrectAnswers[2]=1;
CorrectAnswers[3]=2;
macrightchar='YES';
macwrongchar='NO';
winrightchar='YES';
winwrongchar='NO';
var platform = 'win'
if (navigator.appVersion.indexOf('Mac') != -1) {platform = 'mac'}
if (platform == 'mac') {
rightchar = unescape(macrightchar)
wrongchar = unescape(macwrongchar)
}
else {
rightchar = unescape(winrightchar)
wrongchar = unescape(winwrongchar)
}
function CheckAnswer(){
var i = 0;
var TotalCorrect = 0;
var x = 0;
var Score = 0;
for (i=0; i<CorrectAnswers.length; i++){
if (document.QuizForm.elements[i*2].selectedIndex == CorrectAnswers[i]){
document.QuizForm.elements[(i*2)+1].value = rightchar;
TotalCorrect++;
}
else{
document.QuizForm.elements[(i*2)+1].value = wrongchar;
}
}
Score = Math.floor((TotalCorrect*100)/CorrectAnswers.length);
document.CheckForm.ScoreBox.value = Score + '%';
}
</script>
</head>
<body>
<form name="QuizForm" accept-charset="utf-8" method="post" action="forms/quiz/_process.php" onSubmit="return validate.check(this)">
<table class="widthOneHundredPercent">
<tr>
<td class="tableCellFloat columnOne" valign="top">
<label for="Big_Media_offers_a_great_multiplatform_tool">Big Media offers a great multiplatform tool</label>
</td>
<td class="tableCellFloat columnTwo" valign="top">
<select name="0">
<option>???</option>
<option>True</option>
<option>False</option>
</select>
<td valign=top>
<input type="text" name="1" size=2 maxlength=2>
</td>
</td>
</tr>
<tr>
<FORM name="CheckForm">
<td align="center">
<font face="Geneva,Arial"><input type="button" VALUE="Check" onClick="CheckAnswer()"> Your score is <input type=text name="ScoreBox" size="4" maxlength="4"></font>
<center><input type="submit" value="Submit Form" /></center>
</form>
When submit is pressed it will change the end of my file name in the address bar from quiz.php to quiz.php?ScoreBox=75%25. So it takes my correct answers and wrong answers.
I need the quiz to show a live right and wrong answers when check scores is clicked but I also need to send the results using PHP.
If I'm going at it completely wrong perhaps someone can point me in the right direction to start fresh.
Regards.
Few things I notice here:
QuizForm doesn't have a submit button and does not appear to be submitted dynamically (may just not be shown). Perhaps this form and CheckForm can be combined.
CheckForm doesn't have a method defined, which is why the submit puts a query string on it
The score is being submitted instead of the raw answers. Perhaps this is desired behavior, but it leaves the ability for someone to just submit they got a great score.
The answer could be as simple as moving the submit button from CheckForm to QuizForm.
Try adding a closing <form> tag for 'QuizForm' before you open 'CheckForm'.
[edit]Actually, QuizForm doesn't seem to have a submission method.