Matt,
You litteraly used the custom validation rule that I gave just for
example, it was to follow that line, but that method it's to verify if
that field it's greater than a number, used for minAge.
so when I put:
rules: {
minAge: 18
}
If you analyze, they return if the value it's greater that you passed
at "return this.optional(element) || value > params;"
I made this for you understand how works and not to make the whole
code, before this parte you have to implement like Mac made, but still
not right, I thing the follow code should work but I didint tested:
* Mac, you start to implement but you use a given id in a given radio,
the custom method receive the value of the field, you don't need to
tie in a given id, it can be general like below
jQuery.validator.addMethod("correctAnswer", function(value, element,
params) {
return this.optional(element) || value == params;
}, "Select the correct answer to move on.");
So you can make:
$("quiz_form").validate({
rules: {
correctAnswer: 1
}
});
And the method will check if the value selected in radio is the same
that the parameter you pass, this case 1
I hope this should help and work for you
They return if the field it's greater in the syntax
On 29 jun, 00:03, Mac <amcint...@bigmate.com.au> wrote:
> Heya Matt
>
> Looks like you have created the custom method for the validation, but
> you are not calling it anywhere. You are still setting the validation
> method to be the default "required".
> You need to add the method as a class to the element (as you did
> originally) or specify it as a rule in the $.ready() call to validate
> ().
>
> I'm also not entirely sure that your custom method will produce the
> results you expect (haven't tested it).
> If you struggle with that - try the following:
>
> jQuery.validator.addMethod("correctAnswer", function(value, element,
> params) {
>
> var radioValue = $("#main").find("input[type='radio']").val(); //
> returns the selected value from the radio button group
> return this.optional(element) || value > params;
>
> }, "Select the correct answer to move on.");
>
> In order to provide a value for params you need to call the method in
> the following manner:
>
> <input class="{correctAnswer:'1'}" type="radio" id="answer1"
> value="1" name="answers" /> (if you want the radio with a value of 1
> to be the valid answer)
>
> or
> $("quiz_form").validate({
> rules: {
> correctAnswer:'1'
>
> }
> });
>
> Hope that helps a little!!! Anyone reading your code will be able to
> descern the correct answer though. Are you able to make ajax calls to
> the server? The validate plugin provides a remote method that you pass
> a php.asp url and return true/false to validate. That would be far
> better.
>
> On Jun 27, 6:09 am, Matt Riley <mattrileyiph...@gmail.com> wrote:
>
> > Alexandre, this sounds like it would do pretty much what I need. I
> > followed your post but I can't seem to get it working. Can you look at
> > the code below and tell me where I've gone wrong? Sorry to ask for all
> > the help but I think I'm kind of close and I just want to get it
> > done! :-)
>
> > <script type="text/javascript">
> > jQuery.validator.addMethod("correctAnswer", function(value, element,
> > params) {
> > return this.optional(element) || value > params;
>
> > }, "Select the correct answer to move on.");
>
> > $.validator.setDefaults({
> > submitHandler: function() {
> > alert("Go to next question.");
>
> > }
> > });
>
> > $.metadata.setType("attr", "validate");
>
> > $(document).ready(function() {
> > $("quiz_form").validate({
> > rules: {
> > answer1: "required"
>
> > }
> > });
> > });
>
> > </script>
> > </head>
> > <body>
> > <div id="main">
> > <form class="cmxform" id="quiz_form" method="get" action="">
> > <fieldset>
> > <fieldset>
> > <label for="answer1">
> > <input type="radio" id="answer1"
> > value="1" name="answers" />
> > Answer 1
> > </label>
> > <label for="answer2">
> > <input type="radio" id="answer2"
> > value="2" name="answers" />
> > Answer 2
> > </label>
> > <label for="answer3">
> > <input type="radio" id="answer3"
> > value="3" name="answers" />
> > Answer 3
> > </label>
> > <label for="answer4">
> > <input type="radio" id="answer4"
> > value="4" name="answers" />
> > Answer 4
> > </label>
> > <label for="answers" class="error">Please
> > select an answer.</label>
> > </fieldset>
> > <input class="submit" type="submit"
> > value="Check Answers"/>
> > </fieldset>
> > </form>
> > </div>
> > </body>
> > </html>
>
> > On Jun 26, 1:11 pm, Alexandre Magno <alexan...@gmail.com> wrote:
>
> > > Hello,
>
> > > If you need a simple solution to this you should consider create a new
> > > validation rule for the validate plugin, it's easy...
>
> > > this it's a example how to create a rule to verify its the age its
> > > greater than 18:
>
> > > jQuery.validator.addMethod("minAge", function(value, element, params)
> > > {
> > > return this.optional(element) || value > params;
>
> > > }, "You should be greater than 18 to enter in this website");
>
> > > So you should create a rule that you pass for example the right
> > > answear in rule an then will be checked all throught the validate
>
> > > This rule you created with the syntax above could be added in
> > > additional.methods.js that cames with the validate plugin
>
> > > it was clear?
>
> > > Alexandre Magno
> > > Interface Developerhttp://blog.alexandremagno.net
>
> > > On Jun 25, 7:12 pm, Matt Riley <mattrileyiph...@gmail.com> wrote:
>
> > > > Yeah, like I thought, I'm back again. ;-)
>
> > > > Below is the code I've been cobbling together from your previous post.
> > > > Please feel free to slap me around and tell me where I've done bad.
> > > > Right now, the form validation works fine (if there is nothing
> > > > selected then the jquery validation comes up). However, when I hit the
> > > > submit button, nothing happens. I'm sure I've screwed something up
> > > > royally but I'm not an experienced enough programmer to figure it all
> > > > out before the sun dies.
>
> > > > <script type="text/javascript">
> > > > $.validator.setDefaults({
> > > > submitHandler: function() {
> > > > var correctAnswer = 1
> > > > $('.theAnswer').each(
> > > > function(){
> > > > var temp_val = $('.theAnswer').val();
> > > > var temp_id = $('.theAnswer').attrib('id');
> > > > if(temp_val=='selected'){
> > > > if(temp_id == correctanswer){
> > > > alert("Correct!");
> > > > }
> > > > else{
> > > > alert("Try Again.");
> > > > }
> > > > }
>
> > > > });
> > > > }
> > > > });
>
> > > > $.metadata.setType("attr", "validate");
> > > > $(document).ready(function() {
> > > > $("#quiz_form").validate();
>
> > > > });
>
> > > > </script>
>
> > > > </head>
> > > > <body>
> > > > <div id="main">
> > > > <form class="cmxform" id="quiz_form" method="get" action="">
> > > > <fieldset>
> > > > <fieldset>
> > > > <label for="answer1">
> > > > <input name="answers" type="radio" class="theAnswer"
> > > > id="answer1" value="1" validate="required:true" />
> > > > Answer 1
> > > > </label>
> > > > <label for="answer2">
> > > > <input name="answers" type="radio"
> > > > class="theAnswer" id="answer2"
> > > > value="2" />
> > > > Answer 2
> > > > </label>
> > > > <label for="answer3">
> > > > <input name="answers" type="radio"
> > > > class="theAnswer" id="answer3"
> > > > value="3" />
> > > > Answer 3
> > > > </label>
> > > > <label for="answer4">
> > > > <input name="answers" type="radio"
> > > > class="theAnswer" id="answer4"
> > > > value="4" />
> > > > Answer 4
> > > > </label>
> > > > <label for="answers" class="error">Please
> > > > select an answer.</
> > > > label>
> > > > </fieldset>
> > > > <input class="submit" type="submit" value="Check
> > > > Answers" />
> > > > </fieldset>
> > > > </form>
> > > > </div>
> > > > </body>
> > > > </html>
>
> > > > On Jun 25, 4:27 pm, Matt Riley <mattrileyiph...@gmail.com> wrote:
>
> > > > > Thanks for your reply. I'm going to give it a go with what you
> > > > > suggested, although I'm not exactly a seasoned pro at this so I will
> > > > > probably get stuck and come back begging for more help. :-)
>
> > > > > I should have mentioned that this thing needs to run locally from a
> > > > > user's hard disk without a requirement for server-side processing. If
> > > > > this was not the case, I would've probably pursued a php solution as
> > > > > I'm slightly more comfortable with that (jquery is very new to me). It
> > > > > doesn't much matter if the correct answer is hidden in the source of
> > > > > the page somewhere; these quizzes will just be used for basic users
> > > > > who wouldn't know/care to look in the source anyway.
>
> > > > > Again, thank you for your reply. I'll probably be back. LOL.
>
> > > > > -Matt
>
> > > > > On Jun 25, 3:16 pm, Lee R Lemon III <leerlemon...@gmail.com> wrote:
>
> > > > > > well like many things this has a variable answer...
>
> > > > > > but what I think you will need to do is write a script that gets the
> > > > > > correct answer (I would use ajax calls to server so the answer can
> > > > > > not
> > > > > > be seen in the browser code)
> > > > > > then set an event on the submit button that cycles through your
> > > > > > radio
> > > > > > buttons for the correct answer easiest way to do that is add a class
> > > > > > to each and do something sorta like..
> > > > > > //outside a function (before your document.ready as well)
> > > > > > var correctanswer;
> > > > > > //somewhere set the value of correctanwser
> > > > > > $('.your_class').each(
> > > > > > function(){
> > > > > > var temp_val = $('.your_class').val();
> > > > > > var temp_id = $('.your_class').attrib('id');
> > > > > > if(temp_val=='selected'){
> > > > > > if(temp_id == correctanswer){
> > > > > >
>
> ...
>
> mais »
