?
Solved

jquery mobile reset not clearing form

Posted on 2011-09-03
6
Medium Priority
?
940 Views
Last Modified: 2012-06-27
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;
  });
});

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>

+++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();

Open in new window

0
Comment
Question by:peter_coop
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 3
6 Comments
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 36477642
Why not
 $("#BRV_brtrv")[0].reset();
?
0
 

Author Comment

by:peter_coop
ID: 36477713
@mplungian
hi. Still doesn't work. Should this be in a ajax complete? thanks
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 36477730
It should replace the .get(0).reset() you had in your success. Does it work on a pc?
0
Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

 

Author Comment

by:peter_coop
ID: 36477763
no. but in ordinary jquery it is fine. Just in JQM
0
 
LVL 75

Accepted Solution

by:
Michel Plungjan earned 1000 total points
ID: 36478241
I do not recognise your usage of data-role.

Try this

http://stackoverflow.com/questions/680241/blank-out-a-form-with-jquery

// Use a whitelist of fields to minimize unintended side effects.
$(':text, :password, :file, SELECT', '#myFormId').val('');  
// De-select any checkboxes, radios and drop-down menus
$(':input', '#myFormId').removeAttr('checked').removeAttr('selected');
0
 

Author Closing Comment

by:peter_coop
ID: 36478267
thank you. if you get a chance, could you checkout this question I have raised. totally stumping me why it is not working. thanks

http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_27290128.html
0

Featured Post

Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses how to create an extensible mechanism for linked drop downs.
This article discusses how to implement server side field validation and display customized error messages to the client.
Learn how to match and substitute tagged data using PHP regular expressions. Demonstrated on Windows 7, but also applies to other operating systems. Demonstrated technique applies to PHP (all versions) and Firefox, but very similar techniques will w…
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…
Suggested Courses

719 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question