Not sending mail AJAX/PHP with modal no page refresh

I'm new. I have been searching and researching to make my AJAX send my form after submit and making a modal appear, I have figured out the modal to appear and make the page not refresh, and at one point I made the form send to my mail, but now I don't know what I did and I am so confuse, so if somebody can help or share a link and read it I would appreciate it :D. I'm using bootstrap. Thanks very much for reading. :D

Here is my HTML in the body (I have the javascripts all linked)

<div class="row">
        <div class="col-lg-6 col-md-6 col-sm-12">
            <form id="miformulariopers" method="post" action="php/sendmail.php" role="form">
            <div class="form-group">
                <label for="nombre">Nombre</label>
                <input type="text" class="form-control" id="nombre" name="nombre" placeholder="Tu nombre">
            </div>
            <div class="form-group">
                <label for="apellido">Apellido</label>
                <input type="text" class="form-control" id="apellido" name="apellido" placeholder="Tu apellido">
            </div>
            <div class="form-group">
                <label for="exampleInputEmail1">Email</label>
                <input type="email" class="form-control" id="exampleInputEmail1" name="mail"placeholder="Tu correo">
            </div>
            <div class="form-group">
                <label for="InputMessage">Mensaje</label>
                <textarea class="form-control" rows="3" placeholder="Tu mensaje" id="InputMessage" name="mensaje"></textarea>
            </div>
            <div class="form-group">
                <button id="buttonright" type="submit" class="btn btn-default" data-toggle="modal">Submit</button>
            </div>
            </form>
        </div>

This is my PHP:

<?php
$destinatario = 'mymail@gmail.com';
$nombre = $_POST['nombre'];
$apellido = $_POST['apellido'];
$mail = $_POST['mail'];
$asunto = 'Correo de la web';
$mensaje = $_POST['mensaje'];
$cabeceras = 'From: webmaster@example.com' . "\r\n" .
'Reply-To: webmaster@example.com' . "\r\n" .
'X-Mailer: PHP/' . phpversion();
?>
<?php
$success = mail($destinatario, $asunto, $nombre, $apellido, $mail, $mensaje, $cabeceras);
if ($success) {
    echo '<h1>Envío realizado</h1>';
    echo '<p>Personaliza tu mensaje aquí. Respetando las etiquetas "p"</p>';
} else {
    echo '<p><strong>Error al enviar el mensaje. Inténtelo de nuevo.</strong></p>';
}
?>

And my JS and AJAX:

$("#miformulariopers").submit(function () {
  event.preventDefault();
  $("#message").modal('show');

});
$("#buttonright").click(function () {
$.ajax({
        type : "POST",
        url : "php/sendmail.php",
        data: '#miformulariopers'.serialize(),
        dataType: "json",

        });
        });

AJAX Parsing HTML returns [object Object]

I'm trying to load a page in with AJAX using a method I found here.

Everything goes well until I get to the parse_html function. The correct values from the elements on the next webpage are assigned to the body variable (that is, a string of the HTML code from the body tag). But when it turns that into the jQuery object, $body ends up being equal to Object (which I think is maybe correct? I THINK this is a DOM object that has all the HTML from the body tags in it).

Finally, the jQuery object "$content" is made equal to the contents of the first "#content" element. However, response.$content ends up being equal to "[object Object]".

How do I make it so that when I use $content.html(response.$content) the #content div is filled with the HTML from the new page instead of [object Object].

function find_all($html, selector) {
  return $html.filter(selector).add($html.find(selector));
}

function parse_html(html) {
  return $($.parseHTML(html, document, true));
}

// Convert page contents to jQuery objects
function parse_response(html) {

  // 'body' is equal to the strings of text in between the body tags
  var body = /<body[^>]*>([\s\S]+)<\/body>/.exec(html),

  $body = body ? parse_html(body[1]) : $(),

  // '$content' is equal to the contents of the first #content element
  $content = $.trim(find_all($body, '#content').first().contents());

  // Output the variable "$content"
  return {
    '$content': $content
  }
}

For context, here is where I call these functions inline:

url = History.getState().url,
rel = url.replace(root, "/");
$.get(rel).done(function (data) {

    var response = parse_response(data);

    var $content = $("#content");

    $content
        .slideUp(500) // Get it off screen to start
        .promise()
        .done(function () {
            $content
                .html(response.$content)
                .slideDown(500);
        });
}).fail(function () {
            document.location.href = url;
            return false;
});

