Selecting text input from PHP form using jQuery

Question

I have php code that creates a table. For each item on the purchase order a new row is created and populated. The goal is when the purchase order is edited it gets posted back and saved in the database. Everything is working except my jQuery code will only iterate over the first row for however many rows I have. (So if I have three rows it will print the first rows cartid three times.)

Sorry if things look messy.

PHP Code:

<?php while($row = mysql_fetch_array($itemsquery)){?>
      <tr class="item-row" id="<?php echo $row['cart_id']?>">
          <td class="item-name"><div class="delete-wpr"><textarea><?php echo $row['on0'];?> <?php echo $row['itemname'];?></textarea><a class="delete" href="javascript:;" title="Remove row">X</a></div></td>
          <td class="description"><textarea class="cartid"><?php echo $row['cart_id'];?></textarea></td>
          <td><textarea class="cost" class="text-input" type="text"><?php echo $row['itemprice'];?></textarea></td>
          <td><textarea class="qty" type="text" name="name"><?php echo $row['quantity'];?></textarea></td>
          <td><span class="price" type="text">$<?php 
        $linecost = $row['quantity'] * $row['itemprice'];
        echo $linecost;?></span></td>
      </tr>
    <?php }?>

jQuery statement to see what it has grabbed:

$(document).ready(function(){
$(".item-row").change(function() {
$((".cartid")).each(function(){
    row = {
        cartid: $(".cartid").val()
        }  

 alert(row.cartid);
 performAjaxSubmission();
 })
});

i can't see, anywhere in your html a node with class "item-row" — André Alçada Padez
– André Alçada Padez, Commented Feb 27, 2013 at 17:19

Ryan George · Accepted Answer · 2013-02-27 17:23:21Z

2

It looks like you just have your selectors mixed up. You are wanting to iterate over each of the rows, but your selector is referencing $(".cartid"), which would always return the first result ever time.

This should fix your problem:

$(document).ready(function(){
$(".item-row").change(function() {
    $(".item-row").each(function(){
        var rowContext = $(this);
        var row = {
            cartid: $(".cartid", rowContext).val()
        }  
    alert(row.cartid);
    performAjaxSubmission();
});
});

answered Feb 27, 2013 at 17:23

Ryan George

1869 bronze badges

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

Comments

martriay · Accepted Answer · 2013-02-27 17:19:42Z

0

You have extra () in your .cartid selector.

$(document).ready(function(){
$(".item-row").change(function() {
$(".cartid").each(function(){
    row = {
        cartid: $(".cartid").val()
        }  

 alert(row.cartid);
 performAjaxSubmission();
 })
});

Also, shoudn't you be looping trough .item-row instead of .cartid?

answered Feb 27, 2013 at 17:19

martriay

5,7423 gold badges32 silver badges39 bronze badges

Comments

apoq · Accepted Answer · 2013-02-27 17:21:39Z

0

You're iterating like this:

$(".cartid").each(function(){
row = {
    cartid: $(".cartid").val()
    }

Seems like you should be doing

$(".cartid").each(function(){
row = {
    cartid: $(this).val()
    }

Haven't checked the rest of the code.

EDIT:

$(".cartid").each(function(){
var cart = $(this);
row = {
    cartid: cart.val()
    }

answered Feb 27, 2013 at 17:21

apoq

1,45413 silver badges14 bronze badges

Collectives™ on Stack Overflow

Selecting text input from PHP form using jQuery

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related