如何在选中时显示复选框并在取消选中时隐藏 [英] How to show a checkbox on check and hide on uncheck

问题描述

我有一个asp gridview和内部网格视图我填充复选框。



我的要求是，最初复选框是隐藏的，点击它应该是可见并检查。

以下是我的代码。

 <  < span class =code-leadattribute> asp：GridView     runat   =  server    ID   =  gvOifList    RowStyle-CssClass   =  rowHover    CssClass   =  gridviewdiv    OnRowCreated   =  OnRowCreated    AutoGenerateColumns   =   false    OnRowCommand   =  lnkWebURL_Click    OnRowDataBound   =  gvOifList_RowDataBound    GridLines   = 无     AlternatingRowStyle-BackColor   = ＃D8D8D8    ShowHeader   =   false >  
 <   asp：TemplateField  >  
 <   itemtemplate  >  
 
 < span class =code-keyword><   asp：Checkbox     ID   =  chbCopy    runat   =  server       UseSubmitBehavior   =  false   样式  =     CausesValidation   =  false      /  >  
 <   / itemtemplate  >  

我正在为iOS做这个开发。

解决方案

easy ....

在facebook上添加我fb.me/Dean.Vangreunen



对asp订阅鼠标clic k事件

  //   CheckBox名称为CB  
 
 OnMouse_click（ Object  sender，MouseEventArgs e）
 {
  if （CB.Location.X >  = eX&& CB.Location.Y >  = e.Y&& CB.Location.X + CB.Width <  = e.X&& CB.Location.Y + CB.Height <  = eY）
 {
  //  如果鼠标位于复选框上方使其可见并检查它 
 CB.visable =  true < /跨度>; 
 CB.enabled =  true ; 
 CB。已检查 =  true ; 
} 
} 
 
  //  复选框上的划线on checked checked事件 
 OnCheckChange_click（ Object  sender，EventArgs e）
 {
  if （CB。已检查 ==  true ）
 { 
 CB.visable =  false ; 
} 
} 

忽略这下面大声笑

 __________ 
 | \ / \ / \ / \ / \ / | 
 | \ / \ / \ / \ / | 
 | \ / \ / \ / | 
 | \ / \ / | 
 | \ / | 
 | / \ | 
 | / \ / \ | 
 | / \ / \ / \ | 
 | / \ / \ / \ / \ | 
 | / \ / \ / \ / \ / \ | 
'''''''

将您的复选框包装在 div 类似如下：

 <   div     id   =  divCheckBox >  
 <  输入   类型  = 复选框    id   =  chbCopy   名称  =  vehicle    style   =   visibility：hidden; >  
 <   / input  >  <   / div  >  

您将要使用可见性样式，否则屏幕上没有任何空间供用户点击，当您显示复选框时（隐藏后），您将让屏幕转向你。由于您正在为iOS设备执行此操作，因此小的转变可能是一个巨大的UX问题。



在你的客户端javascript代码尝试以下:(假设你使用的是jQuery）



< pre lang =Javascript>




（ ＃divCheckBox）。点击（ function （）{
if （ hidden ==




I have a asp gridview and inside grid view i am populating checkboxes.

My requirement is that, Initially the check boxes are hidden and on click it should be visible and checked.
Following is my code.


<asp:GridView runat="server" ID="gvOifList" RowStyle-CssClass="rowHover" CssClass="gridviewdiv" OnRowCreated="OnRowCreated" AutoGenerateColumns="false" OnRowCommand="lnkWebURL_Click" OnRowDataBound="gvOifList_RowDataBound" GridLines="None" AlternatingRowStyle-BackColor="#D8D8D8" ShowHeader="false">
<asp:TemplateField>
<itemtemplate>
                                  
<asp:Checkbox ID="chbCopy" runat="server"  UseSubmitBehavior="false" Style="" CausesValidation="false"  />
</itemtemplate>





I am doing this development for iOS.

解决方案

easy....
add me on facebook fb.me/Dean.Vangreunen

on the asp subscribe to the mouse click event

// CheckBox name is "CB"

OnMouse_click(Object sender, MouseEventArgs e)
{
if( CB.Location.X >= e.X && CB.Location.Y >= e.Y && CB.Location.X+CB.Width <= e.X && CB.Location.Y+CB.Height <= e.Y)
{
//if the mouse is over the checkbox make it visable and check it
CB.visable = true;
CB.enabled = true;
CB.checked = true;
}
}

//on the checkbox sub scribe to the on checked changed event
OnCheckChange_click(Object sender, EventArgs e)
{
if(CB.checked == true)
{
CB.visable = false;
}
}

ignore this below lol

 __________ 
|\/\/\/\/\/|
| \/\/\/\/ |
|  \/\/\/  |
|   \/\/   |
|    \/    |
|    /\    |
|   /\/\   |
|  /\/\/\  |
| /\/\/\/\ |
|/\/\/\/\/\|
 ''''''''''




wrap your checkbox inside of a div kind of like the following:

<div id="divCheckBox">
    <input type="checkbox" id="chbCopy" name="vehicle" style="visibility: hidden;">
</input></div>

you will want to use the visibility style otherwise there won't be any space on the screen for the user to click into and when you display the checkbox (after being hidden) you will get the screen to shift on you. Since you are doing this for an iOS device that small shift could be a huge UX issue.

in your client side javascript code try the following: (assume you are using jQuery)




("#divCheckBox").click(function() { if ("hidden" ==




这篇关于如何在选中时显示复选框并在取消选中时隐藏的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！