在Ajax调用PHP之后更新值

Question

I want to update TextBox value on basis of selectChange

HTML:

<select name="abc" id="def">
    <option value="1">1st Record</option>
    <option value="2">2nd Record</option>
    <option value="3">3rd Record</option>
</select>
<input value="" name="final_value" id="final_value" />

JS:

$("#selectboxid").change(function() {
  $.ajax({ url: "test.php", data:"value="+$("#def").val() , success: function(){
     $("#final_value").val(data);
  }});
});

PHP:

<?php
    function abc($data){
      // Database operations
      echo json_encode($response);
    }

    abc($_GET);
?>

With this approach value is updating very nicely But i have below points:

1. above approach prints values and one can see in Network Tab. Is it a nice way to do it?
2. I also tried using return $response in PHP function but then response is null and console.log(data) in ajax shows null array.

So, how to update Input value after Ajax without echoing . I do not want that user shall see any type of response even in Network Tab.

I have seen various websites which does the same and not showing any values in Network tab. ** Is there any different approach to do this?

Answer 1

You can alternatively try like this

All HTTP requests can possible to watch on their own network. You can restrict this

$(document).ready(function(){
    var params = {};
    params['value'] = $("#def").val();
    $.post('test.php', params, function(response){
        console.log(response);
        alert(response);
    });
});

Answer 2

It should be like this

$("#selectboxid").change(function() {
  $.ajax({ 
     url: "test.php", 
     data:{
      "value": $("def").val() 
     }, 
     success: function(){
       $("#final_value").val(data);
     }
  });
});

Answer 3

I've not tested this, but immediatly I've spotted a couple of things:

$("#selectboxid").change(function() {
    // .val is a function
  $.ajax({ url: "test.php", data:"value"+$("def").val() , success: function(data)    { //Your success callback needs to take an argument
     //data will be either a string or a JSON object, so depending on what you want from it, you'll probably not be able to just pass it to the val() function
     $("#final_value").val(data);
  }});
});

Not 100% complete I'm sure, but hopefully will give you a good starting point