get automatic value

krishna vala

7y998Web Development

how to get data-prefix value of drop down selected value in next textbox using javascript.

my code is below:

selected value is india is data-prefix code is 91 is automatically display in below textbox using javascript

3 Replies

Know the answer? Post it — somebody with the same question will find it here.

Rajeesh Menoth7y ago
Hi,

Try this code :

HTML :
Implemented onchaange in dropdown list.
<div class="form-group">
  <div class="prefix-inner">
    <div class="form-group">
      <select id="foo" onchange="getVal()" class="form-control countryData countrySelect" required="">
<option data-prefix="91" value="IN">Indiaoption>
<option data-prefix="62" value="ID">Indonesiaoption>
select>
    div>
    <div class="form-group row">
      <div class="col-xs-4">
        <input id="leave" type="text" name="mob" class="form-control PhonePrefix text-center prefixCountrySel" placeholder="+000">


      div>
Javascript :
The onchage method "getVal" will trigger while selecting each value from dropdown list.
function getVal() {
          var dropId = document.getElementById("foo");

          var selectedValue = dropId.options[dropId.selectedIndex].getAttribute('data-prefix');
          document.getElementById("leave").value = selectedValue;
        }
Demo :
http://jsfiddle.net/sp6dQ/511/

NB : Accept if answer is correct !!
+1
Mukesh Nayak7y ago
Hi Krishna,
>
<html>
<head>
    <title>title>
    <script src="Scripts/jquery-3.3.1.min.js">script>
    <meta charset="utf-8" />
head>

<body>
    <div class="form-group">
        <div class="prefix-inner">
            <div class="form-group">
                <select class="form-control countryData countrySelect" required="" disabled="">
                    <option data-prefix="91" selected="selected" value="IN">Indiaoption>
                    <option data-prefix="62" value="ID">Indonesiaoption>
                select>
            div>
            <div class="form-group row">
                <div class="col-xs-4">
                    <input type="text" class="form-control PhonePrefix text-center prefixCountrySel" placeholder="+000" disabled="">
                div>
            div>
        div>
    div>
    <script>
        (function () {
            var selOption = $(".countryData option:selected");
            $(".PhonePrefix").attr("placeholder", selOption.data("prefix"))
        })();
    script>
body>
html>
0
karthika pommudu7y ago
HI krishna vala...
Just try this I hope this one is your need...

https://stackoverflow.com/questions/10301507/change-textbox-value-when-an-item-is-selected-in-drop-down-box
0