Link to home
Start Free TrialLog in
Avatar of SueJStevens
SueJStevensFlag for United States of America

asked on

How do I Substitute Values in a Multidimensional Associative Array

I have a table that the user can sort using drag/drop method.  The table is created dynamically through a odbc_fetch_array to a sql server database.  For purposes of the attached illustration, I created a similar array and named it $original.
The user can reorder the rows through drag/drop and when the user clicks the button, I want the values in the last column 'New Sort Order' to to substitute into the original array.

I am a newbie to php programming, so any help you can give me is much appreciated.
sjstable2.php
vendor.css
application.css
application.js
Avatar of Ray Paseur
Ray Paseur
Flag of United States of America image

Here are some "getting started" resources.  Later this morning, I'll look at the attachments and see if I can help.
https://www.experts-exchange.com/Web_Development/Web_Languages-Standards/PHP/A_11769-And-by-the-way-I-am-new-to-PHP.html
What is the end purpose for updating the array?  

Your code is working perfectly, but naturally can't update the array because it was made in PHP and was written server side/executed server side.

Once the page is rendered you can only access the html output of it.  

If you want to save the new order then you will need to send that data back to the server (you can do that using AJAX if desired).
SOLUTION
Avatar of Ray Paseur
Ray Paseur
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of SueJStevens

ASKER

Ray,
You've gone to a lot of trouble to help out this newbie--so a big Thank you!

I need to take some time to absorb everything you've provided but obviously you are getting me on the right track.  I will come back later today to either close the question and award points or post something that will further this question to a solution.

The link 'http://iconoun.com/demo/temp_suejstevens.php' doesn't seem to be working.
Sue: I've had some issues with my hosting company, but this could also be something related to the fact that the link above has a spurious quote mark.  Try this link.  Then click the obvious one in the list ;-)

http://iconoun.com/demo/
Ray,
That link isn't working either.

So far, I've been able to take the scripts you've provided and use them in my project.  I've learned a lot by what you've provided.  Still, this is using a hard-coded array in the variable $new_order.  

I need to not hard-code the array but instead I need to capture it from the table after the user is done ordering the table rows.

As I'm reading through the response you've given to me it seems I have some work to do learning how to use JQuery to capture that information.   I have been successful in creating the 'Hello World' example you provided and I was successful in modifying that so I could capture an array based on the variable 'indata' shown in your example.  In my 'Hello World' I substituted the hard-coded array.  But I'm still stuck on how to capture the array from the table after the user is done ordering the table rows.

If you have another useful hint, i'll take it, or if I'm moving into a new question please let me know and I'll award points.

Thanks again,
Sue
That link isn't working either.
Don't know what to say - can you tell me the symptom that makes you think it's not working?  Is your browser cache turned off?  You can copy the script I posted above and install it on your own server to see it in action, so if you can't get to my server, that may be be helpful.

I think it might be easier to digest all of this in smaller bites.  There isn't much we can do with 147K of JavaScript - this is an all-volunteer forum and we just don't have the time to design and write entire applications.  But if you can break it down into some sample code that addresses a specific part of the problem, we might be able to do a better job for you.
greetings

@Ray , Your links do not work for me, It times Out, , you might check your Domain registrar to see if your Domain name lookup to IP is still viable.

@ SueJStevens, , I looked at your jaavascript, and you use TWO functions, but you do not need to do that.

here is some untested JS code, to use this you Must change the <tbody> in you table to     <tbody id="tb">     with an ID of "tb"
function newSortOrder() {
var oOrder = "";
var tbody = document.getElementById("tb");
for (var r =0; r < tbody.rows.length; ++r) {
  oOrder += tbody.rows[r].cells[2].innerHTML+"_";
  tbody.rows[r].cells[3].innerHTML = r;
  }
oOrder = oOrder.substr(0, oOrder.length-1);
tbody.rows[0].cells[1].innerHTML = oOrder;

$.post( "test.php", { oOrd: oOrder })
  .done(function( received ) {
    alert( "received: " + received );
  });
}

Open in new window


On the server side you get the  $_POST["oOrd"], maybe like
$oOrd = $_POST["oOrd"];
// turn the delimited text to an array with explode()
$oOrd = explode("_", $oOrd);

and then check to see if the Post array has same count as first array and ext to error control if not;
if (count($oOrd) ! = count($firstO) ) {
   //do error control here,
   }

