JQuery: passing data returned from ajax function to a variable

I'm not sure if I worded the question correctly. I am dynamically building a display of database records in a grid (row, cols). Some of the cells use form objects and I am using AJAX to help build them (the options in the select are stored in a db table). So my code looks like this (the return from the AJAX call is the complete ...set up:

   ...

//write cell html if (d == 1) { userdata += "" + thisitemarray[1] + "

"; } else if (d==2) {

                    //make ajax call to get departments
                    $.ajax({
                       type: "POST",
                       url: "lib/getDropDowns.php",
                       data: "thistable=departments&selecteditem=" + thisitemarray[1] + "&classnames=userdept userdatainput",
                       success: function(data){
                         userdata += "<p class=\"datacell department\">" + data + "</p>";
                       }
                  });

                 } else if (d == 3) {
                    userdata += "<p class=\"datacell bucket\"><input type=\"text\" value=\"" + thisitemarray[1] + "\" class=\"userbucket userdatainput\" dbid=\"" + dbid + "\"></p>";
                 } else if (d == 4) {
                    userdata += "<p class=\"datacell pubcode\"><input type=\"text\" value=\"" + thisitemarray[1] + "\" class=\"userpubcode userdatainput\" dbid=\"" + dbid + "\"></p>";
                 } else if (d == 5) {
                    userdata += "<p class=\"datacell area\"><input type=\"text\" value=\"" + thisitemarray[1] + "\" class=\"userarea userdatainput\" dbid=\"" + dbid + "\"></p>";
                 } else if (d == 6) {
                    userdata += "<p class=\"datacell hours\"><input type=\"text\" value=\"" + thisitemarray[1] + "\" class=\"userhours userdatainput\" dbid=\"" + dbid + "\"></p>";
                 } else if (d == 7) {
                    userdata += "<p class=\"datacell description\"><textarea class=\"userdesc\" dbid=\"" + dbid + "\">" + thisitemarray[1] + "</textarea></p>";
                 }//end d check 2

The problem is that this line of code:

success: function(data){
                         userdata += "<p class=\"datacell department\">" + data + "</p>";
                       }

does not show up on my page. I am assuming because userdata is being seen as a local variable within the function. How can I pull the data being passed from AJAX out into my script so I can use it?

Answers


before the loop add an counter:

var counter = 0;

Later use it as ID generator:

if (d === 1) { 
  userdata += "" + thisitemarray[1];
} else if (d === 2) { 
  var id = 'datacell_department_' + counter;
  counter++;
  userdata += "<p class=\"datacell department\" id=\""+id+"\"></p>";
  //make ajax call to get departments
  $.ajax({
    type: "POST",
    url: "lib/getDropDowns.php",
    data: "thistable=departments&selecteditem=" + thisitemarray[1] + "&classnames=userdept userdatainput",
    success: function(data){
      $('#'+id).html(data);
    }
  });
} else if (d === 3) {
  userdata += "...";
}

Need Your Help

Draw smooth circle in iOS sprite kit

ios drawing sprite-kit circle antialiasing

I try to draw a single circle in my iOS SpriteKit project but the edges of the circle are not smooth. I would like to have a nicely drawn circle as I would draw it with Photoshop (anti-aliasing). I...

Using same type for LINQ-to-SQL mapping on different tables

linq-to-sql

I have a LINQ-to-SQL data context in which two tables exist with different names but identical structures. One table (called CallRecords) holds live/current data, and the other (CallRecordsArchive)...

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.