在该代码不起作用之后,JQuery只工作一次。 [英] JQuery works only one time after that code not works.

查看:51
本文介绍了在该代码不起作用之后,JQuery只工作一次。的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

大家好,



我正在制作一个小应用程序

但这段代码只适用于第一次页面lode。

当我点击编辑或删除第一次工作正常但当我点击第二次工作没什么?





这个是我的代码



hello everyone,

I am making one small Application
but this code works only First time when page lode.
when i click Edit Or Delete First time Work fine but when i click second time that work nothing?


This is my Code

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Show User Data</title>
    <script src="jquery.min.js"></script>
    <link href="MyCSS.css" rel="stylesheet" />
    <link href="jquery-ui.css" rel="stylesheet" />
    <script src="jquery-1.10.2.js"></script>
    <script src="jquery-ui.js"></script>
    <link rel="stylesheet" href="/resources/demos/style.css" />
    <!--<script src="jquery.js"></script>-->
    <link href="notifIt.css" rel="stylesheet" />
    <script src="notifIt.js"></script>
    <!--<script src="json2.js"></script>-->
    <script>
        $(function () {
            $("#bdate").datepicker();

        });
    </script>

    <script>
        var updateid = 0;
        $(document).ready(function () {

            getdata();

            $("tbody").find("tr").hover(
            function () {
                $(this).css("background", "blue");
                $(this).css("color", "white");
            },
            function () {
                $(this).css("background", "");
                $(this).css("color", "");
            }
        );

            $("input[type=button]").hover(
            function () {
            $(this).css("background", "black");
            $(this).css("color", "white");
            $(this).css("cursor","pointer");
            },
            function () {
                $(this).css("background", "");
                $(this).css("color", "");
            }
        );


            $(function () {
                $("input[type=button]")
                  .click(function (event) {
                      //alert(this.id);
                      if ($(this).val() == "Edit") {

                          var uid = this.id;

                          $.ajax({
                              url: "GetUserData.asmx/getDataByID",
                              dataType: "json",
                              data: "{id:'" + uid + "'}",
                              contentType: "application/json; charset=utf-8",
                              async: false,
                              type: "POST",
                              success: function (re) {
                                  //alert(re.d.tb2[0].FirstName);
                                  $("#fname").val(re.d.tb2[0].FirstName);
                                  $("#lname").val(re.d.tb2[0].LastName);
                                  $("#email").val(re.d.tb2[0].E_mail_ID);
                                  $("#bdate").val(dateconvert(re.d.tb2[0].Birthdate));
                                  //alert(re.d.tb2[0].Active);
                                  $("#Chkactive").attr('checked', true);
                                  $("#insert").attr('value', 'Update');
                                  $("#clear").attr('value', 'Cancle');
                                  updateid = uid;
                              },
                              error: error1
                          });
                      }
                      else if ($(this).val() == "Insert") {

                          var u_fname = $("#fname").val();
                          var u_lname = $("#lname").val();
                          var u_email = $("#email").val();
                          var u_bdate = $("#bdate").val();
                          var u_active = document.getElementById("Chkactive");
                          
                          if (u_active.checked == true)
                              u_active = true;
                          else
                              u_active = false;
                         // validation();
                         
                          //alert("insert");
                          $.ajax({
                              url: "GetUserData.asmx/insertData",
                              dataType: "json",
                              data: "{fname:'" + u_fname + "',lname:'" + u_lname + "',email:'" + u_email + "',bdate:'" + new Date().toDateString() + "',active:'" + u_active + "'}",
                              contentType: "application/json; charset=utf-8",
                              async: false,
                              type: "POST",
                              success: function (re) {

                                  document.getElementById("cont").innerHTML = "";
                                  getdata();
                                  SuccessInsert();


                              },
                              error: error1
                          });
                      }
                      else if ($(this).val() == "Update") {


                          // alert("update");

                          var u_fname = $("#fname").val();
                          var u_lname = $("#lname").val();
                          var u_email = $("#email").val();
                          var u_bdate = $("#bdate").val();
                          var u_active = document.getElementById("Chkactive");

                          if (u_active.checked == true)
                              u_active = true;
                          else
                              u_active = false;


                          $.ajax({
                              url: "GetUserData.asmx/updateData",
                              dataType: "json",
                              data: "{id:'" + updateid + "',fname:'" + u_fname + "',lname:'" + u_lname + "',email:'" + u_email + "',bdate:'" + new Date().toDateString() + "',active:'" + u_active + "'}",
                              contentType: "application/json; charset=utf-8",
                              async: false,
                              type: "POST",
                              success: function (re) {

                                  document.getElementById("cont").innerHTML = "";
                                  clearAllData();
                                  getdata();

                                  $("#insert").attr('value', 'Insert');                                  
                                  $("#clear").attr('value', 'Clear');
                                  SuccessUpdate();
                              },
                              error: error1
                          });

                      }
                      else if ($(this).val() == "Delete") {
                          //alert("delete");
                          var uid = this.id;

                          $.ajax({
                              url: "GetUserData.asmx/deleteByID",
                              dataType: "json",
                              data: "{id:'" + uid + "'}",
                              contentType: "application/json; charset=utf-8",
                              async: false,
                              type: "POST",
                              success: function (re) {
                                  //alert(re.d.tb2[0].FirstName);

                                  document.getElementById("cont").innerHTML = "";
                                  getdata();
                                  SuccessDelete();

                              },
                              error: error1
                          });
                      }
                      else if ($(this).val() == "Clear") {
                          clearAllData();
                      }
                      else if ($(this).val() == "Cancle") {
                          clearAllData();
                          $("#insert").attr('value', 'Insert');
                          $("#clear").attr('value', 'Clear');
                      }

                      //alert(u_fname + " " + u_active + " " + u_bdate);
                      //new Date().toDateString()

                  });
            });

        });

        function validation() {
            
                $('input[type="text"]').each(function () {
                    if ($.trim($(this).val()) == '') {
                        isValid = false;
                        $(this).css({
                            "border": "1px solid red",
                            "background": "#FFCECE"
                        });
                    }
                    else {
                        $(this).css({
                            "border": "",
                            "background": ""
                        });
                    }
                });
                if (isValid == false) 
                    notif({
                        msg: "Correct Following Error",
                        type: "error",
                        position: "center"
                    });
                if (isValid == false)
                    e.preventDefault();
                
        }


        function dateconvert(bdate) {

            var str = bdate;
            var num = parseInt(str.replace(/[^0-9]/g, ""));
            var date = new Date(num);
            var finaldate = '';
            finaldate = finaldate + date.getMonth() + '/' + date.getDay() + '/' + date.getFullYear();
            return finaldate
            //alert(date);
        }



        function error1(data) {

            alert(data.statusText);
        }

        function getdata() {
            $.ajax({
                url: "GetUserData.asmx/GetAllData",
                dataType: "json",
                data: "{}",
                contentType: "application/json; charset=utf-8",
                async: false,
                type: "POST",
                success: function (re) {
                    //alert(re.d.tbl.length);
                    //alert( re.d.tbl[1].FirstName);
                    //alert(dateFormat(re.d.tbl[1].Birthdate, "mm/dd/yyyy"));




                    for (var i = 0; i < re.d.tbl.length; i++) {
                        //var button = $('<button />').attr({ 'id': re.d.tbl[i].Id, 'type': 'button', 'value': 'Edit' });

                        $("#cont").append("<tr><td class='uid'>" + re.d.tbl[i].Id + "</td>" +
                                                "<td class='fname'>" + re.d.tbl[i].FirstName + "</td>" +
                                                "<td class='lname'>" + re.d.tbl[i].LastName + "</td>" +
                                                "<td class='email'>" + re.d.tbl[i].E_mail_ID + "</td>" +
                                                "<td class='bdate'>" + dateconvert(re.d.tbl[i].Birthdate) + "</td>" +
                                                "<td class='active'>" + re.d.tbl[i].Active + "</td>" +
                                                "<td><input type='button' value='Edit'id='" + re.d.tbl[i].Id + "' class='editbutton' onclick='javascript:void(0);' > <input type='button' value='Delete'id='" + re.d.tbl[i].Id + "' class='deletebutton' >" +
                                                "</tr>"

                                                );
                    }

                },
                error: error1
            });

            clearAllData();
        }


        function clearAllData() {
            $('input[type=text]').each(function () {
                $(this).val('');
            });
            $("#Chkactive").removeAttr('checked', false);
        }

        function SuccessInsert() {
            notif({
                msg: "Successfully Inserted",
                type: "success"
            });
        }
        function SuccessDelete() {
            notif({
                msg: "Successfully Deleted",
                type: "success"
            });
        }
        function SuccessUpdate() {
            notif({
                msg: "Successfully Update",
                type: "success"
            });
        }



    </script>


