Develop Reference

Want to take a radio and checkbox value from one form to another

I have values from one form that need to be transferred to another.
var manager = $('input[type=checkbox]:checked').val();
I'm capturing the value with this. and trying to send it to this.
$('input[type=checkbox]:checked').val(manager);
but I don't know what to put into the next set of jquery to transfer it over.
.val() works for strings/numbers but not checkboxes or radio buttons which I am trying to do.
Please advice.

Try jQuery prop() function to transfer the state of one checkbox to another.
Also use correct selectors. $('input[type=checkbox]:checked') will only select CHECKED checkboxes.
see this fiddle for an example: https://jsfiddle.net/iPirat/p5f07br4/
in this fiddle, the checkbox in the first form is selected similarly to what you did.
the checkbox insecond form is selected using an ID.

Checkbox initialization (Materialize)

I have a empty page where i dinamically add the element, i'm tryng to use materialize and i have a graphic problem...
I have follow the different tutorial on "http://materializecss.com/" to add the element with the correct method, but i have a problem with checkbox...
If i add the checkbox directly on the HTML page i have some graphic effect on checking and unchecking checkbox, but i must add it with javascript/jquery (dinamically) and i lost the graphic error.
On the website there is some initialization function to solve similar problem, but there isn't a initialization function for checkbox...
Someone say how to manually initialize checkbox with Materialize?
ty!
edit:
i have id and for on my checkbox...
sorry gor difficult code but it it's everithing dinamically added...

You have to have <span> right after your checkbox. Thing is that all magic about creating nice checkbox happens inside of span rather than input itself.
So here is minimal structure of HTML to get fancy checkbox in Materialize
<input type="checkbox" />
<span></span>

When you add them dynamically, do you also add the for attribute in the label for the checkbox? Per Materialize's documentation for Checkboxes:
The for attribute is necessary to bind our custom checkbox with the input. Add the input's id as the value of the for attribute of the label.
An ID should be unique within a page.

jQuery unchecking and reselecting checkbox programmatically

I have a bootstrap modal with a form inside, This means I require to programmatically set check boxes. When I attempt to programmatically select, deselect then reselect the checkbox the reselection doesn't get made.
Whenever I call .attr('checked', false); the following .attr('checked', true) doesn't seem to make changes.
How can I check the checkbox after it been unchecked?
HTML
<input value="None" name="hazards[]" id="hazard1" type="checkbox">
jQuery
$('#hazard1').attr('checked', true); //automated input check
$('#hazard1').attr('checked', false); //User cancels form and unchecks input
$('#hazard1').attr('checked', true); //Reopens form, but doesnt get checked

Thanks to Stryner for poinitng out this quick solution for something I have overlooked.
The solution is to simply replace the .attr() with .prop(). This is an updated syntax that replaces the .attr. Unlike the 'attribute' providing just a string, the 'property' provides more infomation on its property type allowing the use of bools (which are needed for checkboxes).
.prop() vs .attr()

Making Chosen Dropdown Read only (not disabled)

I'm looking to make a chosen dropdown menu read only, and I need to do this dynamically using a jQuery selector. If I set it to disabled using:
$("#dropdownDepartment").attr("disabled","disabled").trigger('chosen:updated');
the value isn't POSTed but I need it to be.
I have tried
$("#dropdownDepartment").attr('readonly',true).trigger('chosen:updated');
but this doesn't work.
I'm using Chosen v1.4.2 and jQuery v2.1.4.
Help appreciated! Thank you.

The best solution for me was such an ugly trick $("#dropdownDepartment").prop('disabled',true).trigger('chosen:updated').prop('disabled',false).
So chosen is disabled but value from select is POSTed.

There are a few options you could do.
Disable the drop down and store the value in a hidden field and send that in a POST.
Disable all the other selections so only the one selected is enabled
$('#dropdownDepartment option:not(:selected)').attr('disabled', true);
Disable the drop down and before you do a post enable it
When you want to disable it turn it into a read only textbox

try this:-
var select = $('select');
var oldVal=$('select').val();
select.chosen().on('change',function(e){
select.val(oldVal);
select.trigger("chosen:updated");
});
Demo

I have a workaround at the same. So hope it will help someone in the future (I guess you already did the solution).
First print the selected option value of the chosen select into a hidden input like the following. For $_POST value get the value from this hidden input $_POST['myselect']:
<input type="hidden" name="myselect" value="selected_option_value_goes_here" />
Then disable the chosen select. But it is safe to set the hidden input value to the current one before disable it:
$('input[name=myselect]').val($(".chosen-select").val());
$('.chosen-select').attr("disabled", true).trigger("chosen:updated");
N.B. If you don't want to disable it then just no need to update the value of the hidden input on change event of the chosen select.
A working demo can be found by clicking here.

I may be late to the party, but I came across the same issue as OP. The workaround I have found to post back the values even if they are disabled is to re-enable them when the form is submitted.
$("form").bind("submit", function () {
$("#TheList *").prop("disabled", false).trigger("chosen:updated");
});
Notice the [space][star] after TheList, it is to recursively re-enable each child in the list.

we can achieve the excepted behaviour by removing the pointer event on chosen-container div.
with this even if we dont enable the input its value will be posted with form submit
//to disable
$('.chosen').parent().find('.chosen-container').css({'pointer-events': 'none','opacity':0.5});
//to enable
$('.chosen').parent().find('.chosen-container').css({'pointer-events': '','opacity':1});

try this
$("#dropdownDepartment").attr('disabled', 'disabled');
$("#dropdownDepartment").data('chosen').search_field_disabled();
$("#dropdownDepartment").removeAttr('disabled');
$("#dropdownDepartment").trigger('chosen:updated');

How to change rendered selected option in select box with jquery

I have tried many ways to select an option with jquery including .val("0") .attr('selected', 'selected') and .attr('selected', 'true') and the TexoTela plugin. They all seem to update the html but the browser still shows the last item selected by the user.
Try out this fiddle... Select the dropdown value 1 and then click the link.
Is there any way to actually update the displayed value?

You mean change which item is selected?
$('select').val('0');
There are other ways, but this is the basic, following your example.
jsfiddle
You can read up on the documenation for .val() here, and the snippet:
checks, or selects, all the radio
buttons, checkboxes, and select
options that match the set of values.
EDIT for jQuery Mobile
For jQuery Mobile you also need to refresh the select as mentioned in the mobile docs:
If you manipulate a select via
JavaScript, you must call the refresh
method on it to update the visual
styling.
You can do this by:
$('select').selectmenu("refresh",true);

You're setting the option value to zero.
Set the select not the option val
$('select').val('0');
and you'll probably want to use an #id instead just a 'select' selector.

Still use your .val("0") to set the value, and to update in the browser you have to use one of the following:
.trigger("liszt:updated");
or
.trigger("chosen:updated");
Just one will work, depending on how you create your select.
It's gonna be like:
$("#Your_select").val('0');
$("#Your_select").trigger("liszt:updated");