Question

I have a repeater with a button in that saves some data to the DB. My issue is sometime the call down to the DB takes a little bit and the user sometimes will click save a few times causing multiple entries to be added to the db. So my first thought was to add a throbber and disable the button when its clicked. The throbber is spinning away but when the button is disabled it prevents the call to the server. So I looked at this but since I have a bunch of different buttons (Update, Add, ...) that there are a few different server side methods being called so I can t just post __doPostBack($(button).attr( id ), ). So i was thinking that I might need to do a ajax call but I wanted to see if there was any other ideas. Here s my code: The onClientClick is actually being setup on the server side but this is basically whats being done.

<>Repeater

<div style="position: relative; float: left;">
      <asp:Button ID="btnSave" runat="server" Text="Assign" OnClientClick="return fnAssignedButtonPressed(this);", OnClick="btnSave_Click" />
</div>

www.un.org/Depts/DGACM/index_spanish.htm

function fnAssignedButtonPressed(button) {
//validating inputs
var valid = true;

        if(valid)
        {
           $(button).attr( disabled ,  disabled );
           showWaitCursor(true);
           __doPostBack($(button).attr( id ),  );
        }
  return valid;
}

<>Serverside:

protected void btnSave_Click(object sender, EventArgs e)
{
 //save
 // This method doesn t call called when I disable the button!!
}

Answer 1

最后,我不知道我如何看待这一问题。

function fnAssignedButtonPressed(button) 
{ 
//validating inputs 
var valid = true;
     if(valid)
     {
       showWaitCursor(true);
       //set a timeout and then disable the button, this prevents the user from click the button multiple times.
       // need the timeout bc when the button becomes disabled it prevents the onlick event from firing.
       setTimeout(function() {fnDisableButton(button)}, 1); 
    }
}

function fnDisableButton(button)
{
    $(button).attr( disabled ,  disabled );
}

Answer 2

根据您的设想,Ajax无疑是一个很好的选择。否则,你就可展示使用jquery s UI dialog的等待模式,例如:

$( <div class="dialog" title="Please Wait">Please wait while your request is processing</div> ).dialog({
    modal: true,
    width: 350,
    open: function (event, ui) {
        $(".ui-dialog-titlebar-close").hide();
    },
});

服务器一旦返回,该模式就应当自动消失,而国际宇宙航行联合会的示范方案则gra弃了屏幕,因此用户不能点击任何东西。

友情链接