Question posted in
You can find the official documentation here.

Not able to bind dropdownlist values coming from json values from databases in jquery – Jquery ajax

I want to bind control values based on the data from the database table. All the controls like textbox are getting bind except the dropdownlist values are not getting bind.

Below is my code

function BindDataTableToJSONProject(strVal) {

            var ProjectData = JSON.parse(strVal);

            var getJSONValue = ProjectData.Table[0];
            if (getJSONValue.PROJECT_MANAGER_NAME != "" && getJSONValue.PROJECT_MANAGER_NAME != null) {
                $('#ContentPlaceHolder1_ddlProjMan').val(getJSONValue.PROJECT_MANAGER_NAME);
            }
        }
    </script>
<select name="ctl00$ContentPlaceHolder1$ddlProjMan" id="ContentPlaceHolder1_ddlProjMan" class="form-control">
    <option value="0">--Select--</option>
    <option value="1">ABC</option>
    <option value="2">PQR</option>
    <option value="3">XYZ</option>
</select>

Below is my json data for the same.

{ID: 6, MST_ID: 107, PROJECT_NO: "R4G-25-APD-210", CR_NO: "R4G-25-APD-ACR-1212", APPLICATION_NAME: "Workflow for VSAT Application", PROJECT_MANAGER_NAME: "XYZ",  …}

Tags:

2

Answers


  1. 0

    You try to set value (that is 3) <option value="3">XYZ</option>

    but you select the parameter of the text getJSONValue.PROJECT_MANAGER_NAME == "XYZ"

    Login or Signup to reply.
  2. 0

    One way would be looping through options inside select tag and then checking if the .text() is equal to PROJECT_MANAGER_NAME if yes then add selected true to that option.

    Demo Code :

    var getJSONValue = {
  "ID": 6,
  "MST_ID": 107,
  "PROJECT_NO": "R4G-25-APD-210",
  "CR_NO": "R4G-25-APD-ACR-1212",
  "APPLICATION_NAME": "Workflow for VSAT Application",
  "PROJECT_MANAGER_NAME": "XYZ"
}
BindDataTableToJSONProject();

function BindDataTableToJSONProject() {
  if (getJSONValue.PROJECT_MANAGER_NAME != "" && getJSONValue.PROJECT_MANAGER_NAME != null) {
    //loop through option
    $('#ContentPlaceHolder1_ddlProjMan option').each(function() {
      //get text of option check if equal to pmn
      if ($(this).text() == getJSONValue.PROJECT_MANAGER_NAME) {
        $(this).prop("selected", true) //set slectd true
      }
    })

  }
}
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select name="ctl00$ContentPlaceHolder1$ddlProjMan" id="ContentPlaceHolder1_ddlProjMan" class="form-control">
  <option value="0">--Select--</option>
  <option value="1">ABC</option>
  <option value="2">PQR</option>
  <option value="3">XYZ</option>
</select>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search