Invert names of IDs in a form using Javascript -
i have following form:
<form id="currency" name="form" onsubmit="return redirect(this)"> <div style="clear:both;text-align: center;"> <select id="firstcurrency" class="selex" name="firstcurrency" style="float: left;"> <option value="usd">usd</option> <option value="btc">btc</option> </select> <span style="margin: 0 auto;">=</span> <select id="secondcurrency" class="selex" name="secondcurrency" style="float: right;"> <option value="btc">rrr</option> <option value="xvg">xvg</option> <option value="xrp">xrp</option> <option value="ntx">ntx</option> </select> <p style="clear: both;"></p> <p><input class="button" type="submit" value="redirect me" ></p> <a href="convertitore-home"><img src="/images/invert.png">invert select</a> </form>
when click on a
tag (outside form), want 2 things: 1) invert values of ids
, names
in 2 select
in form above 2) change float
values left right in first select
, right left in second select
.
after click on a
tag, form should become:
<form id="currency" name="form" onsubmit="return redirect(this)"> <div style="clear:both;text-align: center;"> <select id="secondcurrency" class="selex1" name="secondcurrency" style="float: right;"> <option value="usd">usd</option> <option value="btc">btc</option> </select> <span style="margin: 0 auto;">=</span> <select id="firstcurrency" class="selex2" name="firstcurrency" style="float: left;"> <option value="btc">rrr</option> <option value="xvg">xvg</option> <option value="xrp">xrp</option> <option value="ntx">ntx</option> </select> <p style="clear: both;"></p> <p><input class="button" type="submit" value="redirect me" ></p> <a href="convertitore-home"><img src="/images/invert.png">invert select</a> </form>
it should again each time press a
tag.
what javascript code use that?
add separate css currencies use :
$('#invert').click(function(){ var firstcurr = $('#firstcurrency'), secondcurr = $('#secondcurrency'), tmpid = secondcurr.attr('id'); secondcurr.attr('id',firstcurr.attr('id')); secondcurr.attr('name',firstcurr.attr('id')); firstcurr.attr('id',tmpid); firstcurr.attr('name',tmpid); });
#secondcurrency { float:right; } #firstcurrency { float:left; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form id="currency" name="form" onsubmit="return redirect(this)"> <div style="clear:both;text-align: center;"> <select id="firstcurrency" class="selex" name="firstcurrency"> <option value="usd">usd</option> <option value="btc">btc</option> </select> <span style="margin: 0 auto;">=</span> <select id="secondcurrency" class="selex" name="secondcurrency"> <option value="btc">rrr</option> <option value="xvg">xvg</option> <option value="xrp">xrp</option> <option value="ntx">ntx</option> </select> <p style="clear: both;"></p> </div> <p><input class="button" type="submit" value="redirect me" ></p> <a id="invert" href="javascript:void(0)"><!--href="convertitore-home"<img src="/images/invert.png">-->invert select</a>
Comments
Post a Comment