Dynamically fill entry form

Question

I have two tables on my page and they appear side-by-side. The first one contains an entry form and the second one contains a grid that displays rows of records.

When the user clicks on a row, the data related to that row must appear on the boxes of the form in the first table.

I know how to call a .php file through AJAX. But when I have queried the database and obtained the result-set, how to bring all those values to fill the entry form of the first table?

Answer 1

You can get your data in json format and set input fields values in callback function using it.

$.getJSON(
  "your_url_to_request_data", {
    your_params: and_it_values
  }, 
  function(data) {
    // data <-- this is your data
    $("#field1").val( data.something );
  }
);

Answer 2

You need to send the result from the database to your JavaScript file via a callback function as silent implied. You also need to encode the data to JSON before sending it to JavaScript.

What you have to do in the callback function in your JavaScript file is to parse your result to JSON using native JSON parser. You access it by writing

JSON.parse(here_you_write_the_data_to_be_parsed);