Updating input form after updating a table using jquery or ajax

Question

I have this table i've built with jquery and ajax (watching some tutorials, so i'm not an advanced programmer). Well, what i do is i insert some values in a table and i need to get all the sum of this values in an input form.

I can do that, but what i need is to get the sum without refreshing the page, so anytime i enter: 200 in the Value column, the Sum should become :

Sum + 200

Please i need some help with what to do, i've searched for datagrid, but sincerely i don't know how can i do it. Thanks

Php code of the input :

<table class="vlera">

<tr id="<?php echo $id; ?>" class="edit_tr">

<td class="edit_td">
<span id="first_<?php echo $id; ?>" class="text"><?php echo $kodi; ?></span>
<input type="text" value="<?php echo $kodi; ?>" class="editbox" id="first_input_<?php echo $id; ?>" /&gt;
</td>

<td class="edit_td">
<span id="last1_<?php echo $id; ?>" class="text"><?php echo $pershkrimi_pjeses; ?></span>
<input type="text" value="<?php echo $pershkrimi_pjeses; ?>" class="editbox" id="last_input1_<?php echo $id; ?>"/>
</td>
<td class="edit_td">
<span id="last_<?php echo $id; ?>" class="text"><?php echo $vlera; ?></span>
<input type="text" value="<?php echo $vlera; ?>" class="editbox" id="last_input_<?php echo $id; ?>"/>
</td>
<td class="edit_td">
<span id="last2_<?php echo $id; ?>" class="text"><?php echo $kosto; ?></span>
<input type="text" value="<?php echo $kosto; ?>" class="editbox" id="last_input2_<?php echo $id; ?>"/>
</td>

</tr>
<?php
}
?>
</table>

<?php
$sql_shuma="SELECT SUM(vlera) AS shuma FROM servis_pjeset_perdorura WHERE random=$random";
$resultshuma = odbc_exec($connection, $sql_shuma) or die(odbc_error());
while( $rowshuma = odbc_fetch_array($resultshuma ) ) {
           $total1 = $rowshuma['shuma'];
}
?>
<label for='shuma'>Shuma:</label>
<input id="shuma" name="shuma" type="text" value=" <?php echo $total1;?>"  size="20" />

can you post your code? or a part of it, maybe in a jsfiddle — DVM
– DVM, Commented Apr 4, 2013 at 11:26
yes, i did it, i pasted the code, what i need is to verify if the value has changed and if yes to update to current value — Al Al
– Al Al, Commented Apr 4, 2013 at 11:30
should the new value be first saved in the db table, or simply get the sum... — Hmxa Mughal
– Hmxa Mughal, Commented Apr 4, 2013 at 11:39
SO, THE DATA ON THE TABLE ARE SAVED IMMEDIATELY, WHAT I SHOULD BE ABLE TO DO IS TO REFRESH THE CONTENT OF THE SHUMA INPUT LET'S SAY ONCE THE TABLE HAS BEEN UPDATED OR ONCE IN A FEW SECONDS.. — Al Al
– Al Al, Commented Apr 4, 2013 at 11:40

Smern · Accepted Answer · 2013-04-04 11:39:56Z

1

the code you posted doesn't really show the full format (what the inputs look like)... but if you do something like:

$(".values").keyup(function() {
    var sum = 0;
    $(".values").each(function(){
        sum += Number($(this).val());
    });
    $("#shuma").val(sum)
});

and each of your text inputs you want to go towards the total sum has a class of "values" on it, it should work. http://jsfiddle.net/NNbtk/

answered Apr 4, 2013 at 11:39

Smern

19.1k22 gold badges77 silver badges93 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Al Al Over a year ago

Thanks :) yes, this was the idea...! let me paste the code of the table please, the one i have, so you can help me implementing this code to mine.. :)

Al Al Over a year ago

I've updated, so what i need is to add a table's row once it's completed without refreshing!

Dineshkumar · Accepted Answer · 2013-04-04 11:44:27Z

0

try this code... This code get the value of the text box when value enter and add it to the sum.

$(document).ready(function(){
   $('#shuma').keyup(function(){
   var val=$('#shuma').val();
   sum=sum+val;
    });
});

answered Apr 4, 2013 at 11:44

Dineshkumar

3711 silver badge8 bronze badges

Comments

Hmxa Mughal · Accepted Answer · 2013-04-04 12:00:19Z

0

just put this code inside another php file...say abc.php

<?php
$sql_shuma="SELECT SUM(vlera) AS shuma FROM servis_pjeset_perdorura WHERE random=$random";
$resultshuma = odbc_exec($connection, $sql_shuma) or die(odbc_error());

while( $rowshuma = odbc_fetch_array($resultshuma ) ) {
           $total1 = $rowshuma['shuma'];
}
echo $total1;
?>

Then from the main page do the following call on a button lets say button1

$(document).ready({
     setInterval(function(){            
        $.ajax({
            url: 'abc.php',
            type: "POST",
            success: function(contents){
               $('#shuma').val(contents);
            }

        });
     }, 1000);

});

Now the explanation:
In the main page when document gets ready, setInterval method of javascript will be called which takes 2 parameters, code and delay time in ms. this code will call the abc.php after every 1 sec and check the db for the new value and return it and put it in the field.

Hope that was what you were looking for.

edited Apr 4, 2013 at 12:00

answered Apr 4, 2013 at 11:54

Hmxa Mughal

3941 gold badge4 silver badges17 bronze badges

2 Comments

Al Al Over a year ago

so i need to include this abc.php inside the file i had right? can i do the refresh without the button1 triggered? The point is, it would be better if i solved it another way...

Hmxa Mughal Over a year ago

see edit answer, now it will call the abc without the button after every 1 sec

Collectives™ on Stack Overflow

Updating input form after updating a table using jquery or ajax

3 Answers 3

2 Comments

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related