Linked Questions

Popular Questions

In the expamle given, if we submit a form without selecting any value, then there will be error message, and after that when we will move to next page and comes to previous page then there is still an error message showing, how can we resolve that?

HTML

<div data-role="page" id="index">
    <div data-theme="a" data-role="header">
        <h3>
            First Page
        </h3>
        <a href="#second" class="ui-btn-right">Next</a>
    </div>

    <div data-role="content">
        <form id="form1" action="">
            <select id="select_list" name="select_list">
                    <option value="default">Choose...</option>
                    <option value="1">1</option>
                    <option value="2">2</option>
            </select>
            <input type="submit" id="submit" value="Submit" />
        </form>
    </div>

    <div data-theme="a" data-role="footer" data-position="fixed">

    </div>
</div>
<div data-role="page" id="second">
    <div data-theme="a" data-role="header">
        <a href="#index" class="ui-btn-left">Back</a>            
        <h3>
            Second Page
        </h3>
    </div>

    <div data-role="content">

    </div>

    <div data-theme="a" data-role="footer" data-position="fixed">

    </div>
</div>

JavaScript

$('#index').live('pageshow', function(e, data) {
  $.validator.addMethod("valueNotEquals", function(value, element, arg) {
    return arg != value;
  }, "");

  $("#form1").validate({
    rules: {
      select_list: {
        valueNotEquals: "default"
      },
    },
    messages: {
      select_list: {
        valueNotEquals: "You must select a value"
      }
    },
    submitHandler: function(form) {
      alert($('#form1').valid());
      form.submit();
    }
  });
});

Related Questions