Hi,
I have a problem with some JavaScript code, i have three fields in my form scoreActuel, addedScore and NewScore, i used the onChange function because I want that every time the fields addedScore is updated , the field NewScore is updated as the sum of the values of the fields addedScore and scoreActuel, I hope I was clear
Below my source code:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
 <link   href="css/bootstrap.min.css" rel="stylesheet">
    <script src="js/bootstrap.min.js"></script>


<script >

function changeTest ( form ) { 

form.nv_scor.value = form.score.value + document.getElementById("sub_cat").value; }
</script>

</head>
<form class="form-horizontal" action="updateChauf2.php?id=<?php echo $id?>&amp; score= <?php echo $score?>" method="post">


      <div class="control-group">  
    <label>addedScore</label>
    <select name="sub_cat" id="sub_cat"></select>
    </div>

<!--score-->



                     <div class="control-group">  
                     <label for="score">scoreActuel</label>
                        <div >
                <?php
$pdo = Database::connect();
$pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$sql = "SELECT score FROM personnel WHERE id = {$id} ";
$q = $pdo->prepare($sql);
$q->execute();
$data = $q->fetchAll(PDO::FETCH_ASSOC);
Database::disconnect();
?>
<!--<select  size=1 name="score" id="score">
<option name="score" id="score" value="">--scoreActuel --</option>-->
<?php foreach($data as $value): ?>
<input readonly  name="score" id="score" onchange="changeTest(this.form)" type="text"   value="<?php echo $value['score'] ?>">
<?php endforeach; ?>
                        </div>
                         </div>

                                   <!--score-->



    <div class="control-group">  
    <label for="nv_scor">NewScore</label>
    <select name="nv_scor" id="nv_scor"></select>
    </div>




    <div class="form-actions">
                          <button type="submit" class="btn btn-success">update</button>
                          <a class="btn" href="chaufAffect.php">back</a>
                        </div>


</form>
</body>
</html>

My problem is that when the field addedScore is updated, the field NewScore is not updated, so the function changeTest does'nt work, i hope that someone could help me, thanks

Recommended Answers

All 7 Replies

form.score.value

There is no input called score, you have it commented out.

the ID of the label scoreActuel is score

<label for="score">scoreActuel</label>
                        <div >
                <?php
$pdo = Database::connect();
$pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$sql = "SELECT score FROM personnel WHERE id = {$id} ";
$q = $pdo->prepare($sql);
$q->execute();
$data = $q->fetchAll(PDO::FETCH_ASSOC);
Database::disconnect();
?>
<!--<select  size=1 name="score" id="score">
<option name="score" id="score" value="">--scoreActuel --</option>-->
<?php foreach($data as $value): ?>
<input readonly  name="score" id="score" onchange="changeTest(this.form)" type="text"   value="<?php echo $value['score'] ?>">
<?php endforeach; ?>
                        </div>
                         </div>

First thing, you're missing an opening <body> tag.

Second, the values are strings, and you can't sum those. You'll need to add + infront of each value.

function changeTest(form) {
    form.nv_scor.value = +form.score.value + +document.getElementById("sub_cat").value;
}

Or you might be able to use the Number() function like

function changeTest(form) {
    form.nv_scor.value = Number(form.score.value) + Number(document.getElementById("sub_cat").value);
}

You're attempting to update the value of a select element, but that won't work.
The value of a select element is it's selected option, so you would need to dynamically add/update the options of the select element.

I think I hurt explained my problem , I changed many things but the problem remains the same , so I'll explain again the problem from the beginning.
I have two integer fields with value integers $ _POST [' sub_cat ' ], $ _ POST [' scoreAct '] , whose identifier is sub_cat select type and is related to another drop in the form ( joursemaine ), so it is dynamically updated in the form, and scoreAct fields , its value is read directly from the database from a select query , what I want to realize is that the value of the field scoreAct changes automatically whenever the sub_cat fields are updated , the new value of scoreAct fields must equal the sum of its current value + the new value of sub_cat fields , I heard about the onChange function JS and I tried with it but it did not work , whenever the sub_cat field is updated , the fields scoreAct does not change, I have this code but it does not work:
updateOP1Bis.php the script that contains the form

<?php 
    include('config.php'); 
require 'database.php';
    mysql_query("set NAMES utf8");
$query_parent = mysql_query("SELECT * FROM joursemaine") or die("Query failed: ".mysql_error());

    $id = null;
    if ( !empty($_GET['id'])) {
        $id = $_REQUEST['id'];
    }

    if ( null==$id ) {
        header("Location: chaufAffect.php");
    }


