Member Avatar for bavenbabu

I am new to usage of jquery.I want to show a confirmation facebox while all my input requirements are true.ie when my form fields are validated a simple facebox should appear showing the forms are validated.How can i do it.Itried a lot.But i didnt get the source for facebox.I didnt get the source(src) file from nowhere.Any one please help me in solving.My code is as follows:

   <head>
   <script type="text/javascript" src="jquery-1.4.min.js"></script> 
  <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> 
  <script type="text/javascript" src="jquery.validate.js"></script>
      <link href="../src/facebox.css" media="screen" rel="stylesheet" type="text/css" />



<script type="text/javascript">
$(document).ready(function(){
$("#form1").validate({
rules:{
name:{
required:true
},
password:{
required:true
},
age: {
required: true,
range: [17, 30]
}
}

          });
      });
      jQuery(document).ready(function($) {
  $('a[rel*=facebox]').facebox({
    loadingImage : '../src/loading.gif',
    closeImage   : '../src/closelabel.png'
  })
})
  </script>
Edited by happygeek because: moved
  • 4 Contributors
  • 11 Replies
  • 170 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by pritaeas
Member Avatar for diafol

why is this php

Member Avatar for pritaeas

The facebox plugin script is not included.

Also, remove line 2 and keep only the latest jQuery version. Including two usually works, but is rather pointless.

Member Avatar for bavenbabu

I checked the link.But it doesnt seems to work in my code.

Member Avatar for pritaeas

Did you download the script ?

Member Avatar for bavenbabu

yeah I downloaded it.But its not showing up.I put correct format for src also.I rewrite the code and i got everytime unsuccessful in facebox.The code is as follows:

<link href="../src/facebox.css" media="screen" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="jquery-1.4.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="jquery.validate.js"></script>

      <script type="text/javascript">    
    $(document).ready(function() {

// $("#login").click(function(){
// var action=$("#form1").attr('action');
// var dat={
// name:$("#name").val(),
// password:$("#password").val(),
// age:$("#age").val(),
// is_ajax:1
// };
$("#form1").validate({
rules: {
name: "required",// simple rule, converted to {required:true}
password: {// compound rule
required: true

        }, 
          age: {
  required: true,
  range: [17, 30]
}
 } 


      });         
    });

// });
</script>

Member Avatar for pritaeas

You still haven't included the script in your code, only the CSS.

Member Avatar for bavenbabu

This is validation of name,age,password in jquery

the facebox code is as below:

<script type="text/javascript">     
  function example_login_facebox() {

  $.facebox(function() {   
    $.ajax({

      data: { 'name' : $('#name').val(), 'password' : $('#password').val(),'age' : $('#age').val(), is_ajax:1 },

        type: "post",

        url: "val1.php",
        error: function() {

            $.facebox('There was an error when attempting to log you in. Please try again shortly.');

        },

        success: function(data) 
        {

       $.facebox("success");

if(data=='success')

                          $("#form1").slideUp('fast',function(){
                                 $("#message").html("<p class='success'>logged in successfully</p>");
                             });
                             else
                              $.facebox("Unsuccessful");
                             $("#message").html("<p class='error'>invalid details</p>");
                            $("#message").show();
                         }

    });



});
}



   </script>
Member Avatar for pritaeas

I meant that this is missing:

<script type="text/javascript" src="facebox.js"></script>
Member Avatar for bavenbabu

NO it doesn't work

Member Avatar for pritaeas

Is your page online for viewing? Since you're not giving the whole code, it's hard to guess the error.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.