首页 文章

如何在ASP.NET.net中将按钮更改为图像按钮c#

提问于
浏览
0

alt text http://[url=http://www.freeimagehosting.net/][img]http://www.freeimagehosting.net/uploads/06e679a07d.jpg[/img][/url]

如何将按钮更改为图像按钮...开头的按钮有一个“选择日期”,当点击一个日历弹出时,当选择日期时,底部的标签读取日期进来和文本上的按钮更改为禁用...我想找到一个图像按钮,具有日历的图像图标,其余的功能将是相同的....

代码如下:

使用系统;使用System.Collections.Generic;使用System.ComponentModel;使用System.Text;使用System.Web;使用System.Web.UI;使用System.Web.UI.WebControls;

[assembly:TagPrefix(“DatePicker”,“EWS”)]命名空间EclipseWebSolutions.DatePicker {[DefaultProperty(“Text”)] [ToolboxData(“<{0}:DatePicker runat = server>”)] [DefaultEvent(“SelectionChanged”) )] [ValidationProperty(“TextValue”)]公共类DatePicker:WebControl,INamingContainer {#region Properties

public TextBox txtDate = new TextBox();
    public Calendar calDate = new Calendar();
    public Button btnDate = new Button();
    public Panel pnlCalendar = new Panel();

    private enum ViewStateConstants
    {
        ValidationGroup,
        RegularExpression,
        ErrorMessage,
        RegExText,
        CalendarPosition,
        FormatString,
        ExpandLabel,
        CollapseLabel,
        ApplyDefaultStyle,
        CausesValidation,
    }

    /// <summary>
    /// Defines the available display modes of this calendar.
    /// </summary>
    public enum CalendarDisplay
    {
        DisplayRight,
        DisplayBelow
    }

    /// <summary>
    /// Where to display the popup calendar.
    /// </summary>
    [Category("Behaviour")]
    [Localizable(true)]
    public CalendarDisplay CalendarPosition
    {
        get
        {
            if (ViewState[ViewStateConstants.CalendarPosition.ToString()] == null)
            {
                ViewState[ViewStateConstants.CalendarPosition.ToString()] = CalendarDisplay.DisplayRight;
            }
            return (CalendarDisplay)ViewState[ViewStateConstants.CalendarPosition.ToString()];
        }
        set
        {
            ViewState[ViewStateConstants.CalendarPosition.ToString()] = value;
        }
    }

    /// <summary>
    /// Text version of the control's value, for use by ASP.NET validators.
    /// </summary>
    public string TextValue
    {
        get { return txtDate.Text; }
    }

    /// <summary>
    /// Holds the current date value of this control.
    /// </summary>
    [Category("Behaviour")]
    [Localizable(true)]
    [Bindable(true, BindingDirection.TwoWay)]
    public DateTime DateValue
    {
        get
        {
            try
            {
                if (txtDate.Text == "") return DateTime.MinValue;

                DateTime val = DateTime.Parse(txtDate.Text);
                return val;
            }
            catch (ArgumentNullException)
            {
                return DateTime.MinValue;
            }
            catch (FormatException)
            {
                return DateTime.MinValue;
            }
        }
        set
        {
            if (value == DateTime.MinValue)
            {
                txtDate.Text = "";
            }
            else
            {
                txtDate.Text = value.ToShortDateString();
            }
        }
    }

    [Category("Behavior"), Themeable(false), DefaultValue("")]
    public virtual string ValidationGroup
    {
        get
        {
            if (ViewState[ViewStateConstants.ValidationGroup.ToString()] == null)
            {
                return string.Empty;
            }
            else
            {
                return (string)ViewState[ViewStateConstants.ValidationGroup.ToString()];
            }
        }
        set
        {
            ViewState[ViewStateConstants.ValidationGroup.ToString()] = value;
        }
    }

    /// <summary>
    /// The label of the exand button. Shown when the calendar is hidden.
    /// </summary>
    [Bindable(true)]
    [Category("Appearance")]
    [DefaultValue("PickDate")]
    [Localizable(true)]
    public string ExpandButtonLabel
    {
        get
        {
            String s = (String)ViewState[ViewStateConstants.ExpandLabel.ToString()];
            return ((s == null) ? "PickDate" : s);
        }
        set
        {
            ViewState[ViewStateConstants.ExpandLabel.ToString()] = value;
        }
    }

    /// <summary>
    /// The label of the collapse button. Shown when the calendar is visible.
    /// </summary>
    [Bindable(true)]
    [Category("Appearance")]
    [DefaultValue("Disabled")]
    [Localizable(true)]
    public string CollapseButtonLabel
    {
        get
        {
            String s = (String)ViewState[ViewStateConstants.CollapseLabel.ToString()];
            return ((s == null) ? "Disabled" : s);
        }
        set
        {
            ViewState[ViewStateConstants.CollapseLabel.ToString()] = value;
        }
    }

    /// <summary>
    /// Whether to apply the default style. Disable this if you want to apply a custom style, or to use themes and skins
    /// to style the control.
    /// </summary>
    [Category("Appearance")]
    [DefaultValue(true)]
    [Localizable(true)]
    public bool ApplyDefaultStyle
    {
        get
        {
            if (ViewState[ViewStateConstants.ApplyDefaultStyle.ToString()] == null)
            {
                ViewState[ViewStateConstants.ApplyDefaultStyle.ToString()] = true;
            }
            return (bool)ViewState[ViewStateConstants.ApplyDefaultStyle.ToString()];
        }
        set
        {
            ViewState[ViewStateConstants.ApplyDefaultStyle.ToString()] = value;
        }
    }

    /// <summary>          
    /// Causes Validation          
    /// </summary>          
    [Category("Appearance")]
    [DefaultValue(false)]
    [Localizable(false)]
    public bool CausesValidation
    {
        get
        {
            if (ViewState[ViewStateConstants.CausesValidation.ToString()] == null)
            {
                ViewState[ViewStateConstants.CausesValidation.ToString()] = false;
            }
            return (bool)ViewState[ViewStateConstants.CausesValidation.ToString()];
        }
        set
        {
            ViewState[ViewStateConstants.CausesValidation.ToString()] = value;
            btnDate.CausesValidation = value;
        }
    }

    #endregion

    #region Events

    /// <summary>
    /// A day was selected from the calendar control.
    /// </summary>
    public event EventHandler SelectionChanged;

    protected virtual void OnSelectionChanged()
    {
        if (SelectionChanged != null)   // only raise the event if someone is listening.
        {
            SelectionChanged(this, EventArgs.Empty);
        }
    }

    #endregion

    #region Event Handlers

    /// <summary>
    /// The +/- button was clicked.
    /// </summary>
    protected void btnDate_Click(object sender, System.EventArgs e)
    {
        if (!calDate.Visible)
        {
            // expand the calendar
            calDate.Visible = true;
            txtDate.Enabled = false;
            btnDate.Text = CollapseButtonLabel;
            if (DateValue != DateTime.MinValue)
            {
                calDate.SelectedDate = DateValue;
                calDate.VisibleDate = DateValue;
            }
        }
        else
        {
            // collapse the calendar
            calDate.Visible = false;
            txtDate.Enabled = true;
            btnDate.Text = ExpandButtonLabel;
        }
    }

    /// <summary>
    /// A date was selected from the calendar.
    /// </summary>
    protected void calDate_SelectionChanged(object sender, System.EventArgs e)
    {
        calDate.Visible = false;
        txtDate.Visible = true;
        btnDate.Text = ExpandButtonLabel;
        txtDate.Enabled = true;
        txtDate.Text = calDate.SelectedDate.ToShortDateString();
        OnSelectionChanged();
    }

    #endregion

    /// <summary>
    /// Builds the contents of this control.
    /// </summary>
    protected override void CreateChildControls()
    {
        btnDate.Text = ExpandButtonLabel;
        btnDate.CausesValidation = CausesValidation;
        txtDate.ID = "txtDate";

        calDate.Visible = false;

        if (ApplyDefaultStyle)
        {
            calDate.BackColor = System.Drawing.Color.White;
            calDate.BorderColor = System.Drawing.Color.FromArgb(10066329);
            calDate.CellPadding = 2;
            calDate.DayNameFormat = DayNameFormat.Shortest;
            calDate.Font.Name = "Verdana";
            calDate.Font.Size = FontUnit.Parse("8pt");
            calDate.ForeColor = System.Drawing.Color.Black;
            calDate.Height = new Unit(150, UnitType.Pixel);
            calDate.Width = new Unit(180, UnitType.Pixel);
            calDate.DayHeaderStyle.BackColor = System.Drawing.Color.FromArgb(228, 228, 228);
            calDate.DayHeaderStyle.Font.Size = FontUnit.Parse("7pt");
            calDate.TitleStyle.Font.Bold = true;
            calDate.WeekendDayStyle.BackColor = System.Drawing.Color.FromArgb(255, 255, 204);
        }

        ConnectEventHandlers();

        pnlCalendar.Controls.Add(calDate);
        pnlCalendar.Style["position"] = "absolute";
        pnlCalendar.Style["filter"] = "alpha(opacity=95)";
        pnlCalendar.Style["-moz-opacity"] = ".95";
        pnlCalendar.Style["opacity"] = ".95";
        pnlCalendar.Style["z-index"] = "2";
        pnlCalendar.Style["background-color"] = "White";

        if (CalendarPosition == CalendarDisplay.DisplayBelow)
        {
            pnlCalendar.Style["margin-top"] = "27px";
        }
        else
        {
            pnlCalendar.Style["display"] = "inline";
        }

        Controls.Add(txtDate);
        Controls.Add(pnlCalendar);
        Controls.Add(btnDate);

        base.CreateChildControls();
    }

    /// <summary>
    /// Render the contents of this control.
    /// </summary>
    /// <param name="output">The HtmlTextWriter to use.</param>
    protected override void RenderContents(HtmlTextWriter output)
    {
        switch (CalendarPosition)
        {
            case CalendarDisplay.DisplayRight:
                {
                    txtDate.RenderControl(output);
                    btnDate.RenderControl(output);
                    pnlCalendar.RenderControl(output);
                    break;
                }
            case CalendarDisplay.DisplayBelow:
                {
                    pnlCalendar.RenderControl(output);
                    txtDate.RenderControl(output);
                    btnDate.RenderControl(output);
                    break;
                }
        }
    }

    /// <summary>
    /// Connect event handlers to events.
    /// </summary>
    private void ConnectEventHandlers()
    {
        btnDate.Click += new System.EventHandler(btnDate_Click);
        calDate.SelectionChanged += new System.EventHandler(calDate_SelectionChanged);
    }

}

}

