Question

I am confused as to why this code does not clear a form on success. I am using the form in a data-role=”collapsible” and it should work. Can someone tell me if I need to add anything else to enable this to reset after success call. Thanks

$(function() {

 $("#BRV_brtrv").submit(function() {

   var send = $(this).serialize();

    $.ajax({
      type: "POST",
      url: "boxrtrvajax.php",
      cache: false,
      data: send,
      success: function (data) {

      if (data == 'No data'){

       $('#brtv-result').addClass("result_msg").html('Please fill in all fields');
      }
      else
      {
      $('#brtv-result').addClass("result_msg").html("You have successfully retrieved: "+data);
      $("#BRV_brtrv").get(0).reset(); <-- this is the problem area -->

      }
     },
     error:function (xhr, ajaxOptions, thrownError){
      jAlert('There was an exception thrown somewhere');
      alert(xhr.status);
      alert(thrownError);
     }
   });
   return false;
  });
});

Full form and js here: http://jsfiddle.net/Pg4SV/

+++EDIT+++

Options tried

$(':input','#BRV_brtrv')
 .not(':button, :submit, :reset, :hidden')
 .val('')
 .removeAttr('checked')
 .removeAttr('selected');


$("input[type=range]").val(5).slider("refresh");
      $("input[type='checkbox']").attr("checked",false).checkboxradio("refresh");
      $("input[type='radio']").attr("checked",false).checkboxradio("refresh");
      $('#BRV-brtrv-department').selectmenu('refresh');

$(':input,:select', '#BRV_brtrv').removeAttr('checked').removeAttr('selected');

document.getElementById('BRV_brtrv').reset();

$('#BRV_brtrv').get(0).reset();

Form

<form method="post" id="BRV_brtrv" action="">

<div data-role="fieldcontain">
 <label for="BRV_brtrvrb">Requested By *</label>
 <input type="text" name="BRV_brtrvrb" id="BRV_brtrvrb" value="<?php echo $_SESSION['name']; ?>" />
</div>

<div data-role="fieldcontain">
 <fieldset data-role="controlgroup" data-type="horizontal">
  <legend>Service Type *</legend>
   <input type="radio" name="BRV-id-service-type" id="BRV-brtrv-standard-service" value="standard" />
   <label for="BRV-brtrv-standard-service">Standard</label>
   <input type="radio" name="BRV-id-service-type" id="BRV-brtrv-rapid-service" value="rapid" />
   <label for="BRV-brtrv-rapid-service">Rapid</label>
  </fieldset>
</div>

<div data-role="fieldcontain">
   <label for="BRV-brtrv-department">Department *</label>
    <select name="BRV-brtrv-department" id="BRV-brtrv-department" class="select" data-inline="true" data-native-menu="false">
     <option>Choose Department</option>
      <?php
        while($row = mysql_fetch_array( $BRVdept_result ))
    {
        $value=$row['name'];
        $caption=$row['name'];
        echo "<option value=\"", $value, "\">", $caption, "</option>";
        }
    ?>
     </select>
</div>

<div data-role="fieldcontain">
   <label for="BRV-brtrv-address">Address *</label>
    <select name="BRV-brtrv-address" id="BRV-brtrv-address" class="select" data-inline="true" data-native-menu="false">
     <option>Choose Address</option>
      <?php
        while($row = mysql_fetch_array( $BRVaddr_result ))
        {
        $value=$row['address1_com']. " ". $row['address2_com']. " ". $row['address3_com']. " ". $row['town_com']. " ". $row['postcode_com'];
        $caption=$row['address1_com']. " ". $row['address2_com']. " ". $row['address3_com']. " ". $row['town_com']. " ". $row['postcode_com'];
        echo "<option value=\"", $value, "\">", $caption, "</option>";
        }
        ?>
    </select>
</div>

<div data-role="fieldcontain">
   <label for="BRV-brtrv-slider">No of Boxes *</label>
     <input type="range" name="BRV-brtrv-slider" id="BRV-brtrv-slider" data-track-theme="a" value="0" min="0" max="10" />
</div>

<div id="BRVbrtrv_boxnumber" data-theme="b"></div>

<div id="brtv-result"></div>
<div id="BRV-brtrv-submitDiv" data-role="fieldcontain">
     <input name="BRV-brtrv-submit" id="BRV-brtrv-submit" type="submit" value="Retrieve Box" data-inline="true" />
</div>
</form>

Answer 1

You might have an element in the form with id or name being reset. You will need to rename the element’s id or name to something else.