jquery - Dynamically change ID on textboxes depending on select value MVC -
i have textboxes , select tag looking this:
<select id="calcoption" name="calcoption"> <option value="pmt" id="pmt" name="pmt">payment (pmt)</option> <option value="i" id="i" name="i">interest (i)</option> <option value="fv" id="fv" name="fv">future value (fv)</option> <option value="pv" id="pv" name="pv">present value (pv)</option> </select> @html.label("present value (pv)", new { id = "pvlabel" }) @html.textbox("presentvalue") @html.label("future value", new { id = "fvlabel" }) @html.textbox("futurevalue") @html.label("interest rate", new { id = "intratelabel" }) @html.textbox("interestrate")
and depending on value choosed in select tag want id , label change this:
$(document).on('change', '#calcoption', function () { var selected = $('#calcoption option:selected').attr('id'); switch (selected) { case 'i': $('#intratelabel').text("payment (pmt)"); $('#fvlabel').text("future value (fv)"); $('#pvlabel').text("present value (pv)"); $('#interestrate').attr({ id: 'pmt', name: 'pmt' }); break; case 'pv': $('#intratelabel').text("interest rate"); $('#pvlabel').text("payment (pmt)"); $('#fvlabel').text("future value (fv)"); $('#presentvalue').attr({ id: 'pmt', name: 'pmt' }); break; case 'fv': $('#intratelabel').text("interest rate"); $('#fvlabel').text("payment (pmt)"); $('#pvlabel').text("present value (pv)"); $('#futurevalue').attr({ id: 'pmt', name: 'pmt' }); break; case 'pmt': $('#intratelabel').text("interest rate"); $('#fvlabel').text("future value (fv)"); $('#pvlabel').text("present value (pv)"); $('#interestrate').attr({ id: 'interestrate', name: 'interestrate' }); break; } });
the problem have when switch between values more times don't change back. if take value id interestrate changes pmt. if change value pv, want id interestrate come pmt was. if click around in select tag id's pmt , need refresh page id's back. them change change value. how do that?
first need set id atribute sintaxe:
@html.label("interest rate", new { @id = "intratelabel" })
now. suggest change atribute manipulation class instead id each elemment
@html.textbox("interestrate", new{ @class = "payment" })
edit code to:
$(document).on('change', '#calcoption', function () { var selected = $('#calcoption option:selected').attr('id'); switch (selected) { case 'i': $('.payment').attr({ id: 'pmt', name: 'pmt' });
Comments
Post a Comment