Page 1 of 1

Ajax - multiple forms on a page not working

Posted: Mon Apr 11, 2016 7:48 am
by simonmlewis
I have a Page that lists all pages in a website.
There is an Ajax form with a Select option, to choose option a or b. Click Go, and it runs it through Ajax to a PHP script. You get a popup of confirmation.

Next to that form is another one, that simple posts the ID of the page, and a numeric value (basically the order of which it will appear in menus).

Trouble is, the second of these two forms, seems to pick up data from the first form.

Both Ajax queries are in the same JS file. The PHP queries are in separate files.

PHP code:

Code: Select all

<td>
<div id='formpage$row->id'>
<form><img src='/images/icon_sidemenuinsert.gif' /> 
<input type='hidden' id='id' name='id' value='$row->id'/>
<select name='sidemenu' id='sidemenu' class='sendtofriendemail'>
<option value='yes'";
if ($row->sidemenupageenable == "yes") { echo " selected='selected'";}
echo ">Show in Menu</option>
<option value='no'";
if ($row->sidemenupageenable == "no" || $row->sidemenupageenable == NULL) { echo " selected='selected'";}
echo ">Don't Show in Menu</option>
</select>
<input type='button' id='submit' value='Go' class='sidemenu'/>
</form></div>
</td>



<td>
<div id='formsort$row->id'>
<form>
<input type='hidden' id='id' name='id' value='$row->id'/>
<select name='priority' id='priority'>";
while ($countorder < $num_rows)
{
$countorder ++;
echo "<option value='$countorder'";
if ($row->priority == "$countorder") { echo " selected='selected'";}
echo ">$countorder</option>";
}
$countorder = 0;
echo "</select>
<input type='button' id='submit' value='Go' class='priority'/>
</form></div>
</td>
JS code:

Code: Select all

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



        $(".priority").click(function() {
                var form = $(this).parent('form');
                var email = form.children('input[name=id]').val();
                var buildid = form.children("select[name=priority]").val();
                // etc
                // Returns successful data submission message when the entered information is stored in database.
                var dataString = '&id=' + email + '&priority=' + buildid;
                if (email == '') {
                        alert("Please Fill All Fields");
                } else {
                        //AJAX code to submit form.
                        $.ajax({
                                type: "POST",
                                url: "ajax_pageorder.php",
                                data: dataString,
                                cache: false,
                                success: function(result) {
                                        alert(result);
                                }
                        });
                }
                return false;
        });        
});
PHP queries...

Code: Select all

// first one
session_start();
$id = isset($_POST['id']) ? $_POST['id'] : null;
$sidemenu = isset($_POST['sidemenu']) ? $_POST['sidemenu'] : null;

	if (isset($_SESSION["loggedin"])) {
  $usertype = $_SESSION["usertype"];
    if ($usertype == "admin")
      {
      include "dbconn.php";
      $result = mysql_query ("SELECT sidemenupageenable, title FROM pages WHERE id = '$id'");
      while ($row = mysql_fetch_object($result))
        {
      mysql_query("UPDATE pages SET sidemenupageenable = '$sidemenu' WHERE id = '$id'");
      if ($sidemenu == "yes")
      {
      echo "$row->title sidemenu Page Enabled";
      }
      else
      {
      echo "$row->title sidemenu Page Disabled";
      }
}
}}

// second file:

session_start();
$id = isset($_POST['id']) ? $_POST['id'] : null;
$sidemenu = isset($_POST['priority']) ? $_POST['priority'] : null;

	if (isset($_SESSION["loggedin"])) {
  $usertype = $_SESSION["usertype"];
    if ($usertype == "admin")
      {
      include "dbconn.php";
      $result = mysql_query ("SELECT priority, title FROM pages WHERE id = '$id'");
      while ($row = mysql_fetch_object($result))
        {
      mysql_query("UPDATE pages SET priority = '$priority' WHERE id = '$id'");
      {
      echo "$row->title order set to $priority";
      }
}
}}
The error I get is:

[text]<br />
<b>Notice</b>: Undefined variable: priority in <b>C:\xampp\phpMyAdmin\site\ajax_pageorder.php</b> on line <b>14</b><br />
<br />
<b>Notice</b>: Undefined variable: priority in <b>C:\xampp\phpMyAdmin\site\ajax_pageorder.php</b> on line <b>16</b><br />
Whrehousing order set to [/text]
This indicates to me that it is trying to post the first form instead.

I think it's something I have done wrng in maybe the <form> ids and the JS connection with them.

Re: Ajax - multiple forms on a page not working

Posted: Mon Apr 11, 2016 7:50 am
by simonmlewis
Damn, the very second I posted that, I spotted the error!!!
I posted this because for the last half hour I couldn't crack it. IT was a blasted variable issue!