make a new array
$newAry = array();
now send the $firstO into the  $newAry with the numbers from the  $oOrd
for ($i = 0; $i < count($oOrd); ++$i) {
   $newAry[$i] = $firstO[(int) $oOrd[$i] ];
   }

Now  $newAry has reordered content of $firstO .
this is untested code but you should be able to get a fair idea of the steps, methods and progression of code.

You do NOT indicate what Server PHP RESPONSE you NEED to go back to the browser AJAX javascript to be displayed on the page, or an error if Ajax up text has a problem, this is many times a very important consideration for AJAX, you need to have thought through ALL three steps-processes in the ajax exchange (browser - server - browser) and do code to get three separate code results, working together.

Ask questions if you need more info
Slick 812,
Thank you.  This looks promising.  I need a bit of time to digest this and apply it to my project.  I appreciate your offer to assist if I have more questions which I'm sure I will.
-Sue
I think my host has gotten the issues resolved.
http://iconoun.com/demo/temp_suejstevens.php
ASKER CERTIFIED SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Slick 812
Yes, this is getting me on the right track.  I'm going to have time to work on this more tomorrow and will post back here the results and/or any questions I might have.

Ray,
I enjoyed the articles you pointed me toward.

Thanks,
Sue
I will mention that most everyone, beginning in the browser AJAX functioning, can fell really unsure, or confused about what are all the parts and pieces needed, and how to do a step wise progression of methods to get from the browser, to the server, and back to the browser, with the useful result you think you want. For me and many others it was not easy to learn, and required a long time of use and experiments to see what happends, when you change the very many options for how to collect  input or changes in the browser, how you need to order and separate this data to send up to the server through the javascript. Then how to find and or use the POST references to get a PHP base of operations, and then do the PHP code , but NOT IN THE AJAX, at first, to get the PHP code in  workable state, you may need to do the first PHP as a stand alone page, with fake data posts and on workin, you then try and use it in the javascript AJAX.

The examples you see given are usually so simple like -

$.post( "eeAry.php", { nOrd: nOrder })
  .done(function( received ) {
    alert( "received: " + received );
  });

that people can not see how to expand the functionality, to do more complex turnarounds from the server. That usually takes some research from web searches and AJAX "How To" sites.
I really want to thank Slick812 and Ray Passeur for your time on my question.  Today I was able to get to a working solution in my application and I did use a variation of each of your examples.  Equally important, I learned a lot from your feedback and from going through the exercise of trying to understand your examples as I tried to incorporate them into my application.  I wish Experts Exchange would let me assign 500 points to each of you.
tank 4 points, I did this right after I did the comment, and was waiting to hear your questions, you did not ask, so I will post now, since I already did this. I will tell you, that many do not realize ,  the ajax communication between browser and server, is ALL TEXT, you can not push Arrays, Objects or functions through any Ajax, its all just text. To send Data that has several pieces or separate segments (as in an Array), you can use "Delimited" text or <XML> text. In my xample i use the "_" as a delimiter for Three number values. In almost all of my Ajax text push from server to browser, I use delimited text (using the "\n" and "\r" quite a bit, for two level segmentation, and others like "\0"), which are exactly the same escaped symbols in PHP and JS. Pleas consider usin delimited text for low levels of segmentation, instead of the mostly unneeded html JSON format.

<?php
$original = array(
  array("Column A"=>"A Item 1", "Column B"=>"B item 1", "Original Sort Order"=>1, "New Sort Order"=>0),
  array("Column A"=>"A Item 2", "Column B"=>"B item 2", "Original Sort Order"=>2, "New Sort Order"=>0),
  array("Column A"=>"A Item 3", "Column B"=>"B item 3", "Original Sort Order"=>3, "New Sort Order"=>0), 
  array("Column A"=>"A Item 4", "Column B"=>"B item 4", "Original Sort Order"=>4, "New Sort Order"=>0), 
  array("Column A"=>"A Item 5", "Column B"=>"B item 5", "Original Sort Order"=>5, "New Sort Order"=>0) 
  );

