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>

Recommended Answers

why is this php

Jump to Post

have you checked this link ?

Jump to Post

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.

Jump to Post

All 11 Replies

Member Avatar

why is this php

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.

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

Did you download the script ?

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>

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

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>

I meant that this is missing:

<script type="text/javascript" src="facebox.js"></script>

NO it doesn't work

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 1.21 million developers, IT pros, digital marketers, and technology enthusiasts learning and sharing knowledge.