簡體   English   中英

如何在每次單擊復選框時阻止頁面刷新

[英]how to stop page from refreshing everytime a checkbox is click

好的,盡可能簡單,我有一個將自動回傳設置為true和OnSelectedIndexChanged的復選框。 但是,每次有人單擊復選框中的項目時,頁面都會刷新。 如何停止呢? 我試過使用UpdatedPanel(這是一種工作)。

<asp:CheckBoxList ID="Regions" runat="server" OnSelectedIndexChanged="Regions_SelectedIndexChanged" AutoPostBack="true" DataSourceID="SqlDataSource2" DataTextField="Regions" DataValueField="ID">
                    </asp:CheckBoxList>

OnselectedIndexChange在一個復選框列表旁邊顯示其他復選框的div。

protected void Regions_SelectedIndexChanged(object sender, EventArgs e)
{
    string select = @"Select Facilities from [BulletinBoard].[DMHSAS\290974].[Facilities] ";

    int[] ctr = new int[9];
    int ctr1 = 0;
    int counter = 0;
    dFacilities.Style.Add("display", "block");
    foreach (ListItem item in Regions.Items)
    {
        //Response.Write(item.Selected);
        if (Regions.SelectedIndex == 0)
        {
            item.Selected = true;

            CheckBoxList1.Visible = true;
            counter++;
        }
        else if (item.Selected)
        {
            if (select.EndsWith("[Facilities] "))
            {
                select += "where ";
            }
            if (select.EndsWith(") "))
            {
                select += " or ";
            }
            select += " (Reg_ID = " + Regions.SelectedIndex + ") ";

            ctr[ctr1 + 1] = Regions.SelectedIndex;
            item.Selected = false;
            counter++;
            CheckBoxList1.Visible = true;
        }

        ctr1++;
    }
    if (counter == 0)
    {
        CheckBoxList1.Visible = false;
        dFacilities.Style.Add("display", "none");
    }

    ctr1 = 0;
    bool all = false;
    foreach (int counter1 in ctr)
    {
        Regions.Items[counter1].Selected = true;
        if (Regions.Items[0].Selected == true)
            foreach (ListItem item in Regions.Items)
            {
                if (item.Selected)
                {
                    all = true;
                }
                else
                {
                    all = false;
                    break;
                }
            }
        if (all == false)
        {
            Regions.Items[0].Selected = false;
        }
    }

您似乎真的很喜歡經典的.NET回發工作流,但是您不想繼續嘗試隱藏回發的Webforms路徑,即使您想要它們,因為它使邏輯更容易,為什么不嘗試一次回避它呢? 如您所說,如果要阻止頁面刷新(又稱回發),則可以采取一些措施來完全阻止頁面刷新。

在頁面頂部:

<style type="text/css">
  .hideme
  {
    display: none;
  }
</style>

<script type="text/javascript>
  var checkBoxes = document.getElementById("<%= Regions.ClientID %>")
    .getElementsByTagName("input");

  var cbListIDss = [
    "<%= CheckBoxList1.ClientID %>",
    "etc"
  ];

function toggle(i, chkElement)
{
  if (chkElement.type == "checkbox") {
    if (chkElement.checked) {
      var cbElement = document.getElementById(cbListIDss [i]);
      cbElement.className = cbElement.className.replace("hideme", "");
      break;
    }
  }
}

  for (var i = 0; i < checkBoxes.length; i++) {
    checkBoxes[i].onClick += toggle(i, checkBoxes[i]);
  }
</script>

編輯:然后,在您的控件中,刪除以下屬性: OnSelectedIndexChanged="Regions_SelectedIndexChanged" AutoPostBack="true"

我沒有在回發方法中添加用於修改select變量的代碼,但是可以通過隱藏的輸入字段在js中完成。

或者,您的更新面板不起作用的原因是因為您有

if (Regions.SelectedIndex == 1)
{
    select += " where Reg_ID = 1";
    dFacilities.Style.Add("display", "block");

// note the number at the end of this variable 
    CheckBoxList1.Style.Add("display", "block");
}
if (Regions.SelectedIndex == 2)
{
    select += "where Reg_ID = 2";
    dFacilities.Style.Add("display", "block");

// note the number at the end of this variable 
//   All of these are adding display to CheckBoxList1, 
//   even though it seems like these should be adding 
//   the display property to CheckBoxList2, 3, etc.
    CheckBoxList1.Style.Add("display", "block");
}

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM