AJAX does not send data to PHP

Navigation
3

is my first time using AJAX, for more examples that I put into practice, I can not make AJAX send PHP a variable, instead if it communicates with the PHP file, but when I give alert(data); I get the html from my page .php, instead of showing me the variable that happens as a parameter.

This is the pure AJAX 

$.ajax(
{
    type: "POST",
    url: 'IPE.php',
    data: { textValue : textValue }, //intentando pasar textValue que deberia valer 10:10 pero me da el html de ipe.php
    success: function(data){
    alert(data);//html ipe.php
    alert(textValue);//si vale 10:10
}

What is inside this dialog (dialog.js) 

 $(function () {
          $('#myTextBox').mask('00:00');
          //Set up the dialog box
          $("#myDialog").dialog({
              autoOpen: false,
              modal: true,
              title: "Escriba en formato HH:mm",
              buttons: {
                  'Agregar': function () {
                      var textValue = $('#myTextBox').val();// valor 10:10
                      var validTime = textValue.match(/^([0-9]*):[0-5][0-9]$/);
                      if (!validTime) {
                          alert('El formato ingresado no es correcto');
                      } else {
                        alert(textValue);
                          $.ajax(
                          {
                            type: "POST",
                            url: 'IPE.php',
                            data: { textValue : textValue }, //intentando pasar textValue que deberia valer 10:10 pero me da el html de ipe.php
                            success: function(data){
                            alert(data);//html ipe.php
                            alert(textValue);//si vale 10:10
                          }
                          });
                          $(this).dialog('close');
                          $('#myTextBox').val("");
                      }
                      //Now you have the value of the textbox, you can do something with it, maybe an AJAX call to your server!
                  },
                  'Cancelar': function () {
                      $(this).dialog('close');
                      $('#myTextBox').val("");
                  }
              }
          });
          //Open the dialog box when the button is clicked.
          $('#clickMe').click(function () {
              $("#myDialog").dialog("open");
          });
      });

This is the html 

<!DOCTYPE html>
<html>
<head>
<title>IPE (Indisponibilidad de Planta de Emergencia).</title>
<link rel="stylesheet" type="text/css" href="css/estilos.css">
<link href="css/jquery-ui.min.css" rel="stylesheet">

<script src="js/jquery-1.10.2.js"></script>
<script src="js/jquery-ui.min.js"></script>
<script src="js/jquery.mask.js"></script>
<script src="dialogo.js"></script>

</head>
<body>
  <div style="left: 82.5%; top:3%; position: absolute;">
    <input type="text" id="search" placeholder="Año..">
    <div id="myDialog">
      <input type="text" id="myTextBox" />
      <div id="result"></div>
    </div>
    <p id="result"></p>
  </div>
</body>
</html>

The part of (IPE.php) that must obtain the AJAX data 

if(isset($_POST['textValue'])) //
{
    $nuevo_registro = $_POST['textValue'];
    echo $nuevo_registro;
}

It should be noted that the html is inside IPE.php

    
asked by Benny BuAc 20.07.2017 в 17:51
source

4 answers

1

I think you're doing fine. As you mention in your question, when trying to visualize what the server is responding you see all the HTML of the page IPE.php instead of the answer that should generate echo $nuevo_registro . This is in itself a proof that $.ajax() is working.

What happens is that the function $.ajax() of JQuery makes a formal HTTP request to the server and it returns exactly what they are asking for. So, the server executes the PHP code of the page and serves it to the request, so it returns the complete page, that is, all the HTML that is in IPE.php .

What I recommend is that you try only PHP code in your file IPE.php . Imagine that your IPE.php looks like this: 

<?php 
if(isset($_POST['textValue'])) //
{
    $nuevo_registro = $_POST['textValue'];
    echo $nuevo_registro;
}
?>

This way you will get the result of the echo in response. You can see more information of $.ajax() in this link .

In the end, what I am trying to explain is that a formal HTTP request always returns all the HTML that is in the file to which you are making the request, that is the idea behind a web server. So the only thing you have to control is that your file to which you are making the request has only what you want to see and not extra HTML.

P.D. The answer of sioesi can also help you, although According to the documentation it is not completely indispensable. Greetings!

    
answered by 20.07.2017 / 18:11
source
0

I think those are very confused

In your Ajax you have the parameter data, where you send your variables the function success: it is executed once the Ajax managed to communicate with the server and it has answered it, that's why it receives as input the server response in this case the answer of the PHP file that you are calling, do not confuse data is the property where you can send the variables and in the success I have changed the name so you do not get confused. I hope you have given me to understand.

I will comment on the code to try to be clearer. 

$.ajax(
{
    type: "POST", //Método por el cual se hará la petición
    url: 'IPE.php', //Dirección del archivo solicitado 
    data: { textValue : textValue }, //Envió de variables
    //Aquí termina el envio
    //Apartir de aquí se recibe la respuesta de IPE.php
    success: function(respuestaservidor){//Si el archivo que llamamos se ejecuto sin problemas nos va a responder respuestaservidor es un parametro de entrada lo puedes llamar como quieras y este contiene la respuesta de IPE.php
    alert(respuestaservidor);//html ipe.php
}
    
answered by 20.07.2017 в 18:03
0

How are you sending an Object { }, the correct structure is: 

data: { "textValue" : textValue }

And in PHP as you are receiving it 

$_POST['textValue'];

Otherwise, it's all right.

    
answered by 20.07.2017 в 18:15
0

I would recommend the following:

1: separates the files one with the HTML and another one with the PHP so that you do not print the html in the same file

2: If you want it in the same file you can use a conditional if(isset($_POST['textValue'])) { ... } else { // TODO TU HTML}

3: It is best to use exit();

<?php if(isset($_POST['textValue'])) { $nuevo_registro = $_POST['textValue']; echo $nuevo_registro; exit(); } ?> <!DOCTYPE html> ...

    
answered by 20.07.2017 в 18:36
Detect DOCTRINE date collisions How to rename columns of a sql table using a query