客户端灵活操作ASPxGridView

本例子是在.net平台下结合JQuery，ASPxControl，js实现客户端灵活操作ASPxGridView。

问题：

1、当前我们没有选择数据的时候，我们应该是先将操作的按钮disabled变为true；只要是选中了数据，这些操作按钮才会显示。

2、同时我们要求不回发，增加用户体验。

解决的思路：

解决方法：

1）默认页面按钮显示

前台代码：

<input type="button" id="iBtnQuery" value="查询..."  />
<asp:Button runat="server" ID="btnSave" Text="存档"   onclick="btnSave_Click" />
<input type="button" id="btnSave1" value="存档"  onclick="SaveProject();" disabled="disabled"/>
<input type="button" id="iBtnEdit" value="项目编辑.."  onclick="popWin('item');" disabled="disabled"  />
<input type="button" id="iBtnEditProject" value="工程编辑.."  onclick="popWin('project');" disabled="disabled" />
<asp:Button runat="server" ID="btnDelete" Text="删除.." onclick="btnDelete_Click" />
<input type="button" id="btnDelete1" value="删除.." onclick="deleteProject()" disabled="disabled"/>
<asp:Button runat="server" ID="btnDownload" Text="下载报表" />   

后台隐藏服务器按钮代码： 

 if (!IsPostBack)
{
   this.btnSave.Attributes.Add("style", "display:none;");
   this.btnDelete.Attributes.Add("style", "display:none;");

}

当点击查询就会显示数据：

默认还是按钮还是不可用的。

只有点击checkbox 才会有用

演示效果：

全选：

单选：

多选：

代码的实现：

var ckbAllSelectFlag=true;//全选的状态；
var ckbSelectFlag=true;//非全选的状态；
var chkClick=true;//
function ckbAllSelect(){
  if(ckbAllSelectFlag==true)
       {//这是JQurey的API
         $("input[@class='ckbProject']").each(function() {
         this.checked=true;});
         ckbAllSelectFlag=false;
         $("#btnSave1").removeAttr("disabled") ;
         $("#btnDelete1").removeAttr("disabled") ;
         $("#iBtnEdit").removeAttr("disabled") ;
         $("#iBtnEditProject").removeAttr("disabled") ;
         chkClick=false;
        }
        else
        {
          $("input[@class='ckbProject']").each(function() {
          this.checked=false;});
          ckbAllSelectFlag=true;
          $("#btnSave1").attr("disabled","disabled") ;
          $("#btnDelete1").attr("disabled","disabled") ;
          $("#iBtnEdit").attr("disabled","disabled") ;
          $("#iBtnEditProject").attr("disabled","disabled") ;
          chkClick=true;
        }
}
//弹出窗口方法
 function popWin(type) {
    if (type == "item") {
       if(ckbAllSelectFlag==true && ckbSelectFlag==false)
       {
          alert("请选择要编辑的工程!");
          return;
       }
       else
       {
          $("input[@class='ckbProject']").each(function() {
          if(this.checked== true)
          {
             var selectProjectId=this.value;
             var nSelectProjectId=Number(this.value.indexOf('$'));
             PopWindow("Project/RegisterItem.aspx?itemid=" + selectProjectId.substring(nSelectProjectId+1) +"&d=" + new Date().toString());
             return false;}});
          }
         }
         else {
           if(ckbAllSelectFlag==true && ckbSelectFlag==false)
            {
              alert("请选择要编辑的工程!");
              return;
            }
            else
            {
                $("input[@class='ckbProject']").each(function() {
                if(this.checked== true)
                {
                 var selectProjectId=this.value;
                 var nSelectProjectId=Number(this.value.indexOf('$'));
                 PopWindow("Project/RegisterProject.aspx?projectid=" + selectProjectId.substring(0,nSelectProjectId) +"&d=" + new Date().toString());
                        return false;}});
                }
        }
};
//存档
function SaveProject()
  {
    if(confirm("请确认是否将选中执行存档？"))
    {
       if(ckbAllSelectFlag==true && ckbSelectFlag==false)
       {
           alert("请选择要编辑的工程!");
           return;
       }
       else
       {
         var tempText="";
         $("input[@class='ckbProject']").each(function() {
         if(this.checked== true)
         {
            var selectProjectId=this.value;
            var nSelectProjectId=Number(this.value.indexOf('$'));
            tempText+=selectProjectId.substring(0,nSelectProjectId)+",";
          }});
         $("#selectProjectInfo").val(tempText);
         var SaveBtn=document.getElementByIdx("btnSave");
          SaveBtn.click();
                }
            }
        }
//删除
  function deleteProject()
  {
    if(confirm("请确认是否将选中的工程执行删除？"))
    {
       if(ckbAllSelectFlag==true && ckbSelectFlag==false)
       {
          alert("请选择要编辑的工程!");
           return;
       }
       else
       {
        var tempText="";
        $("input[@class='ckbProject']").each(function() {
        if(this.checked== true)
        {
         var selectProjectId=this.value;
         var nSelectProjectId=Number(this.value.indexOf('$'));
         tempText+=selectProjectId.substring(0,nSelectProjectId)+",";
         }});
         $("#deleteProjectInfo").val(tempText);
         var deleteBtn=document.getElementByIdx("btnDelete");
         deleteBtn.click();
                }
            }
        }
//改变disabled；
        function changeDisable()
        {
                   $("input[@class='ckbProject']").each(function() {
                    if(this.checked== true)
                    {
                    $("#btnSave1").removeAttr("disabled") ;
                    $("#btnDelete1").removeAttr("disabled") ;
                    $("#iBtnEdit").removeAttr("disabled") ;
                    $("#iBtnEditProject").removeAttr("disabled") ;
                    chkClick=false;return false;}
                    $("#btnSave1").attr("disabled","disabled") ;
                    $("#btnDelete1").attr("disabled","disabled") ;
                    $("#iBtnEdit").attr("disabled","disabled") ;
                    $("#iBtnEditProject").attr("disabled","disabled") ;
                    });

        }