0

Until now I was using this code to post data from within a colorbox window until I ran into encoding errors, data being submitted as "ΞΞΧΑΩΞΞ" instead of 'ΔΙΧΡΩΜΟ':

$("#productadd").submit(function(){
  $.post(
  $(this).attr('action'),
  $(this).serialize(),
  function(data){
    alert('Product added to cart!');  
    $().colorbox.close();
  }
);

After some searching I decided to change my code to this so I can set the encoding when posting but I need some help to complete it:

$.ajax({
    type: "POST",
    url: $(this).attr('action'),
    contentType: "application/json; charset=iso-8859-7",
    dataType: "json",
    data: "{id: '" + someId + "'}",
    success: function(json) {
        alert('Product added to cart!'),  
        $().colorbox.close(),
        $("#success").html("json.length=" + json.length);
        itemAddCallback(json);
    },
    error: function (xhr, textStatus, errorThrown) {
        $("#error").html(xhr.responseText);
    }
});

but none of the calls inside success: are made, with the page being redirected to the url in form action and neither the alert or $().colorbox.close() are being called whereas, with the previous code, it used to submit in the same window (without redirectiong to the action url) and showing the alert and finally, closing the colorbox window. Any suggestions?

2 Answers 2

0

you have to prevent the normal form submit by preventing it to execute the default action, else it will perform a redirect to the url of the form as a normal form submission.

$("#productadd").submit(function(e){
e.preventDefault();
$.ajax({
    type: "POST",
    url: $(this).attr('action'),
    contentType: "application/json; charset=iso-8859-7",
    dataType: "json",
    data: "{id: '" + someId + "'}",
    success: function(json) {
        alert('Product added to cart!'),  
        $().colorbox.close(),
        $("#success").html("json.length=" + json.length);
        itemAddCallback(json);
    },
    error: function (xhr, textStatus, errorThrown) {
        $("#error").html(xhr.responseText);
    }
});
});
0
0

i believe this solves you problem with form submission

$("#productadd").submit(function(event){
event.preventDefault(); // prevent submission of the form and send ajax
  $.post(
  $(this).attr('action'),
  $(this).serialize(),
  function(data){
    alert('Product added to cart!');  
    $().colorbox.close();
  }
);

as for the encoding it could depend on Browser encoding that you get that result, try changing to other greek encodings or UTF-8.

4
  • My current encoding is iso-8859-7 and all forms submit fine (in Greek), except the one I sumbit via jquery/ajax.
    – bikey77
    Jul 12, 2012 at 10:29
  • try UTF-8 it should work! also take a look at this, stackoverflow.com/questions/553463/… , it for a different encoding but it shows some possible solutions to your encoding problem
    – Gntem
    Jul 12, 2012 at 10:36
  • Unfortunately the data in the db uses Windows encoding so I need to stick with iso-8859-7 and work around that.
    – bikey77
    Jul 12, 2012 at 10:53
  • you can change encoding of database and use utf-8 which supports greek as well as many other, good luck though
    – Gntem
    Jul 12, 2012 at 20:12

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.