?>

<!doctype html>
<html>
<head>
<meta charset="utf-8">
 <link   href="css/bootstrap.min.css" rel="stylesheet">
    <script src="js/bootstrap.min.js"></script>

<title>Dependent DropDown List</title>
<script type="text/javascript" src="jsBis/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {

    $("#parent_cat").change(function() {
        $(this).after('<div id="loader"><img src="img/loading.gif" alt="loading subcategory" /></div>');
        $.get('loadsubcat.php?parent_cat=' + $(this).val(), function(data) {
            $("#sub_cat").html(data);
            $('#loader').slideUp(200, function() {
                $(this).remove();
            });
        }); 
    });

});
</script>
</head>

<body>

<form name="forme" class="form-horizontal" action="updateOP1Bis.php?id=<?php echo $id?>" method="post">



      <div class="control-group">
    <label for="category">joursemaine:</label>
    <select name="parent_cat" id="parent_cat" onchange="myFunction()">
        <?php while($row = mysql_fetch_array($query_parent)): ?>

        <option value="<?php echo $row['id_joursemaine']; ?>"><?php echo $row['joursemaine']; ?></option>
        <?php endwhile; ?>
    </select>
    <br/><br/>
  </div>

    <!--score-->
   <div class="control-group">  
                     <label for="scoreAct" >scoreAct</label>
                        <div >
                <?php
$pdo = Database::connect();
$pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$sql = "SELECT score FROM personnel WHERE id = {$id} ";
$q = $pdo->prepare($sql);
$q->execute();
$data = $q->fetchAll(PDO::FETCH_ASSOC);
Database::disconnect();
?>
<!--<select  size=1 name="score" id="score">
<option name="score" id="score" value="">--الرصيد الحالي --</option>-->
<?php foreach($data as $value): ?>
<input readonly  name="scoreAct" id="scoreAct"  type="text"   value="<?php echo $value['score'] ?>">
<?php endforeach; ?>
                        </div>
                         </div>

                                   <!--score-->

      <div class="control-group">  
    <label for="sub_cat">sub_cat</label>
    <select  id="sub_cat" onchange="changeTest()" name="sub_cat"></select>
    </div>





    <div class="form-actions">
                          <button type="submit" class="btn btn-success">update</button>
                          <a class="btn" href="chaufAffect.php">back</a>
                        </div>


</form>

<script>
function changeTest (  ) { 
var x = document.getElementById("sub_cat").value;
var xBis = document.getElementById("scoreAct").value;
forme.scoreAct.value = x + xBis; 
alert(xS);
}
</script>

</body>
</html>

loadsubcatBis.php the script responsible for updating the fields sub_cat

<?php 
include('config.php'); 
//require 'database.php';

 $parent_cat = $_GET['parent_cat'];

//$pdo = Database::connect();
//$pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$query = mysql_query("SELECT * FROM scorejour WHERE id_joursemaine = {$parent_cat}");
while($row = mysql_fetch_array($query)) {
    echo "<option value='$row[id_score]'>$row[score]</option>";
    $sub_cat = $row['score'];
}
?>

i hope i was clear on my explication and i am sorry for my english,
is that someone can help me solve the problem or to find a more efficient solution I am ready thank you in advance

Member Avatar for diafol
function changeTest (  ) { 
    var sc = document.getElementById("sub_cat");
    var sa = document.getElementById("scoreAct");
    sa.value = parseInt(sa.value) + parseInt(sc.value); 
    alert(sa.value);
}

I am assuming that these values are integers?

yes this values are integers

I did as you told me , but it did not work , I did as you told me , but it did not work , I think because the initial value of scoreAct fields is read directly from the data base

<label for="scoreAct" >scoreAct</label>
                        <div >
                <?php
$pdo = Database::connect();
$pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$sql = "SELECT score FROM personnel WHERE id = {$id} ";
$q = $pdo->prepare($sql);
$q->execute();

, so I thought of creating a new field called NewsCore whose value is the sum of the two fields and sub_cat scorAct and I do like that,

<script>
function changeTest (  ) { 
    var sc = document.getElementById("sub_cat");
    var sa = document.getElementById("scoreAct");
    var sb = document.getElementById("nv_scor");
    sb.value = parseInt(sa.value) + parseInt(sc.value); 
    alert(sb.value);
}
</script>

but still the same problem, I do not know if I thought correctly , and I hope you can help me because it is part of my final project study

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.