sending mutiple arrays with ajax and updating SQL from sortable connected lists

35 Views Asked by At

I have been struggling with sending 3 arrays to a PHP update script with ajax. The goal is to have three lists on the page (employee, manager, admn) and when the user drags an item from one list to another then the ajax call should update the order of all three lists. I guess I'm just not understanding clearly the way to send 3 arrays via ajax. Here's the code I have tried, with other attempts commented out in the code:

<script type="text/javascript">
    $(document).ready(function(){
        jQuery(function($) {
            $(".connectedSortable").sortable({
                connectWith: ".connectedSortable",
                update: function(event, ui) {
                    // This event is triggered when the user stopped sorting and the DOM position has changed.
                    var emp = $("#sortable-emp").sortable("serialize").toString();
                    var man = $("#sortable-man").sortable("serialize").toString();
                    var adm = $("#sortable-adm").sortable("serialize").toString();
                    //var emp = $("#sortable-emp").sortable("serialize");
                    //var man = $("#sortable-man").sortable("serialize");
                    //var adm = $("#sortable-adm").sortable("serialize");
                    console.log(emp);
                    console.log(man);
                    console.log(adm);
                    $.ajax({
                        url: 'updatepageorder.php',
                        type: 'post',
                        //data:  data: {'emp':JSON.stringify(emp),'man':JSON.stringify(man),'adm':JSON.stringify(adm)},
                        //data: JSON.stringify({emp: emp, man: man, adm: adm}),
                        data: "emp=" + emp + "&man=" + man+ "&adm=" + adm,
                        /*data: {'emp':JSON.stringify(emp),
                               'man':JSON.stringify(man),
                               'adm':JSON.stringify(adm)},
                               */
                        //contentType: "application/json; charset=utf-8",
                        //dataType: "json",
                        //traditional: true,

                        success: function(response){
                            toastr.success('The page order has been saved.', 'Success');
                            alert(response);
                        },
                        error: function (jqXhr, textStatus, errorMessage) {
                            alert('Error' + errorMessage);
                        },
                    });
                }
            }).disableSelection();
        });
    });
</script>




<div class="col-lg-2">
    <ul id="sortable-emp" class="connectedSortable">
        <li id="id_3"><a href="page.php?page=Company Policies">Company Policies</a></li>
        <li id="id_42"><a href="page.php?page=Health Care Information for Employees">Health Care Information for Employees</a></li>
        <li id="id_20"><a href="page.php?page=Hotel Corporate Agreements">Hotel Corporate Agreements</a></li>
    </ul>
</div>
    
<div class="col-lg-2">
    <ul id="sortable-man" class="connectedSortable">
        <li id="id_41"><a href="page.php?page=Planning">Planning</a></li>
        <li id="id_14"><a href="page.php?page=Expense Recording Procedures">Expense Recording Procedures</a></li>
        <li id="id_15"><a href="page.php?page=Project Naming Conventions">Project Naming Conventions</a></li>
        <li id="id_12"><a href="page.php?page=Project Close-Out Procedures">Project Close-Out Procedures</a></li>
        <li id="id_13"><a href="page.php?page=Year-End Close-Out Procedures">Year-End Close-Out Procedures</a></li>
    </ul>
</div>

<div class="col-lg-2">
    <ul id="sortable-adm" class="connectedSortable">
        <li id="id_26"><a href="page.php?page=New page">New page</a></li>
        <li id="id_6"><a href="page.php?page=Home">Home</a></li>
        <li id="id_44"><a href="page.php?page=Employee Home">Employee Home</a></li>
        <li id="id_5"><a href="page.php?page=Administration">Administration</a></li>
        <li id="id_36"><a href="page.php?page=Company Structure">Company Structure</a></li>
        <li id="id_25"><a href="page.php?page=Employee Setup">Employee Setup</a></li>
        <li id="id_4"><a href="page.php?page=Health Care Info">Health Care Info</a></li>
        <li id="id_10"><a href="page.php?page=Accounting">Accounting</a></li>
        <li id="id_11"><a href="page.php?page=Cloud Servers">Cloud Servers</a></li>
    </ul>
</div>

Here's the receiving code:


$emp = array();
$man = array();
$adm = array();
$response = "";

if(isset($_POST['emp'])){
    $emp = $_POST['emp'];
    $count = 100;
    foreach($emp as $id){
        $sql = "UPDATE pagelist2 SET access = 'employee', listingid = ? WHERE id = ?";
        $pdo->prepare($sql)->execute([$count, $id]);
        $count++;
    }
    $response .= "empcount: ".$count."<br>";
}

if(isset($_POST['man'])){
    $man = $_POST['man'];
    $count = 100;
    foreach($man as $id){
        $sql = "UPDATE pagelist2 SET access = 'manager', listingid = ? WHERE id = ?";
        $pdo->prepare($sql)->execute([$count, $id]);
        $count++;
    }
    $response .= "mancount: ".$count."<br>";
}

if(isset($_POST['adm'])){
    $adm = $_POST['adm'];
    $count = 100;
    foreach($man as $id){
        $sql = "UPDATE pagelist2 SET access = 'admin', listingid = ? WHERE id = ?";
        $pdo->prepare($sql)->execute([$count, $id]);
        $count++;
    }
    $response .= "admcount: ".$count."<br>";
}

$response .= "end.";
echo $response;

Either the code will do nothing, or I will get an error about " Invalid argument supplied for foreach()".

0

There are 0 best solutions below