I have a little problem with my script.
The goal: I have a select
with a few options and if you choose option with value '4' select will remove and in this place I need insert input[type=text] and word "remove" in span tags. And now when you click at this span, previously inserted input and span will remove and in this place I need place my previously removed select
I hope it's make sense :-)
here my html code inside form with id=f9:
<label class="mandatory" for="ctrl_54">Title</label>
<select class="select mandatory" id="ctrl_54" name="title">
<option value="1">Books</option>
<option value="2">Movies</option>
<option value="3">Events</option>
<option value="4">other...</option>
</select>
and my js:
function be_forms() {
var myselect = $('form#f9 select#ctrl_54');
if ($('form#f9').length) {
$('form#f9 select#ctrl_54').change(function() {
if ($(this).val() == 4) {
$('form#f9 select#ctrl_54').remove();
$('<input type="text" value="" class="text innyinput mandatory" id="ctrl_54" name="title" /><span class="remove">remove</span>').insertAfter('form#f9 label[for=ctrl_54]');
$("form#f9 span.remove").click(function(){
$('form#f9 input#ctrl_54').remove();
$('form#f9 span.remove').remove();
$(myselect).insertAfter('form#f9 label[for=ctrl_54]');
});
}
});
}
}
And now almost everythings works. I mean when I choose option with value 4 - select is remove and appear input and span. When I click at this span my select appear again and input and span are removed. But now if I choose again in my select option with value 4 - nothing happens. And I want do it again - remove select, insert input and span and so on...
Sorry for my english I not native speaker.
As of jQuery 1.7, the .live()
method is deprecated. Use .on()
to attach event handlers. Users of older versions of jQuery should use .delegate()
in preference to .live()
.
http://api.jquery.com/live/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With