使用系统;使用System.Collections.Generic;使用System.ComponentModel;使用System.Text;使用System.Web;使用System.Web.UI;使用System.Web.UI.WebControls;

[assembly:TagPrefix(“DatePicker”,“EWS”)]命名空间EclipseWebSolutions.DatePicker {[DefaultProperty(“Text”)] [ToolboxData(“<{0}:DatePicker runat = server>”)] [DefaultEvent(“SelectionChanged”) )] [ValidationProperty(“TextValue”)]公共类DatePicker:WebControl,INamingContainer {#region Properties

public TextBox txtDate = new TextBox();
    public Calendar calDate = new Calendar();
    public Button btnDate = new Button();
    public Panel pnlCalendar = new Panel();

    private enum ViewStateConstants
    {
        ValidationGroup,
        RegularExpression,
        ErrorMessage,
        RegExText,
        CalendarPosition,
        FormatString,
        ExpandLabel,
        CollapseLabel,
        ApplyDefaultStyle,
        CausesValidation,
    }

    /// <summary>
    /// Defines the available display modes of this calendar.
    /// </summary>
    public enum CalendarDisplay
    {
        DisplayRight,
        DisplayBelow
    }

    /// <summary>
    /// Where to display the popup calendar.
    /// </summary>
    [Category("Behaviour")]
    [Localizable(true)]
    public CalendarDisplay CalendarPosition
    {
        get
        {
            if (ViewState[ViewStateConstants.CalendarPosition.ToString()] == null)
            {
                ViewState[ViewStateConstants.CalendarPosition.ToString()] = CalendarDisplay.DisplayRight;
            }
            return (CalendarDisplay)ViewState[ViewStateConstants.CalendarPosition.ToString()];
        }
        set
        {
            ViewState[ViewStateConstants.CalendarPosition.ToString()] = value;
        }
    }

    /// <summary>
    /// Text version of the control's value, for use by ASP.NET validators.
    /// </summary>
    public string TextValue
    {
        get { return txtDate.Text; }
    }

    /// <summary>
    /// Holds the current date value of this control.
    /// </summary>
    [Category("Behaviour")]
    [Localizable(true)]
    [Bindable(true, BindingDirection.TwoWay)]
    public DateTime DateValue
    {
        get
        {
            try
            {
                if (txtDate.Text == "") return DateTime.MinValue;

                DateTime val = DateTime.Parse(txtDate.Text);
                return val;
            }
            catch (ArgumentNullException)
            {
                return DateTime.MinValue;
            }
            catch (FormatException)
            {
                return DateTime.MinValue;
            }
        }
        set
        {
            if (value == DateTime.MinValue)
            {
                txtDate.Text = "";
            }
            else
            {
                txtDate.Text = value.ToShortDateString();
            }
        }
    }

    [Category("Behavior"), Themeable(false), DefaultValue("")]
    public virtual string ValidationGroup
    {
        get
        {
            if (ViewState[ViewStateConstants.ValidationGroup.ToString()] == null)
            {
                return string.Empty;
            }
            else
            {
                return (string)ViewState[ViewStateConstants.ValidationGroup.ToString()];
            }
        }
        set
        {
            ViewState[ViewStateConstants.ValidationGroup.ToString()] = value;
        }
    }

    /// <summary>
    /// The label of the exand button. Shown when the calendar is hidden.
    /// </summary>
    [Bindable(true)]
    [Category("Appearance")]
    [DefaultValue("PickDate")]
    [Localizable(true)]
    public string ExpandButtonLabel
    {
        get
        {
            String s = (String)ViewState[ViewStateConstants.ExpandLabel.ToString()];
            return ((s == null) ? "PickDate" : s);
        }
        set
        {
            ViewState[ViewStateConstants.ExpandLabel.ToString()] = value;
        }
    }

    /// <summary>
    /// The label of the collapse button. Shown when the calendar is visible.
    /// </summary>
    [Bindable(true)]
    [Category("Appearance")]
    [DefaultValue("Disabled")]
    [Localizable(true)]
    public string CollapseButtonLabel
    {
        get
        {
            String s = (String)ViewState[ViewStateConstants.CollapseLabel.ToString()];
            return ((s == null) ? "Disabled" : s);
        }
        set
        {
            ViewState[ViewStateConstants.CollapseLabel.ToString()] = value;
        }
    }

    /// <summary>
    /// Whether to apply the default style. Disable this if you want to apply a custom style, or to use themes and skins
    /// to style the control.
    /// </summary>
    [Category("Appearance")]
    [DefaultValue(true)]
    [Localizable(true)]
    public bool ApplyDefaultStyle
    {
        get
        {
            if (ViewState[ViewStateConstants.ApplyDefaultStyle.ToString()] == null)
            {
                ViewState[ViewStateConstants.ApplyDefaultStyle.ToString()] = true;
            }
            return (bool)ViewState[ViewStateConstants.ApplyDefaultStyle.ToString()];
        }
        set
        {
            ViewState[ViewStateConstants.ApplyDefaultStyle.ToString()] = value;
        }
    }

    /// <summary>          
    /// Causes Validation          
    /// </summary>          
    [Category("Appearance")]
    [DefaultValue(false)]
    [Localizable(false)]
    public bool CausesValidation
    {
        get
        {
            if (ViewState[ViewStateConstants.CausesValidation.ToString()] == null)
            {
                ViewState[ViewStateConstants.CausesValidation.ToString()] = false;
            }
            return (bool)ViewState[ViewStateConstants.CausesValidation.ToString()];
        }
        set
        {
            ViewState[ViewStateConstants.CausesValidation.ToString()] = value;
            btnDate.CausesValidation = value;
        }
    }

    #endregion

    #region Events

    /// <summary>
    /// A day was selected from the calendar control.
    /// </summary>
    public event EventHandler SelectionChanged;

    protected virtual void OnSelectionChanged()
    {
        if (SelectionChanged != null)   // only raise the event if someone is listening.
        {
            SelectionChanged(this, EventArgs.Empty);
        }
    }

    #endregion

    #region Event Handlers

    /// <summary>
    /// The +/- button was clicked.
    /// </summary>
    protected void btnDate_Click(object sender, System.EventArgs e)
    {
        if (!calDate.Visible)
        {
            // expand the calendar
            calDate.Visible = true;
            txtDate.Enabled = false;
            btnDate.Text = CollapseButtonLabel;
            if (DateValue != DateTime.MinValue)
            {
                calDate.SelectedDate = DateValue;
                calDate.VisibleDate = DateValue;
            }
        }
        else
        {
            // collapse the calendar
            calDate.Visible = false;
            txtDate.Enabled = true;
            btnDate.Text = ExpandButtonLabel;
        }
    }

    /// <summary>
    /// A date was selected from the calendar.
    /// </summary>
    protected void calDate_SelectionChanged(object sender, System.EventArgs e)
    {
        calDate.Visible = false;
        txtDate.Visible = true;
        btnDate.Text = ExpandButtonLabel;
        txtDate.Enabled = true;
        txtDate.Text = calDate.SelectedDate.ToShortDateString();
        OnSelectionChanged();
    }

    #endregion

    /// <summary>
    /// Builds the contents of this control.
    /// </summary>
    protected override void CreateChildControls()
    {
        btnDate.Text = ExpandButtonLabel;
        btnDate.CausesValidation = CausesValidation;
        txtDate.ID = "txtDate";

        calDate.Visible = false;

        if (ApplyDefaultStyle)
        {
            calDate.BackColor = System.Drawing.Color.White;
            calDate.BorderColor = System.Drawing.Color.FromArgb(10066329);
            calDate.CellPadding = 2;
            calDate.DayNameFormat = DayNameFormat.Shortest;
            calDate.Font.Name = "Verdana";
            calDate.Font.Size = FontUnit.Parse("8pt");
            calDate.ForeColor = System.Drawing.Color.Black;
            calDate.Height = new Unit(150, UnitType.Pixel);
            calDate.Width = new Unit(180, UnitType.Pixel);
            calDate.DayHeaderStyle.BackColor = System.Drawing.Color.FromArgb(228, 228, 228);
            calDate.DayHeaderStyle.Font.Size = FontUnit.Parse("7pt");
            calDate.TitleStyle.Font.Bold = true;
            calDate.WeekendDayStyle.BackColor = System.Drawing.Color.FromArgb(255, 255, 204);
        }

        ConnectEventHandlers();

        pnlCalendar.Controls.Add(calDate);
        pnlCalendar.Style["position"] = "absolute";
        pnlCalendar.Style["filter"] = "alpha(opacity=95)";
        pnlCalendar.Style["-moz-opacity"] = ".95";
        pnlCalendar.Style["opacity"] = ".95";
        pnlCalendar.Style["z-index"] = "2";
        pnlCalendar.Style["background-color"] = "White";

        if (CalendarPosition == CalendarDisplay.DisplayBelow)
        {
            pnlCalendar.Style["margin-top"] = "27px";
        }
        else
        {
            pnlCalendar.Style["display"] = "inline";
        }

        Controls.Add(txtDate);
        Controls.Add(pnlCalendar);
        Controls.Add(btnDate);

        base.CreateChildControls();
    }

    /// <summary>
    /// Render the contents of this control.
    /// </summary>
    /// <param name="output">The HtmlTextWriter to use.</param>
    protected override void RenderContents(HtmlTextWriter output)
    {
        switch (CalendarPosition)
        {
            case CalendarDisplay.DisplayRight:
                {
                    txtDate.RenderControl(output);
                    btnDate.RenderControl(output);
                    pnlCalendar.RenderControl(output);
                    break;
                }
            case CalendarDisplay.DisplayBelow:
                {
                    pnlCalendar.RenderControl(output);
                    txtDate.RenderControl(output);
                    btnDate.RenderControl(output);
                    break;
                }
        }
    }

    /// <summary>
    /// Connect event handlers to events.
    /// </summary>
    private void ConnectEventHandlers()
    {
        btnDate.Click += new System.EventHandler(btnDate_Click);
        calDate.SelectionChanged += new System.EventHandler(calDate_SelectionChanged);
    }

}

}