</head>
<body>

    <table id="tblinsert">
        <thead>
            <tr>
                <td class="uid header">User Id</td>
                <td class="fname header">First NAme</td>
                <td class="lname header">Last Name</td>
                <td class="email header">E-mail</td>
                <td class="bdate header">Birthdate</td>
                <td class="active header">Active</td>
                <td class="iud"></td>

            </tr>

            <tr>
                <td class="uid"></td>
                <td class="fname">
                    <input id="fname" type="text" /></td>
                <td class="lname">
                    <input id="lname" type="text" /></td>
                <td class="email">
                    <input id="email" type="text" /></td>
                <td class="bdate">
                    <input id="bdate" type="text" /></td>
                <td class="active">
                    <input id="Chkactive" type="checkbox" /></td>
                <td class="iud">
                    <input id="insert" type="button" value="Insert" />
                    <input id="clear" type="button" value="Clear" />


                </td>
            </tr>
        </thead>
    </table>
    <table id="tblUserDetail">
        <tbody id="cont">
        </tbody>

    </table>

</body>
</html>

推荐答案

(function(){
(function () {


( #bdate)。datepicker();

});
< / script>

< script>
var updateid = 0;
("#bdate").datepicker(); }); </script> <script> var updateid = 0;


(document).ready(function(){

getdata();
(document).ready(function () { getdata();


这篇关于在该代码不起作用之后,JQuery只工作一次。的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