Modify value of a HTML-select element using AJAX [closed]

Question

In my page there will be 2 select box [item, and sub-item]

<select id="item" name="item">
 <option value="1">Desktop</option>
 <option value="2">Laptop</option>
</select>


<select id="sub_item" name="sub_item">
</select>

When ever the user changes the item select-control, an event will send the selected-value to the server using jQuery and the server page will output something like this

DELL,39000
HP,32000

And the jQuery should add those values to the sub-item select box so it changes to

<select id="sub_item" name="sub_item">
 <option value="39000">Dell</option>
 <option value="32000">HP</option>
</select>

Problem: I can't code how to add/reset the select control for the sub-item

I don't have any code to share. If you want my SQL or JAVA code I can post it, but I think the backend has nothing to do with the jQuery modifying the sub-item's value

I don't exactly understand your question. Do you just want to add the items to the sub_item select box? — Hanlet Escaño
– Hanlet Escaño, Commented Aug 23, 2012 at 6:12
you may find your solution stackoverflow.com/questions/11817641/… , stackoverflow.com/questions/5686735/… , stackoverflow.com/questions/12067192/… — 000
– 000, Commented Aug 23, 2012 at 6:23
then you may also check stackoverflow.com/questions/11660621/… , stackoverflow.com/questions/11777454/… , stackoverflow.com/questions/6652487/… , stackoverflow.com/questions/7803381/…. Also please search thoroughly before posting.. — 000
– 000, Commented Aug 23, 2012 at 6:35

Jan Sverre · Accepted Answer · 2012-08-23 06:19:28Z

1

$.get('URL',function(data){
  //data should be DELL,39000 osv
  var items = data.split("\n");
  items.forEach(function(item){
    item = item.split(',');
    var option = $("<option></option>").text(item[0]).val(item[1]);
    $("sub_item").append(option);
  });
});

Change 'URL' to your url.

Not tested, but should work.

answered Aug 23, 2012 at 6:19

Jan Sverre

4,7831 gold badge26 silver badges28 bronze badges

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

Comments

madhairsilence · Accepted Answer · 2012-08-23 06:15:46Z

1

assuming this as input, just a plain string

Your server will respond with the string DELL,39000 # HP,32000 ( Here # represents the second item. )

assign it to a variable in javascript

var data = response.split( "#"); // Splits the items

for( i=0; i < data.length; i++){
  $('#sub_item').append( '<option value='+data[i].split(",")[0]+'>'+data[i].split(",")[1]+'</option>');
}

This will append the data to the sub_item select box with the response from the Server

To clear the droddown

$'#sub_item').html('');

answered Aug 23, 2012 at 6:15

madhairsilence

3,8904 gold badges42 silver badges83 bronze badges

Collectives™ on Stack Overflow

Modify value of a HTML-select element using AJAX [closed]

2 Answers 2

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Linked

Related