Untitled Page

使用系统;使用System.Data;使用System.Configuration;使用System.Web;使用System.Web.Security;使用System.Web.UI;使用System.Web.UI.WebControls;使用System.Web.UI.WebControls.WebParts;使用System.Web.UI.HtmlControls;

public partial class _Default:System.Web.UI.Page {protected void Page_Load(object sender,EventArgs e){

}

protected void DatePicker1_SelectionChanged(object sender, EventArgs e)
{
    Label1.Text = DatePicker1.DateValue.ToShortDateString();
    pnlLabel.Update();
}

}

2 回答

  • 1

    要使按钮成为图像,您可以将其设置为添加背景图像 .

    btnDate.style["background-image"] ="url(images/btn.jpg)";
    btnDate.text="";
    
  • 0

    在Html中,图像按钮的 type 属性为 'image'src 属性用于确定要显示的图像 . 因此,要将标准按钮更改为 image 按钮,您将:

    buttonControl.Attributes["type"] = "image";
    buttonControl.Attributes["src"] = "Foo.jpg";
    

    EDIT 如果您尝试更改单击事件中的按钮类型,则可能需要通过javascript客户端执行此操作 . 你可以通过在Click事件中注册一个启动脚本来做到这一点,如下所示:

    protected void Button_OnClick( object sender, EventArgs e )
    {
        var button = sender as Button;
        if ( button == null )
            return;
    
        var jsScript = new StringBuilder();
        jsScript.AppendFormat( "<script type=\"text/javascript\">" );
        jsScript.AppendFormat( "var button = document.getElementById(\"{0}\"); button.type = \"image\"; button.src=\"Foo.jpg\";"
                , button.ClientID);
        jsScript.Append( "</script>" );
    
        if ( !Page.ClientScript.IsStartupScriptRegistered( typeof( Page ), "resetImageButton" ) )
            Page.ClientScript.RegisterStartupScript( typeof( Page ), "resetImageButton", jsScript.ToString(), false );
    }
    

    问题是这只会在点击按钮触发回发后立即生效 . 它不会存在多个回发 . 为此,您需要在隐藏文本字段中存储标记或 ViewState ,指示按钮应该是哪种类型,然后根据该标记确定是否需要注册此启动脚本 .

相关问题