We Keep Coding

When radio button is checked redirect to second page and hide certain html element in the second page by checking if radio button was clicked

Here is my first page data in html
<div class="edu">
<input type="radio" name="edu" class="ug" value="ug" checked="checked">
<label class="radio-label">Undergraduate</label>
<input type="radio" name="edu" value="pg" class="pg">
<label class="radio-label">Postgraduate</label>
<input type="radio" name="edu" value="cu" class="cu">
<label class="radio-label">Continuing Education</label>
</div>
Here is my second page content:
<div class="display">
sample text
</div>
When the client check the "continuing education" radio button from the first page then the second page will be redirected/opened in a new window/new tab. An in second page I want to check if the "continuing education" button was clicked in the first page. If, then hide the ".display" div in the second page.
I want to use Jquery, and any other things in addition if needed.
Please guide me as I am new. Thanks.

Load jQuery from here at top of both first and second html file:
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
Add this jQuery code at the bottom of the first page:
<script>
$(document).ready(function(){
$(".cu").on("click", function(){
localStorage.setItem("cu","clicked");
//var key = localStorage.key(0);
//alert(key);
window.open('second.html', '_blank');
});
});
</script>
Then at the bottom of the second html page add this code. Which will check if localStorage value was set to "cu" thorough which you can understand "continuing education" were clicked or not. If, then it will hide the ".display" div.
<script>
$(document).ready(function(){
if(localStorage.key(0) == "cu")
{
//$(".display").fadeOut(500) ;
$(".display").hide(500) ;
//alert(localStorage.key(0));
localStorage.clear();
localStorage.removeItem("cu");
}
});
</script>

Jquery Mobile showing double form labels after form submit

This is my first time using jquery mobile... I have form items like this -
<label for="five_miles">5 Miles</label>
<input type="radio" name="distlim" value="5" id="five_miles">
As it says in the documentation, to label form elements, you must use a label tag and the for should = the id of that form item.
And it works fine. I load the page, the form elements are being generated and look good.
But after I submit the form back to the same page, it shows the form with the generated button elements with the label text inside the element but also it shows the text for the label above each form element again.
The code generated by jquery looks like this -
<div class="ui-radio">
<label for="yes" class="ui-btn ui-corner-all ui-radio-on ui-btn-inherit ui-btn-icon-left">Yes</label>
<input type="radio" name="transportation" class="transyes" id="yes" value="Yes" checked="">
</div>
<label for="yes">Yes</label>
I am thinking that maybe the dom is being loaded and the the jquery is loading afterwords and adding the other label element. Only happens after the form submit.
Tried putting my jscript files in the footer and in the header, and I tried putting the label above and below the form elements. ...not sure what else to do.
Thanks.

I overlooked in the docs that you have to wrap radio buttons and checkboxes with
<fieldset data-role="controlgroup"></fieldset>

How to change a jquery mobile radio button group with javascript code?

In jquery mobile, I want to change a radio group with javascript code. I have this:
<fieldset data-role="controlgroup" data-type="horizontal" data-mini="true">
<legend>Co-op Department:</legend>
<input name="coopdepartment" id="artssciRB" value="Arts & Science" checked="checked" type="radio">
<label for="artssciRB">Arts & Science</label>
<input name="coopdepartment" id="managementRB" value="Management" type="radio">
<label for="managementRB">Management</label>
<input name="coopdepartment" id="idsRB" value="IDS" type="radio">
<label for="idsRB">IDS</label>
</fieldset>
JS
var all = $("#profile-edit-form").find("input");
all.removeAttr("checked");
$("#profile-edit-form").find("input[value="+user['department_name']+"]").attr( "checked", "checked" );
all.checkboxradio( "refresh" );
but its not working... Does anyone know what is wrong? It is putting a checked attribute on the input tag though.
Thanks

.attr() refers to the HTML attribute in the actual markup. What you want to work with is not the HTML attribute but the DOM property of the element. You want .prop('checked') for this rather than .attr('checked').

Current checkbox state is not its attr, it's a prop.
all.prop("checked", false);
should work.

How to update popup selection text with JQueryMobile 1.4RC1?

