CODEWITHSUNDEEP
jqueryformsjsp
yaylitzis
yaylitzis

Reputation: 5544

Put a default value in a text input, when a select is selected

I have a form in my JSP where in a select option I show the elements of an array and next to this i have an input text:

<% ArrayList<Machine>  machinesList = (ArrayList<Machine>) (session.getAttribute("machinesList")); %>

<-- and later in the form -->

<select class="form-control" id="select" name="position1-1"> 
     <option value="0"></option>
     <%for(Machine m : machinesList){%>
          <option value="<%=m.getIdMachine()%>"><%=m.getIdMachine()%></option>
     <%}%>
</select>

<select class="form-control" id="select" name="position2-1"> 
         <option value="0"></option>
         <%for(Machine m : machinesList){%>
              <option value="<%=m.getIdMachine()%>"><%=m.getIdMachine()%></option>
         <%}%>
    </select>

<input type="text" class="form-control" id="inputName" name="name3-1">


<select class="form-control" id="select" name="position3-1"> 
         <option value="0"></option>
         <%for(Machine m : machinesList){%>
              <option value="<%=m.getIdMachine()%>"><%=m.getIdMachine()%></option>
         <%}%>
    </select>

I have also one more array nameList

<% ArrayList<String>  nameList= (ArrayList<String>) (session.getAttribute("machinesList")); %>

which has the names of the IDs. How can I make, when the user select an id then the text input gets automatically a default value from the list nameList? E.g I select the 1st value from select, then the text ipnut would have the 1st element from the nameList.

Upvotes: 0

Views: 197

Answers (1)

user2575725
user2575725

Reputation:

Edited:

You cannot have multiple attribute with same key within same scope, session. This is invalid the later set as attribute will override the old one.

<% ArrayList<Machine>  machinesList = (ArrayList<Machine>) (session.getAttribute("machinesList")); %>
<% ArrayList<String>  nameList = (ArrayList<String>) (session.getAttribute("machinesList")); %>

Assuming nameList of String type you need it in javascript variable, you can simply do this:

var names = ${nameList}; // ${}, is jsp's EL

or

var names = <%=nameList%>; //jsp expression scriplet

With jQuery on change event:

var names = ['Apple', 'Microsoft']; //${nameList}

$(function() {
  $('select[id^=select]').on('change keyup', function(e) {
    //make text blank if selected option is at 0 index else get the selected option value
    var i = this.selectedIndex;
    var txt = i ? names[i - 1] : '';
    $('#inputName' + this.id.replace(/\D/g,'')).val(txt);
  });
});

//this.id.replace(/\D/g,'') will replace other than digits
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<select id="select1">
  <option value="0">Select</option>
  <option value="Machine 1">Machine 1</option>
  <option value="Machine 2">Machine 2</option>
</select>

<input type="text" id="inputName1">
<br/>
<select id="select2">
  <option value="0">Select</option>
  <option value="Machine 1">Machine 1</option>
  <option value="Machine 2">Machine 2</option>
</select>

<input type="text" id="inputName2">
<br/>
<select id="select3">
  <option value="0">Select</option>
  <option value="Machine 1">Machine 1</option>
  <option value="Machine 2">Machine 2</option>
</select>

<input type="text" id="inputName3">
<br/>

Upvotes: 1

Related Questions