StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
primarykey
Id
4558794
data
AcceptedAnswerId
0
AnswerCount
0
ClosedDate
CommentCount
2
CommunityOwnedDate
CreationDate
2010-12-29T23:31:53.603
FavoriteCount
0
LastActivityDate
2010-12-29T23:52:59.630
LastEditDate
2010-12-29T23:52:59.630
LastEditorUserId
298053
OwnerUserId
298053
ParentId
4558713
PostTypeId
2
Score
0
ViewCount
0
LastEditorDisplayName
text
Body
<p>Try using <a href="http://api.jquery.com/closest/" rel="nofollow"><code>.closest()</code></a> instead of <code>.parents()</code>. Also, you don't have a class named "partNo", just an input under the td with class "partNumber" (maybe try <code>$('.partNumber input').keyup(...);</code></p> <p>Also, you may want to look into <a href="http://php.net/manual/en/function.json-encode.php" rel="nofollow"><code>json_encode</code></a> and populate the fields with a single query to script.php instead of a couple of loads. You could do:</p> <p>script.php</p> <pre><code><?php $partNo = $_GET['vorunr']; // perform query to gather the data and populate $dbrow header('Content-Type: application/json'); // make sure browser knows what it is echo json_encode(Array( 'desc' => $dbrow['description'], 'price' => $dbrow['price'] )); ?> </code></pre> <p>then use something like</p> <pre><code>$('.partNumber input').keyup(function(){ var row = $(this).closest('.item-row'); var partNumber = $(this).val(); $.getJSON('<?php echo $_SERVER['PHP_SELF']; ?>',{vorunr:partNumber},function(data,textStatus,xhr){ $('.description input',row).val(data.desc); $('.price input',row).val(data.price); }); }); </code></pre> <p><strong>EDITv2</strong></p> <p>Here's a sample (Self-sufficient) file you can run and see what I mean.</p> <pre><code><?php // handle the ajax query if (isset($_GET['vorunr'])) // make sure you validate this variable; I'm not doing so for the sake of demo. { header('Content-Type: application/json'); echo json_encode(Array( 'desc' => $_GET['vorunr'], 'price' => sprintf('%0.2f',rand(100,99999)/100) )); exit; } ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <title>Ajax Sample</title>  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script type="Text/javascript"> $(document).ready(function(){ $('.partNumber input').keyup(function(){ var row = $(this).closest('.item-row'); var partNumber = $(this).val(); $.getJSON('<?php echo $_SERVER['PHP_SELF']; ?>',{vorunr:partNumber},function(data,textStatus,xhr){ $('.description input',row).val(data.desc); $('.price input',row).val(data.price); }); }); }); </script> </head> <body> <table> <tr class="item-row"> <td class="partNumber"><input type="text" name="partNo"></input></td> <td class="description"><input type="text" name="description"></input></td> <td class="price"><input type="text" name="price"></input></td> </tr> <tr class="item-row"> <td class="partNumber"><input type="text" name="partNo"></input></td> <td class="description"><input type="text" name="description"></input></td> <td class="price"><input type="text" name="price"></input></td> </tr> <tr class="item-row"> <td class="partNumber"><input type="text" name="partNo"></input></td> <td class="description"><input type="text" name="description"></input></td> <td class="price"><input type="text" name="price"></input></td> </tr> </table> </body> </html> </code></pre>
Tags
Title
singulars
PostAcceptedAnswerId
1. This table or related slice is empty.
PostParentId
1. POjQuery, update the right field
  singulars
  PostTypePostTypeId
  PTQuestion
PostTypePostTypeId
1. PTAnswer
UserLastEditorUserId
1. USBrad Christie
UserOwnerUserId
1. USBrad Christie
plurals
PostLinksPostIdRelatedPostId
1. This table or related slice is empty.
PostLinksRelatedPostIdPostId
1. This table or related slice is empty.
PostsAcceptedAnswerId
1. This table or related slice is empty.
PostsParentIdCreationDate
1. This table or related slice is empty.
VotesPostIdCreationDate
1. This table or related slice is empty.
CommentsPostId
1. COThanks for mentioning json_encode. I will look into it now :-)
  singulars
  PostPostId
  PO
  UserUserId
  USRagnar123
2. CO@Ragnar123: Take a look at my update, there's a piece of code you can run as-is and see it work live. Just pop in your database query to back the result and it should work great. ;-)
  singulars
  PostPostId
  PO
  UserUserId
  USBrad Christie

Querying!

Guidance

A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.