Jeditable, PHP + MySQL

Question

Okay, I'm horrendously new to MySQL and PHP, but could use some help here.

Grand vision: a big page full of editable fields (I'm using Jeditable, an edit-in-place jquery plugin) that stores values to different fields in the same row of a MySQL database.

I'm totally lost on how to properly post the values to different fields of the MySQL database, though. What I have is below; it's derived from the examples Jeditable provides. I can enter data into the fields, but it saves the ID of the field - not the data - and it appends it into multiple columns of my database, not the one correct column.

So, in short - how would I map what you see here to different locations in my MySQL database (example: one line item/record with a customer name value, a size value, an MRR at initial sale value, etc?)

Here is my HTML-

<!-- JQuery to extract form data... -->
  <script type="text/javascript" charset="utf-8">
    $(document).ready(function() {
      $('#paragraph_1').editable('save.php');
    });

    $(document).ready(function() {
      $('#custsize').editable('save.php');
    });

    $(document).ready(function() {
      $('#mrratsale').editable('save.php');
    });
  </script>

<!-- my form fields... -->
<h2 id="paragraph_1" name="paragraph_1"></h2>
<h3 id="custsize" name="custsize"></h3>
<h3 id="mrratsale" name="mrratsale"></h3>

...and here is my save.php file...

   <?php
      require_once 'config.php';
      $query=sprintf("INSERT INTO customerdata (ListItemID, CustName, CustSize, MrrAtSale)
        VALUES (%d, '%s', '%s', '%s')",
         $id, $_POST['id'], $_POST['id'], $_POST['id'], stripslashes($_POST['value']));

      $dbh->exec($query);
       /* What is echoed back will be shown in webpage after editing.*/
         print $_POST['value']; 
     ?>

Any help at all would be much, much, much appreciated (and try not to laugh!)

Answer 1

What you have to do is target each editable database write to its own function - so you can target individual fields.

So your html files should read (I also cleaned up your JS):

<!-- JQuery to extract form data... -->
<script type="text/javascript" charset="utf-8">
  $(document).ready(function() {
    $('.paragraph_1').editable('save.php?type=paragraph');
    $('.custsize').editable('save.php?type=custsize');
    $('.mrratsale').editable('save.php?type=mrratsale');
  });
</script>

<!-- my form fields... -->
<h2 id="1" class="paragraph_1"></h2>
<h3 id="1" class="custsize"></h3>
<h3 id="1" class="mrratsale"></h3>

Notice how I added query strings to the save.php file. You should also change the elements' id to a field in the record, so you can update the correct record.

The php file:

<?php
  require_once 'config.php';

  $type = (isset($_GET['type'])) ? $_GET['type'] : "";
  $value = (isset($_POST['value'])) ? $_POST['value'] : ""; //value posted
  $id = (isset($_POST['id'])) ? $_POST['id'] : ""; //id of the element

  if($type == "paragraph") {
    mysql_query("UPDATE customerdata SET paragraph='$value' WHERE id='$id'");
  } elseif ($type == "custsize") {
    mysql_query("UPDATE customerdata SET CustSize='$value' WHERE id='$id'");
  } elseif ($type == "mrratsale") {
    mysql_query("UPDATE customerdata SET MrRatSale='$value' WHERE id='$id'");
  };

   print $value; 
?>

You should add some validation and clean the data before putting it in the database but this should get the jEditable working.

Note that you should probably update the record rather than insert ing it otherwise you will be creating a new record everytime the data is editted.

You can see the id is used to update the correct record.

I haven't really used jEditable recently but this should get you started.

Answer 2

Okay, I'm a bit confused. Is your problem that you are trying to target certain fields, but yet you can't? If so, make sure there is a field designated as a Primary Key and use that to specify which row you want the field to be updated. If you don't target a specific row containing a precise value to be be matched up against, I fail to see how you're going to ever change the correct record when you have more than one in a table.

Second, how are you handling all of these fields? I hope they are not just generated on the fly each time the form code is saved. I say this because unless you have a very good naming convention setup, it will be a nightmare to ever sort out data saved in that table later on. In other words, spend some time clearly labeling your fields (user_name, user_email, etc. NOT field01, field02, etc.) Also be aware that if the code is somehow creating a new field based on what fields are present/submitted, that opens up a bunch of other stuff to be mindful of. Can a person make a page with a thousand form fields in HTML, submit that and your database try and make afield for all of them? If you have some sort of field verification system in place (with some finite limits in place), I'd suggest stop relying on code you didn't make/understand to build/manage your database info automagically. Just make the fields you need and name them intelligently.

Third, why not just code the PHP and MySQL stuff by hand? Not only will that help you learn how to code better in both of those, it also sounds like the Jeditable thing is a waste of time if it doesn't work like you want with minimal tweaks. What you're describing is not hard to do - and don't use JQuery if you can help it (it's a crutch for new JS people).

Hope some of this helps/answers your question(s).