Unable to fill the other fields on the basis of option selected

Question

I want to fill the other fields on the form from database on the basis of option selected, but unable to do using php and javascript.I have attached json data I received in question. I want to fill other form fields when i select option from the form field houseowner_select and i want to show div app_houseowner when i select option from the select box having id applicant_is.

$("#applicant_id").on("change", function() {
  var selected = $(this).val();
  makeAjaxRequest1(selected);
});

function makeAjaxRequest1(opts) {
  $.ajax({
    type: "POST",
    data: {
      opts: opts
    },
    url: "get_houseownerinfo_applicant.php",
    success: function(res) {
      console.log(res);
      debugger;

      $("#applicant_wardno").val(res.ho_wardno);
      $("#applicant_citizenship_no").val(res.ho_citizenship_number);
      $("#applicant_phone").val(res.ho_phone);
    }
  });
}

<select name="applicant_is" class="form-control" ng-model="applicant.applicant_is" ng-change="callback_change_applicant_is($event)">
  <option value="">--select--</option>
  <option value="app_houseowner">घरधनी</option>
  <option value="landowner">जग्गाधनी</option>
  <option value="waris">वारिश</option>
</select>
<div class="app_houseowner">
  <select class="form-control" name="houseowner_select" id="applicant_id">
    <option value="">--Select--</option>
    <option value="<?php if (isset($row11['id'])){ echo $row11['id'];}?>">
      <?php if (isset($row11['ho_name_en'])){ echo $row11['ho_name_en'];}?>
    </option>

  </select>
</div>
<input type="text" name="applicant_phone" class="form-control" id="applicant_phone">
<select name="applicant_wardno" class="form-control" id="applicant_wardno">
  <option value="">--Select--</option>
  <?php for ($x = 1; $x <= 19; $x++) {
       echo "<option value=".$x.">".$x."</option>";
    }?>
</select>
<input type="text" name="applicant_citizenship_no" class="form-control" id="applicant_citizenship_no">

Did you get the expected result in `console.log(res);` from the ajax call ? — Cid, Jul 26 '19 at 06:22
There is no elements with id `applicant_salutation` in the shown HTML — Cid, Jul 26 '19 at 06:23
Also there is no element with id applicant_district in the shown HTML — Priyank, Jul 26 '19 at 06:24
@prabinashrestha you might want to add the ajax response as text — shrys, Jul 26 '19 at 06:28
Yes , I got the expected result from the console.log(res) and I want to show this in other fields. I didn't put all the fields in the question but it is already in my form. @Cid — Prabina, Jul 26 '19 at 06:45
It doesnot matter , which method i used , but i want to display in other fields. Please help me@shrys — Prabina, Jul 26 '19 at 06:48
I removed the fields in the question only but there is already in my form and i removed in the question as well@Priyank — Prabina, Jul 26 '19 at 06:50
@prabinashrestha still you got any error ? If yes then what ? — Priyank, Jul 26 '19 at 07:10
No error. But fields are not filled with the data. Can you look it through any other media?@Priyank — Prabina, Jul 26 '19 at 07:12
console.log(res.ho_wardno) or alert(res.ho_wardno) and check did you get the value of res.ho_wardno — Priyank, Jul 26 '19 at 07:13
that means you didn't get the value from the json. Check your json response first — Priyank, Jul 26 '19 at 07:24
When i did console.log(res), I got json value as above.@Priyank — Prabina, Jul 26 '19 at 07:25
All the in the form fields are correct still i'm unable to fill the form fields with values.@Priyank — Prabina, Jul 26 '19 at 07:28
add dataType: 'json', in your ajax request and check, also console.log(res) and give me the response i will check and update you asap — Priyank, Jul 26 '19 at 07:30
Thank you so much @Priyank. It works. But why it was not working? — Prabina, Jul 26 '19 at 07:32
Can I ask you other question if I stuck in a problem?@Priyank — Prabina, Jul 26 '19 at 07:33
When you make ajax request with jason data you have to add data type because of that it's not working and don't forgot to upvote my answer..:) — Priyank, Jul 26 '19 at 07:34

Priyank · Accepted Answer · 2019-07-26T07:41:18.043

1

First of all remove or comment $("#applicant_salutation").val(res.ho_salutation) and $("#applicant_district").val(res.ho_citizenship_district) line in from your javascript code bcoz both id is not available in your html.

Also add dataType: 'json' in you ajax request

As i have checked applicant_wardno is select box and you have to set selected for displaying value in the select box instead of setting val.

check this link for setting selected value

edited Jul 26 '19 at 07:41

answered Jul 26 '19 at 06:31

Priyank

470
2
11

I need your help.@Priyank – Prabina Aug 17 '19 at 09:39
@Prabina,Please let me know what you need from my side – Priyank Aug 19 '19 at 05:39
I will try again and if I couldnot do , I will post a question and tag you the link. @Priyank – Prabina Aug 19 '19 at 09:43
https://stackoverflow.com/questions/57572297/unable-to-get-login-user-information-in-multiple-php-pages @Priyank – Prabina Aug 20 '19 at 11:11

Thomas VIEIRA · Answer 2 · 2019-07-27T02:47:36.730

0

You can debbug with an alert: alert(res.ho_wardno); and see if the value is being returned from the ajax query;

      $("#applicant_wardno").val(res.ho_wardno);
      alert(res.ho_wardno);
      $("#applicant_citizenship_no").val(res.ho_citizenship_number);
      $("#applicant_phone").val(res.ho_phone);

edited Jul 27 '19 at 02:47

answered Jul 26 '19 at 06:29

Thomas VIEIRA

1
2

I need your help . https://stackoverflow.com/questions/57619673/unable-to-dynamically-add-multiple-input-fields-and-submit-to-database-with-java @shrys – Prabina Aug 23 '19 at 03:53

Unable to fill the other fields on the basis of option selected

2 Answers2

Linked