Vradhit
Vradhit

Reputation: 1

Button disable or enable is not working in jquery

here i am going to update the user information and i am handling the update function via ajax call.But my aim is whenever there is no update done modify button must be disabled and when we click on the text boxes for update modify button must be enabled.As i have used Key up, focus but none of them fires the event, as i am new to programming , please can u help in getting the solutions .Thank you in advance. user_update .php

<html>
<head><title>Updation</title>
<link rel="stylesheet" href="css/bookstyles.css">
<link rel="stylesheet" href="css/jquery-ui.css">
<script src="js/jquery-1.12.4.js"></script>
  <script src="js/jquery-ui.js"></script>
</head>
<body>

<div class="container">

<style>
#display {
color:red;
font-size:12px;
text-align:center;
}
.logo {
padding:5px;
float:right;
}
header {
background-color:#074e7c;
height:60px;
width:100%;
text-align:center;
color:white;
font-size:40px;

}
#wrap {
text-align:center;
}
</style>

<body>
<div id="display">


<?php
include('db.php');
include('header/page_header.php');
error_reporting(0);
if(isset($_GET['user_Id']))
{
$userid=$_GET['user_Id'];
echo $userid;

$s="select * from coeds_user where userId=$userid";
echo $s;
$query1=mysql_query($s);
$res=mysql_fetch_array($query1);

?>



<form action="#" name="user_update" method="post">
<input type="hidden" name="user_Id" id="user_Id" value="<?php if(isset($userid)) echo $userid ;?>">
<table align='center' border='1'>

    <tr>

           <td> <label for="userName">UserName</label></td>
            <td ><input id="userName" name="userName" id="search_input"  type="text" value="<?php echo $res['userName'];?> "/></td>


        </tr>
        <tr>
        <td> <label for="userEmail">Email</label></td>
        <td ><input id="userEmail" name="userEmail" class="text" type="text"  value="<?php echo $res['userEmail'];?> " /></td>
        </tr>
        <tr>
        <td>
            <label for="userPassword">password</label></td>
            <td ><input id="userPassword" name="userPassword"  class="text"   type="password" value="<?php echo $res['userPassword'];?> "/></td>


        </tr>
        <tr>
        <td>
            <label for="expiry_date">ExpiryDate</label></td>
            <td ><input id="expiry_date" name="expiry_date" class="text"   type="text" value="<?php echo $res['expiry_date'];?> "/></td>


        </tr>









        </table>

        <input type="submit" name="modify" id="modify" value="modify" class="enable" disabled="disabled"/   >
        <?php
        }
        ?>
<?php

include('db.php');
if(isset($_POST['user_Id']))
{
$userid=$_POST['user_Id'];
echo $userid;
}






$s="select * from coeds_user";
$query=mysql_query($s);
$display.="<table border='1'>";
$display.="<tr><th>UserId</th><th>UserName</th><th>UserEmail</th><th>UserPassword</th><th>RegDate</th><th>RegistrationKey</th></tr>";
while($res=mysql_fetch_array($query))
{
$display.="<tr>";
$display.="<td>".$res['userId']."</td>";
$display.="<td>".$res['userName']."</td>";
$display.="<td>".$res['userEmail']."</td>";
$display.="<td>".$res['userPassword']."</td>";
$display.="<td>".$res['regDate']."</td>";
$display.="<td>".$res['registration_key']."</td>";
$display.="<td>".$res['expiry_date']."</td>";
$display.="</tr>";
}
$display.="</table>";
//header('location:users1.php');
echo $display;




?>
</div>


</body>
<script type="text/javascript" >
    $(document).ready(function() {
    $( "#expiry_date" ).datepicker();

    });
</script>
<script type="text/javascript" >
$(document).ready(function() {
 $(function () {
                $( '.text' ).Keyup(function() { 
                alert(" 1 hi");
                    if ($(this).val() == '') {
                    alert("2 hi");

                        $('#modify').prop('disabled', true);
                    } else {
                    alert("3 hi");

                        //$('input[type="submit"]').removeAttr('disabled');
                        $('#modify').prop('disabled', false);


$('#modify').click(function(e) {


alert("hi");
var userid=$("#user_Id").val();
var userName=$("#userName").val();
var userEmail=$("#userEmail").val();
var userPassword=$("#userPassword").val();
var expiry_date=$("#expiry_date").val();

var dataString='user_Id='+userid+'&userName='+userName+'&userEmail='+userEmail+'&userPassword='+userPassword+'&expiry_date='+expiry_date;

alert(dataString);
 $.ajax({


                            type: "POST",

                            data: dataString,
                            url: "edit_user_details.php",
                            cache: false,

                            success: function(result){
                            alert(result);
                                      $('#display').html(result);

                                window.location.href="users1.php";





                                        },





            error: function (xhr, ajaxOptions, thrownError) {
                    alert(xhr.status);
                    alert(thrownError);
            }



      });
      });
      }
      });
      });

          });







</script>


</form>
</html>

Upvotes: 0

Views: 180

Answers (2)

Mazz
Mazz

Reputation: 1879

You can do it with prop and removeProp

.removeProp('disabled');

or add with

.prop('disabled', 'disabled');

Upvotes: 1

diavolic
diavolic

Reputation: 722

use folowing syntax to disable:

 $('#modify').prop('disabled', 'disabled');

and to enable:

 $('#modify').prop('disabled', '');

Upvotes: 2

Related Questions