error message not displaying in div

[ploppy]

I am using php as a backend to check db duplicates and issue error message if no item was entered etc. My problem is that the message is coming back from php (firebug confirms this) but it is not appearing in the div. I would be gratful if someone could check my code and point out my error. The div for errors is: 'errorMessage'. Many Thanks

$('#BA_boxsubmit').click(function () {
 
 var submit = $('#BA_boxsubmit').text();
 var company = $('#BA_customer :selected').text();
 var dept = $('#BA_dept :selected').text();
 var box = $('.BA_box').val();
 var service = $('#BA_service :selected').text();
 var authorised = $('.BA_authorised').val();
 var address = $('#BA_address :selected').text();
 var data = 'submit=' + submit + '&company=' + company + '&dept=' + dept + '&box=' + box + '&authorised=' + authorised + '&service=' + service + '&address=' + address;
 $.ajax({
  type: "POST",
  url: "boxesadd.php",
  data: data,
  success: function (data) {
  jAlert("You have successfully added\n\rBox: "+box+"\n\r"+
   "Customer: "+company+"\n\r"+
   "Department: "+dept+"\n\r"+
   "Submit: "+submit, 'Box addittion successfull');
  $("#BA_boxform").get(0).reset();
  $('#BA_addbox').html(data);
  $('#BA_address').html(data);
  $('#BA_dept').html(data);
  $('#errorMessage').html(data);
  //$("#form").dialog('close');
  $("#flex1").flexReload();

  }
 });
 return false;

 });

html

<div id="errorMessage"></div>

Relevant php code to appear in errorMessage div

if ($box == '')
{
   echo '<div style="background-color:#ffa; padding:2px; color:#ff0000;font-size:12px;font-weight:normal">' . 'You must select a box for intake' . '</div>';
}

[daveVk]

data: data,
success: function (data) {

try changing to

data: data,
success: function (replyData) {

and sort out which other references to data should be to replyData

$('#BA_addbox').html(data);
$('#BA_address').html(data);
$('#BA_dept').html(data);
$('#errorMessage').html(data);

I do not understand success vs failure logic, does the message need to, or actually go to, all above locations ?

[ploppy]

hi dave. this line is for successfull submission: $('#BA_addbox').html(data);

and this line:
$('#errorMessage').html(data);
should show errors.

I have also changed the data as per your your suggestion, but still no change. The other funny thing, is that the jAlert is not firing nor are the fields being reset beforeclose.

$("#boxaddform").dialog({
   autoOpen: false,
   resizable: true,
   modal: true,
   title: 'Submit a box intake request',
   width: 470,
   beforeclose: function (event, ui) {
    $("#BA_addbox").html("");
    $("#BA_address").html("");
    $("#BA_dept").html("");
    $('#errorMessage').html("");
   },
   close: function (event, ui) {
    $("#BA_boxform").get(0).reset();
   }
 
  });

thanks

[Fotiman]

What does Firebug tell you about #errorMessage? Does it have style applied to it (or one of it's ancestors) that would prevent it from being visible (like display:none)?

If the jAlert dialog is not appearing, then it's also possible that jAlert is not recognized and that's causing a JavaScript error (which would prevent the rest of your success handler from running).

[daveVk]

Add error handler similar to success handler
error: function () {
jAlert("Ops");
}

If it fires, check jQuery documentation on getting details of error.

Does the alert in the success function happen for successful submission ?

Does non successful submission return non 200 status code ?

I do not see any test for successful submission, it seems odd putting the reply in both #BA_addbox and #errorMessage' unconditionly.

[ploppy]

@fotiman
jAlert is being recognised. even if put alert('whatever'); it still isn't being fired.

@daveVk
I am getting 200 status code. And yes you are correct about the addbox & errorMessage. Don't know why I did that.