CODEWITHSUNDEEP
phpjquery
user2234992
user2234992

Reputation: 575

simple jquery show div not working

It's so weird that this code is not working.. I just want a div to hide when it loads and the show on when i click the New button.. Pls tell where am doing wrong..Thanks!

<?php
include('connect.php');
?>

<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>

 <script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.js"></script>
 <script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
 <script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/additional-methods.js"></script>
 <script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/additional-methods.min.js"></script>

 <script>



  $(document).ready(function(){


$('#form2').hide();

  $("#form1").validate({
         debug: false,
   rules: {

    plid:"required",
       },
   messages: {

    plid: "Please select a pack name id..",
    },

    submitHandler: function(form) {

    $.ajax
   ({




type: "POST",
url: "aa.php",
data: $('#form1').serialize(),
cache: false,

success: function(response) {
    $('#result1').html(response); 

        }
        });
        }

  });
  });


  </script>
  <script>
$("#new").click(function(){

    $("#form2").show();
})
  </script>

</head>
<body>

Packing List
</br>
<form id="form1" name="form1" action="" method="post">
<?php   


echo '<select  name="plid" id="plid">';
echo '<option value="" selected="selected">--Select the Pack Name--</option>';
$tempholder = array();
$sql="SELECT CONCAT( p.pl_no,  '_', DATE_FORMAT( p.pl_dt,  '%d/%m/%Y' ) ,  '_', g.acname ) AS plname, p.pl_id FROM packlist p, glmast g WHERE g.gl_id = p.gl_id ORDER BY pl_dt DESC , pl_no DESC LIMIT 30";


$query = mysql_query($sql) or die(mysql_error());
$nr = mysql_num_rows($query);
for ($i=0; $i<$nr; $i++){
$r = mysql_fetch_array($query);
if (!in_array($r['plname'], $tempholder)){
$tempholder[$i] = $r['plname'];
echo "<option value='$r[pl_id]'>".$r["plname"]."</option>";
}
}

echo '</select>';

?><br/>

<input type="submit" name="delete" value="Delete"/><br/>
<input type="submit" name="edit" id="edit" value="Edit"/><br/>

</form>
<form>
<input type="submit" name="new" id="new" class="new" value="New" /><br/>
</form>

<div id="newform" class="newform">

        <form name="form2" class="form2" id="form2" method="post" action="aa.php">
        <P>
            <LABEL for="plidnew">PackList No 
                      <INPUT type="text" id="plidnew" name="plidnew"></LABEL><BR><BR>
            <LABEL for="itemidnew">Item Id 
                      <INPUT type="text" id="itemidnew" name="itemidnew"></LABEL><BR><BR>
            <LABEL for="quannew">Quantity
                      <INPUT type="text" id="quannew" name="quannew"></LABEL><BR><BR>
            <LABEL for="potnew">Potency
                      <INPUT type="text" id="potnew" name="potnew"></LABEL><BR><BR>
            <LABEL for="sizenew">Size
                      <INPUT type="text" id="sizenew" name="sizenew"></LABEL><BR><BR>

            <INPUT type="submit" id="newsubmit" name="newsubmit" value="Submit"> <INPUT type="reset">
            </P> 

        </form>

</div>
<div id="result1"></div>
</body>

</html>

So I tried various combination of jquery, but when the page loads the div is hidden.. But when I click it is not showing up..Any help!!!

Upvotes: 0

Views: 311

Answers (1)

carlituxman
carlituxman

Reputation: 1221

You should put any code more specific code, not only copy&paste all your code, because we can't try your script, like connection to mysql... but

you should put

$("#new").click(function(){
      $("#form2").show();
});

inside 

  $(document).ready(function(){...

and not use type="submit" for all buttons, because it launch the submit of form, you should use for example:

<input type="button" name="new" id="new" class="new" value="New" />

Upvotes: 1

Related Questions