create a jquery function that adds points into total-points column in MySQL table based on comparion

jquery comparison of rows from a user prediction table and a result a results table. If the values are identical i want to award 3 point to user and add to total points.

$('#pred_table tr').each(function(){

            var currentRowHTML=$(this['Home_Score']&&this['Away_Score']).html();

            $('#fixure tr').each(function(){
                if($(this['Home_Score']&&this['Away_Score']).html()===currentRowHTML){


    //not sure where to begin with the doCalculation function

                    $(this).doCalculation("award 3 points into total points in another
                    table in database");

            }
        });
    });

JSONP issue with Cordova and WebAPI Error: Unexpected token :

I'm having an issue with a some cross site communication in a cordova app I'm toying with, the error is on the ajax call below.

Error in browser

Uncaught SyntaxError: Unexpected token :

The interesting part is that in the response the JSON is there, it just don't arrive to the success.

The WebAPI method

public JsonResult Search(string query)
{
    query = query.ToLower();
    RPAS_Operator op = new RPAS_Operator();
    SearchResultModel sm = SearchSupport.ParseData(op.RPAS_Operators.Where(a =>
    a.Name.ToLower().Contains(query)));
    return Json(sm, JsonRequestBehavior.AllowGet);
}

The jQuery

function Search(query) {
    var url = baseURI + "Search/Search/?query=" + query;
    $.ajax({
        url: url,
        type: 'GET',
        dataType: 'jsonp',
        cache: false,
        jsonp: 'callback',
        success: function (data) {
            console.log(data);
            document.getElementById("testOutput").innerText = data;
        }
    });
}

How to write php code inside jquery to update database table

I am working in Banking project .I want to write php code to update table upon successful Transaction using ajax . suppose i am sending request from fundtransfer.php to external API and the External API is also responding correctly .Now upon successful API respond i want to update my database table field name status from pending to completed .

    <script>
        $(document).ready(function()
        {
            $.ajax(
            {
            url:"http://ift.tt/1HoFteZ",
            type:"post",
            data:"variable="+value,
            success:function(result)
            {
                if(result==100)
                {
                    $("#message").html(successful transaction);
                    //Now i want to update my database tabale status saying Successful Transation 
                    //where to write these all php mysql code to update my database table
                   // without loading and redirecting page
                }   

                else
                {
                    $("#message").html(some thing gone wrong);
                }

            }
            });
        });
    </script>

redirect not work properly in codeigniter

Halo, i'm using ajax to post form into controller codeigniter. I want to redirect after ajax post, but controller doesn't redirect.

This is my ajax

$.ajax({
    type:"POST",
    url:form.attr("action"),
    data:form.serialize(),

    success: function(){

     },
    error: function(){
    alert("failure");
    }
});

}); });

this is my controller

public function checkout_data(){
    $this->account_model->checkout_simpan();
    redirect('produk/payment/last_steps');
}

this is my form

<form class="form-horizontal col-md-offset-3" id="form-checkout" action="<?php echo base_url('produk/payment/checkout_data');?>">

What wrong with my code ?

unable to reload the page after ajax success

I am trying to login using facebook JS, I am using the following code :

function FBLogin(){
    FB.login(function(response){
        if(response.authResponse){
            FB.api('/me', function(response) {
                    //alert(response);
                    jQuery.ajax({
                        url: 'someurl.php',
                        type: 'POST',
                        data: 'id='+response.id+'&firstname='+response.first_name+'&last_name='+response.last_name+"&email="+response.email,
                        dataType : 'json',
                        success: function(data, textStatus, xhr) {
                        $(document).ajaxStop(function(){
                          setTimeout("window.location = 'otherpage.html'",100);
                        });
                        },
                        error: function(xhr, textStatus, errorThrown) {
                            alert(textStatus.reponseText);
                        }
                    });
                   //window.alert(response.last_name + ', ' + response.first_name + ", " + response.email);
                 });
        }
    }, {scope: 'email'});
}

In this I have a ajax call, I want to reload the page after the ajax success. In someurl.php, I am just echo some text, I want to reload the page after the ajax success.

I have tried

success: function(data, textStatus, xhr) {
                            $(document).ajaxStop(function(){
                              setTimeout("window.location = 'otherpage.html'",100);
                            });
                            },

and

success: function(data, textStatus, xhr) {

                            window.location.reload();
                        },

but none of code is working, Please help me guys, How can I reload the page when the ajax is success