Why does this code not work

[filch]

I am still learning jquery but I am wondering why this code does not work. I have a select field called item_name and a hidden field called amount. Based on the selection in item_name, I want to set the value of the hidden field (amount) to a set value. For example:

$(document).ready(function () {
$('#item_name').change(function () {
	var value = $('#item_name').val();
	if(value == "institutional memberhip"){
		$("#amount").val("$349.00");
        } elseif(value == "individual membership") {
                $("#amount").val("$40.00");
        } else { 
                $("#amount").val("$99.00");
	}
    });
});

What stupidity have I committed here that this does not work?

Dave

[hielo]

elseif should be

else if

(you need a space in between).

Also, in your HTML, your <OPTION> tags need to have those values as well and don't forget that js is case sensitive:

<option value="institutional memberhip">Institutional Memberhip</option>
<option value="individual membership">Individual Membership</option>

[filch]

Humm ... well, i made the changes and amount does get updated but only to the last value available in the select list. So, for example:

I have this code:

$(document).ready(function () {
$('#item_name').change(function () {
	var value = $('#item_name').val();
	if(value == "institutional memberhip"){
		$("#amount").val("349.00");
	} else if(value == "associate memberhip"){
		$("#amount").val("99.00");
	} else {
		$("#amount").val("37.45");
	}
  });
});

and I have the following html:

<label for="item_name">choose membership type: <span class="alert">*</span></label>
            <select name="item_name" id="item_name">
              <option selected="selected">Choose Membership Level</option>
              <option value="institutional membership">Institution</option>
              <option value="associate membership">Associate</option>
              <option value="individual membership">Individual</option>
            </select>
            <input name="amount" type="hidden" id="amount" />

When I submit this, the value for amount is always: $37.45. See anything I missed?

[Taywin]

You should check what value is actually returned from 'item_name.val()'. Alert it to see what actually is returned? (add alert(value) right after line 3 in your javascript code.) The reason is that it looks like your if-else statement is always false; as a result, it returns only else.

[hielo]

try changing: var value = $('#item_name').val(); to: var value = $('option:selected',this).attr('value');

[filch]

This is what I ended up using which seems to work fine. See any down side to this code?

$(function() {
	$('#item_name').change(function() {
		var x = $(this).val();
		if (x == "institutional membership") {
			$('#amount').val(390.00);
		} else if (x == "associate membership") {
			$('#amount').val(50.00);
		} else {
			$('#amount').val(37.45);
		}
	});
});

Dave

[Taywin]

Don't seem to have any problem in my opinion. The this refers to $('#item_name') anyway.

[hielo]

What you have now is fine. Also, regarding:

Humm ... well, i made the changes and amount does get updated but only to the last value available in the select list. So, for example:

$(document).ready(function () {
$('#item_name').change(function () {
	var value = $('#item_name').val();
	if(value == "institutional memberhip"){
		$("#amount").val("349.00");
	} else if(value == "associate memberhip"){
		$("#amount").val("99.00");
	} else {
		$("#amount").val("37.45");
	}
  });
});

The problem with that code is that you misspelled membership in you if clauses. Otherwise it would also work.