How to get a PHP array index converted to a javascript variable

Question

I'm getting a set of user roles from the database using PHP and they are put in a <select> tag's <option>s as follows:

<div class="col-md-3">
    <select name="role" id="user_role" class="form-control" onkeyup="clearMsg('roleerr')" onchange="getRole()"/>
        <option value="">Select a Role</option>
        <?php while($rowrole = $resultrole->fetch(PDO::FETCH_BOTH)) { ?>
        <option value="<?php echo $rowrole ['role_id']; ?>">
        <?php echo $rowrole ['role_name']; ?>
        </option>
        <?php } ?>
    </select>
    <span id="roleerr" class="error">*</span>
</div>

And I want to get the selected value of the dropdown 'onchange' and for that getRole() javascript function is written. How to get this done?

dandemo · Accepted Answer · 2020-09-27 04:14:33Z

1

When the element changes, the value of the dropdown will be set to the value attributed to the selected option. So you would just define your javascript function and have it fetch the value of the dropdown:

function getRole(){
   var finalVal = document.getElementById("user_role").value;
   // And then here you can do whatever you want with the information
}

answered Sep 27, 2020 at 4:14

dandemo

3971 silver badge5 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Madhumi Munasinghe Over a year ago

This doesn't work....I think the value can't be accessed as var finalVal = document.getElementById("user_role").value; because it's a php array index <option value="<?php echo $rowrole ['role_id']; ?>"> Please help me

Jerson · Accepted Answer · 2020-09-27 06:00:30Z

0

You can assign value in paramater in onchange()

this should work below

function getRole(value) {
  if(value != "")
     alert(value)
 }

<div class="col-md-3">
    <select name="role" id="user_role" class="form-control" onchange="getRole(this.value)"/>
        <option value="">Select a Role</option>
        <option value="23">select 23</option>
        <option value="24">select 24</option>
        <option value="25">select 25</option>
    </select>
    <span id="roleerr" class="error">*</span>
</div>

answered Sep 27, 2020 at 6:00

Jerson

1,7752 gold badges12 silver badges15 bronze badges

Comments

Thân LƯƠNG Đình · Accepted Answer · 2020-09-27 12:55:14Z

0

You could try event of onchange.

onchange="getRole(event)"

Javascript.

function getRole(event) {
    var selectElement = event.target;
    var value = selectElement.value;
    alert(value);
}

I tested it with hard data.

function getRole(event) {
    var selectElement = event.target;
    var value = selectElement.value;
    alert(value);
}

<div class="col-md-3">
    <select name="role" id="user_role" class="form-control" onchange="getRole(event)"/>
        <option value="">Select a Role</option>
        <option value="1">admin</option>
        <option value="2">user</option>
        <option value="3">support</option>
    </select>
    <span id="roleerr" class="error">*</span>
</div>

answered Sep 27, 2020 at 12:55

Thân LƯƠNG Đình

3,2402 gold badges14 silver badges22 bronze badges

Collectives™ on Stack Overflow

How to get a PHP array index converted to a javascript variable

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related