I am using jquery to display div upon selection which is store to database
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery("input[name$='advert_specifications[link_type]']").click(function(){
var radio_value = jQuery(this).val();
if(radio_value=='advert_page') {
jQuery("#urlbox").hide('fast');
}
else if(radio_value=='external_link') {
jQuery("#urlbox").show('fast');
}
});
jQuery("#urlbox").hide();
});
</script>
<div class="my_meta_control">
<!--[advert link type group]-->
<div class="left side clearfix">
<label class="left sub_label"><input type="radio" value="advert_page" name="advert_specifications[link_type]"> Page Link</label>
<label class="left sub_label"><input type="radio" checked="checked" value="external_link" name="advert_specifications[link_type]"> External Link</label>
</div>
<!--[end of advert link type group]-->
<div id="urlbox" style="display: none;">
<p class="sidebox clearform">
<label>Advert External Link</label>
<input type="text" class="mydatepicker" value="" name="advert_specifications[advert_url]" id="advertdate">
</p>
</div>
</div>
It is working fine on click function but once I select external link radio and save to db than re open the post than #urlbox is always hide where it should be visible if external link radio button selected.
EDIT:
I tried this code and it does the same thing hiding # + test
div on load
jQuery(document).ready(function() {
jQuery("div.links").hide();
jQuery("input[name$='advert_specifications[link_type]']").click(function() {
var test = jQuery(this).val();
jQuery("div.links").hide();
jQuery("#" + test).show();
});
});
As per my understing in you main script you are hiding the main block. Although its not needed because you are alreadying saying display none in your markup.
Please check the jsfiddle link
DEMO
it will be always hide because you have written the code to hide the box (#urlbox) in second last line in script tag. Which will always execute when page loads.