if (count($_POST) && !empty($_POST['nOrd']) ) {
  $nPost = $_POST['nOrd'];
  $nOrd = explode('_', $nPost);
  if (count($nOrd) != count($original))
    exit('#*Server Mis-Match*Server unable to finish request, error code: cnt511');
/*
to signal the ajax javascipt return, I pre-tend the return string
with a "#" for errors, and a "~" for success.
   ALSO
I place the "*" character as a string Delimiter, to divide the return
string into 3 segments, and then use  rAry = received.split("*"); in JS
*/
  $newAry = array();
  for ($i = 0; $i < count($nOrd); ++$i) {
    $original[(int) $nOrd[$i]]['New Sort Order'] = $i+1;
    $newAry[$i] = $original[(int) $nOrd[$i] ];
    }
  $nPost = str_replace('_', ', ', $nPost);
  echo '~*Sort Order is Updated*New Sort Order Arrangement as '.$nPost;
  exit;
  }

//I do NOT HAVE DRAG AND DROP SO I JUST SHUFFLE THEM
shuffle($original);
?><!doctype html><html><head><title>Array drag suffle</title>
<style>
#drTable {position: relative;}

#ajPop {position: absolute;
  display: none;
  top: 2px;
  left: 2px;
  width: 326px;
  height: 113px;
  background: #efe;
  border: 3px outset #969;
  }

#pTitle {color: #06b;
  margin-top:1px;
  margin-bottom:6px;
  }

.xBut{
position:relative;
top:1px;
right:1px;
width:1em;
height:1em;
font-weight:bold;
float:right;
line-height:98%;
cursor:pointer;
font-family:arial,sans-serif;
background:red;
color:white;
text-align:center;
border:1px solid white;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>/* <![CDATA[ */
function newSortOrder() {
var nOrder = "";
var tbody = document.getElementById("tb");
for (var r =0; r < tbody.rows.length; ++r) {
  nOrder += tbody.rows[r].cells[2].innerHTML+"_";
  tbody.rows[r].cells[3].innerHTML = r+1;
  }
nOrder = nOrder.substr(0, nOrder.length-1);
//tbody.rows[0].cells[1].innerHTML = nOrder;


var ajPost = $.post( "eeAry.php", { nOrd: nOrder });

ajPost.done(function( received ) {
// separate the received string into array with .split("*")
  var rAry = received.split("*");
// the rAry array will have 3 elements with success
// the first rAry[0] has the return signal character (not used)
// the second rAry[1] has the Title, and rAry[2] hs the message
  var title = document.getElementById("pTitle");
  var message = document.getElementById("pMess");
  
  switch (received.charAt(0)){
    case "~": // Success has a ~ begining
    title.style.backgroundColor = "#fff";
	title.innerHTML = rAry[1];
    message.innerHTML = rAry[2];
    break;
	
    case "#": // Error has # beginning
    title.style.backgroundColor = "#feb";
	title.innerHTML = "ERROR: "+rAry[1];
    message.innerHTML = rAry[2];
    break;
	
    default: // ALL PHP warning Errors do not have the ~ or #
// to see the errors look in browser page analysis Console
    console.log( received );
	title.style.backgroundColor = "#fcd";
	title.innerHTML = "ERRROR: Server Responce";
    message.innerHTML = "PHP did NOT complete without Problems. "+ajPost.status;
  }
  document.getElementById("ajPop").style.display = "block";
  }); // end of  ajPost.done(

}
/* ]]> */</script></head>
<body bgcolor="#FFE3F7">
<h3>Array drag suffle</h3>
<table id="drTable"><thead>
  <tr>
    <th>
	<div id="ajPop">
	<div class="xBut" onclick="$('#ajPop').hide();">X</div>
	<h3 id="pTitle">None</h3><span id="pMess">Message</span>
	</div>
  <?php echo implode('</th><th>', array_keys(current($original))); ?></th>
  </tr>
  </thead><tbody id="tb">
<?php foreach ($original as $row){ array_map('htmlentities', $row); ?>
    <tr>
      <td><?php echo implode('</td><td>', $row); ?></td>
    </tr>
<?php } ?>
  </tbody>
</table>
<button onclick="newSortOrder()">Update Sort Order</button>
</body></html>

Open in new window


I have used a hidden <div> to show on the ajax return with a "Title" and a "Message"

please notice how I used -
     switch (received.charAt(0)){

to analyze the received sendback to Change the processing of the browser, for different types of results gathered by the PHP processes, also look at the default, PHP writes Errors, warnings, , and starts with a <b> on most servers, so the default will know that there was a non programmed text entry into the output (by PHP).