jquery-pjax
jquery-pjax copied to clipboard
Textarea and select value isn't preserved when going back/forward
- Have a page with
textareaand/orselectelement - Manualy change the value
- Go back and forward (using PJAX)
- As the content is loaded from PJAX cache, the manual changes are lost.
Input element works correctly, probably because its value doesn't depend on other DOM nodes.
The solution I found is to set each textarea value as its contents before cloning.
For select it's similar, just with the 'selected' attribute.
function cloneContents(container) {
// Preserve textarea values
var textarea = findAll(container, "textarea");
textarea.text(function(i, text){return textarea[i].value});
// Preserve select values
findAll(container, "select").each(function(i, elem){
elem = $(elem);
var values = $(elem).val();
elem.find('option[selected]').attr('selected', false);
elem.find('option').filter(function(){
return ($.inArray(this.value, values) !== -1);
}).attr('selected', true);
});
var cloned = container.clone()
//...
:+1: thanks for the answer. This should be documented more in the README. That some elements' states are not preserved such as <select>.
It would be better if have an out of the box solution as this behavior is expected to just work.
+1