Reset form except one input enclosed in DIV

I'm using this to reset a form when a visitor refreshes the page:

$(document).ready(function () {
  resetForms();
});
function resetForms() {
  document.getElementById('configurator-form').reset();
}

Inputs are radio, select, text. There is one input within (div class="snap") that I need to exclude from the reset. How can I do this?

Can I use:

.not('.snap input')

Somewhere? I guess to do this I would need to target the inputs and not the whole form? Fields have default values, so I don't think I want to use 'removeAttr', though I could be wrong?

EDIT

I know it's similar to another question, but I cannot get the accepted answer to work. It's suggested that the form value be taken, then the form is reset, then the value is put back into the form. I've tried with this:

$(window).load(function() {
  var snap = $(".snap input").val();
  resetForms();
  $(".snap input").val(snap);
});
function resetForms() {
  document.getElementById('configurator-form').reset(); 
}

...But it hasn't restored the value of the ".snap input" field. It's worth noting that the snap field has a random name and ID, so I can't use getElementById for example. Thanks for your patience, as you can probably tell I'm new to JQuery.

EDIT 2

Ok, resetForms was throwing an error "not defined". This version seems to work perfectly:

$(document).ready(function(){
  var snap = $(".snap").html();
  $('#configurator-form')[0].reset();
  $(".snap").html(snap);
});

Answers:

Answer

You're approach should work.

The only mistake you have is the selector,

Your JS should look like this: (without the white space in the selector)

function resetForms() {
var value = $("input.snap").val();
  document.getElementById('configurator-form').reset();
   $("input.snap").val(value);
}

working fiddle

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.