javascript - How to copy the state of a manually (un)checked checkbox? -


in other words, without triggering javascript events change attributes of <input>, how preserve state of checkbox manually checked or unchecked , copied place?

run snippet below , check or uncheck few of them , hit "copy":

$('#cp').click(function(){    $('#copy').html($('#original').html())    $('#copy-clone').html($('#original').clone().html())  })  $('#hi').click(function(){    $('#original input:checked').parent().css('border','2px solid red')  })
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <form id="original">    <label><input type="checkbox" name="man">man</label>    <label><input type="checkbox" name="woman">woman</label>    <label><input type="checkbox" name="monkey">monkey</label>    <label><input type="checkbox" name="banana" checked="checked">banana</label>  </form>  <button id="cp">copy</button>  <button id="hi">highlight</button>  <br><form id="copy"></form>  <br><form id="copy-clone"></form>

those or manually :checked correctly selected, states of manually changed ones never copied (run snippet, select few, hit "highlight" , "copy")...

use clone(true) deep copy element's data/state (docs).

edit per andreas' comment: html() call on clone unnecessary.

$('#cp').click(function(){    $('#copy').html($('#original').clone())    $('#copy-clone').html($('#original').clone())  })  $('#hi').click(function(){    $('#original input:checked').parent().css('border','2px solid red')  })
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <form id="original">    <label><input type="checkbox" name="man">man</label>    <label><input type="checkbox" name="woman">woman</label>    <label><input type="checkbox" name="monkey">monkey</label>    <label><input type="checkbox" name="banana" checked="checked">banana</label>  </form>  <button id="cp">copy</button>  <button id="hi">highlight</button>  <br><form id="copy"></form>  <br><form id="copy-clone"></form>


Comments

Popular posts from this blog

mysql - Dreamhost PyCharm Django Python 3 Launching a Site -

java - Sending SMS with SMSLib and Web Services -

java - How to resolve The method toString() in the type Object is not applicable for the arguments (InputStream) -