I've previously used popups with JQueryMobile 1.3 and older without problem. With the new 1.4 RC1 I'm finding my popups don't update when I select a different item.
You can see an example here with JQueryMobile 1.3
http://jsfiddle.net/vinomarky/56hQ9/
And another here using JQueryMobile 1.4RC1 - identical code, but the select box no longer updates when different options are chosen;
http://jsfiddle.net/vinomarky/B9TqL/1/
Any ideas of what to try? the code is as follows;
Lognormal
<div data-role="popup" id="popupBasic16">
<div data-role="fieldcontain">
<fieldset data-role="controlgroup">
<input type="radio" name="updown" id="updown46" value="Lognormal" checked="checked" />
<label for="updown46">Lognormal</label>
<input type="radio" name="updown" id="updown47" value="Normal" />
<label for="updown47">Normal</label>
</fieldset>
</div>
</div>
And Javascript
$('select').selectmenu();
$('#updown46').click(function () {
$('#log_or_norm .ui-btn-text').html('Lognormal');
$('#popupBasic16-screen').click();
document.select_choices.log_or_norm.value = "Lognormal";
$('select').selectmenu('refresh');
});
$('#updown47').click(function () {
$('#log_or_norm .ui-btn-text').html('Normal');
$('#popupBasic16-screen').click();
document.select_choices.log_or_norm.value = "Normal";
$('select').selectmenu('refresh');
});

Two methods
$('#log_or_norm').text('Normal');
Another
$('#log_or_norm ').empty().append('Lognormal');
Fiddle
http://jsfiddle.net/B9TqL/3/

Your Javascript has some errors as document.select_choices is not defined. If you want to update the value of your button use jQuery:
$('#log_or_norm').text("Lognormal");
It seems that in jQuery 1.4 they changed the HTML structure of the buttons, that's why your code $('#log_or_norm .ui-btn-text').html('Lognormal'); doesn't work. Check the full page of changes here.
Demo here.

jQuery autoselect radiobox is not working

I cannot get my jquery code to auto select a radiobox.
Here is my html:
<div class="formField rsform-block rsform-block-existingcustomer" style="margin-bottom: -22px;">
<!--<input name="form[existingCustomer]" type="radio" value="Yes" id="existingCustomer0" /><label for="existingCustomer0">Yes</label><input checked="checked" name="form[existingCustomer]" type="radio" value="No" id="existingCustomer1" /><label for="existingCustomer1">No</label><br/>
<span id="component100" class="formNoError">Please tell us if you're an existing customer.</span>-->
Are you an existing client?<br>
<label for="existingCustomer0" class="radio"><span class="icon"></span><span class="icon-to-fade"></span>Yes
<input name="form[existingCustomer]" type="radio" value="Yes" id="existingCustomer0" class="addRadio">
</label>
<label for="existingCustomer1" class="radio checked"><span class="icon"></span><span class="icon-to-fade"></span>No
<input checked="checked" name="form[existingCustomer]" type="radio" value="No" id="existingCustomer1" class="addRadio" style="display:none;">
</label>
</div>
and here is a snippet of the jQuery code that is supposed to do it:
if(aaid) {
var num_one = aaid;
jQuery('input[value="Yes"]').prop('checked', true);
Does anyone see the problem? I am trying to autoselect the "yes" checkbox, so that it will activate the next part which is create a dropdown menu.
Thanks in advance! :)

Try this:
$(document).ready(function () {
$('input:radio[name="form[existingCustomer]"][value="Yes"]').attr('checked',true);
//OR
$('input:radio[name="form[existingCustomer]"][value="Yes"]').prop('checked',true);
});
Example

I see a couple issues with your code here.
1. input hmtl does not have proper ending/end tag
2. not sure why you wrap it around the label
3. Be sure to put your jquery code in document ready so that it checks the radiobox when the page is loaded.
4. in you html code, you are pre-setting the No radio to be checked. Is that on purpose? It looks like you set it to no and then using jquery to set it back to yes.
Anyway, try attr instead of prop. Something like this.
$('input:radio[value="Yes"]').attr('checked', true);