使用Ajax更改按钮值不起作用

时间:2014-12-19 05:49:27

标签: jquery ajax button

我想在用户点击

时将范围的文字更改为处理...

这是我已经尝试过的

$("#ibSave").text('Please wait...');
//$("#ibSave").prop('disabled', true);
$.ajax({
    type: "POST",
    url: "../Messgaes.asmx/InsertMembers",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    async: false,

    timeout: 900000,
    data: JSON.stringify(Postdata),
    success: function (result) {
        $('#csvimporthint').html("<div class='success'>" + result.d + " members successfully uploaded.</div>")
        $("#ibSave").text('Upload');
        //$('#ctl00_ContentPlaceHolder1_ibSave').prop('disabled', false);
        console.log(new Date() - dates);
    },
    error: function (result) {
        console.log(result.responseText);
    }

});

这是我的HTML

<span id="ibSave" class="btn btn-primary mr5">Upload</span>

我也尝试过使用Jquery AJAX: How to Change button value on "success"?解决方案 按钮(&#34;刷新&#34) 但有些如何不起作用  我之前使用过按钮它还没有工作

$("#ibSave").val('Please wait...'); 
//when it was a button ^
$("#ibSave").val('Please wait...').button("refresh");
//this both wasn't working

注意:如果我在浏览器中打开控制台,那么按钮的值会改变!!

我不知道我做错了同样的代码,控制台窗口/检查窗口打开工作正常。

你能指导我如何实现这个目标吗?

更新:

这是我的完整代码

 $("#ibSave").click(function () {

     if ($('.green').length > 0) {
         var json = [];
         $('.green').each(function () {
             var firstname = '';
             var lastName = '';
             var email = '';
             var balance = '';
             var password = '';
             var obj = {},
             $td = $(this).find('td'),

                 firstname = $td.eq(0).text(),
                 lastName = $td.eq(1).text(),
                 email = $td.eq(2).text(),
                 balance = $td.eq(3).text();
             password = $td.eq(4).text();

             obj.FirstName = firstname;
             obj.LastName = lastName;
             obj.Email = email;
             obj.Balance = balance;
             obj.Password = password;
             json.push(obj);
         });
         //console.log(json);
         var Postdata = {
             members: json
         };
         var dates = new Date();


         $("#ibSave").html('Please wait...');
         //$("#ibSave").prop('disabled', true);
         $.ajax({
             type: "POST",
             url: "../Messgaes.asmx/InsertMembers",
             contentType: "application/json; charset=utf-8",
             dataType: "json",
             async: false,

             timeout: 900000,
             data: JSON.stringify(Postdata),
             success: function (result) {
                 $('#csvimporthint').html("<div class='success'>" + result.d + " members successfully uploaded.</div>")
                 $("#ibSave").html('Upload');
                 //$('#ctl00_ContentPlaceHolder1_ibSave').prop('disabled', false);
                 console.log(new Date() - dates);
             },
             error: function (result) {
                 console.log(result.responseText);
             }

         });
         return false;

     } else {
         alert("Sorry! you don't have enough valid rows to upload");
         return false;
     }
 });

1 个答案:

答案 0 :(得分:2)

很抱歉打扰但是我将不得不回答我自己的问题以供将来参考

我刚刚禁用了

async: false,

我已将其更改为

async: true,

现在它完全改变了价值观!

var interval;

                $this = $(this);
                //$("#ibSave").prop('disabled', true);
                $.ajax({
                    type: "POST",
                    url: "../Messgaes.asmx/InsertMembers",
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    async: true,

                    beforeSend: function () {

                        $this.val('Uploading');

                        interval = window.setInterval(function () {
                            var text = $this.val();
                            if ($this.val().length < 13) {
                                $this.val($this.val() + '.');
                            } else {
                                $this.val('Uploading');
                            }
                        }, 200);
                    },
                    timeout: 900000,
                    data: JSON.stringify(Postdata),
                    success: function (result) {
                        $('#csvimporthint').html("<div class='success'>"+result.d+" members successfully uploaded.</div>")
                        $this.val("Upload");
                        $this.prop('disabled', false);
                        //$('#ctl00_ContentPlaceHolder1_ibSave').prop('disabled', false);
                        $this.val('Calculating.....');
                        $this.val('Done!');
                        $this.val('Upload');
                        window.clearInterval(interval);
                    },
                    error: function (result) {
                        console.log(result.responseText);
                    }

                });

这里是我的完整代码

特别感谢@mr.Green