Page 1 of 1

Ajax - Post multiple values - not working

Posted: Tue Nov 10, 2015 8:03 am
by simonmlewis
Hi

I am trying to post values from textarea fields, via Ajax, so the page doesn't need to turn over.

Code: Select all

<script type="text/javascript" src="/js/js_ajax_updateproductmetas.js"></script>

 <div id='formmeta$row->id'>
          <form>

       <input type='hidden' id='id' name='id' value='$row->id'>
      
       Title Tag:<br/>
         <input type='text' id='titletag' name='titletag' value='$row->titletag' style='width: 450px'><br/><br/>
       Meta Keywords:<br/><textarea name='metakeywords' id='metakeywords' style='font-family: arial; font-size: 11.2px; width:450px' rows='5'>$row->metakeywords</textarea><br/><br/>
       
       Meta Description:<br/><textarea name='metadescription' id='metadescription' style='font-family: arial; font-size: 11.2px; width:450px' rows='5'>$row->metadescription</textarea><br/><br/>
       <input type='button' value='Submit' id='submit' class='updateproductmetas'></form>
          </div>

Then in the JAvascript file I have this:

Code: Select all

$(document).ready(function() {
        $(".updateproductmetas").click(function() {
                var formmeta = $(this).parent('form');
                var id = formmeta.children('input[name=id]').val();
                var titletag = formmeta.children("input[name=titletag]").val();
                var metadescription = formmeta.children("input[name=metadescription]").val();
                var metakeywords = formmeta.children("input[name=metakeywords]").val();
                // etc
                // Returns successful data submission message when the entered information is stored in database.
                var dataString = '&id=' + id + '&titletag=' + titletag + '&metadescription=' + metadescription + '&metakeywords=' + metakeywords;
                if (id == '') {
                        alert("Please Fill All Fields");
                } else {
                        //AJAX code to submit form.
                        $.ajax({
                                type: "POST",
                                url: "ajax_updateproductmetas.php",
                                data: dataString,
                                cache: false,
                                success: function(result) {
                                        alert(result);
                                }
                        });
                }
                return false;
        });
});
And in the PHP file I have this:

Code: Select all

<?php
session_start();
$id = isset($_POST['id']) ? $_POST['id'] : null;
$titletag = isset($_POST['titletag']) ? $_POST['titletag'] : null;
$metadescription = isset($_POST['metadescription']) ? $_POST['metadescription'] : null;
$metakeywords = isset($_POST['metakeywords']) ? $_POST['metakeywords'] : null;

	if (isset($_SESSION["loggedin"])) {
  $usertype = $_SESSION["usertype"];
    if ($usertype == "admin")
      {
      include "dbconn.php";
mysql_query("UPDATE products SET titletag = '$titletag', metadescription = '$metadescription', metakeywords = '$metakeywords' WHERE id = '$id'");
}}
?>
But it's not doing anything. No errors or messages.

I'm convinced it's how I am handing the Parent, the Form and the outer Div. But cannot put my finger on it.

Help!! :)

Re: Ajax - Post multiple values - not working

Posted: Tue Nov 10, 2015 8:38 am
by Celauran
Have you been able to ascertain where it fails? Have you tried calling serializeArray on the form?

Re: Ajax - Post multiple values - not working

Posted: Tue Nov 10, 2015 8:43 am
by simonmlewis
No, as I've no idea what that is. Never seen it before.
When I click the Submit button, it does nothing at all. All the DIV parent and form child elements look ok to me, so I am a bit stuck.

Re: Ajax - Post multiple values - not working

Posted: Tue Nov 10, 2015 8:44 am
by simonmlewis
Might it make a difference that I am running the form within a Facebox popup???

Re: Ajax - Post multiple values - not working

Posted: Tue Nov 10, 2015 9:10 am
by simonmlewis
I noticed the 'input' in the JS file should have been textarea.

Code: Select all

$(document).ready(function() {
        $(".updateproductmetas").click(function() {
                var form = $(this).parent('form');
                var id = form.children('input[name=id]').val();
                var titletag = form.children("input[name=titletag]").val();
                var metadescription = form.children("textarea[name=metadescription]").val();
                var metakeywords = form.children("textarea[name=metakeywords]").val();
                // etc
                // Returns successful data submission message when the entered information is stored in database.
                var dataString = '&id=' + id + '&titletag=' + titletag + '&metadescription=' + metadescription + '&metakeywords=' + metakeywords;
                if (id == '') {
                        alert("Please Fill All Fields");
                } else {
                        //AJAX code to submit form.
                        $.ajax({
                                type: "POST",
                                url: "ajax_updateproductmetas.php",
                                data: dataString,
                                cache: false,
                                success: function(result) {
                                        alert(result);
                                }
                        });
                }
                return false;
        });
});
But still no success

Re: Ajax - Post multiple values - not working

Posted: Tue Nov 10, 2015 9:17 am
by simonmlewis
I just put an Ajax form into a Facebox popup and indeed, it failed to submit.
So there is something conflict with that. No idea where though.

Re: Ajax - Post multiple values - not working

Posted: Tue Nov 10, 2015 9:56 am
by Celauran
Is the POST request being sent at least? Trying to find out where the problem is occurring. Are you getting any errors in the console?